Visual Options in A Form

WebmistressM · 2012-11-16 23:26:12

Hello

I currently run my portfolio site off of Text Pattern. However, I have one problem. I doubt its “the fault” of TextPattern itself and moreso an indicator of the shortcomings of how forms (in general) work. However, I figured that it was best to ask here anyway since there may be a textpattern-oriented solution which will integrate fine with my website which is already built using TextPattern.

Basically, I have a big questionaire Id like to provide clients with so they can discuss with me the type of work they want done on something. In order to gauge my customers visual preferences, many of my questions are going to be like “choose from the following images. Which one looks best?”. So, how does one make a form where one of the options available has an image instead of text?

I had tried using Google Forms to test this and it seems they dont support a visual image as an option either. Likely this is just a matter of “web forms simply dont work this way” but Im trying to figure out a solution for those who do not want to download a pdf of my form, fill it out, re-scan it onto their machines and email it to me.

whaleen · 2012-11-17 00:07:46

So, how does one make a form where one of the options available has an image instead of text?

Look here? (as an example of a script I might try testing to get my forms doing what you want)

You’ll have to be looking at what you can do with javascript to use normal form elements such as multi-selects and radio buttons to submit their choices. You can use javascript and CSS to show your users stylized options as their choices.

If you had this:

Q: What is your fav design attitude?

A: Post Modern, Beer, Gross

You could make a radio button for each of the three answers and use CSS, and some Javascript, to display the image that represents that answer as a background image in that radio elements space (span, div, whatever).

It all depends… It’s front-end stuff though, not something Textpattern manages. Textpattern manages how stuff gets into and out of the database. What things look like to users of websites is a different animal. The presentational layer of websites. jQuery and CSS and web forms are where I believe you must start poking.

Does that make any damn sense?

Last edited by whaleen (2012-11-17 00:08:45)

whaleen · 2012-11-17 00:12:00

…and I believe zem_contact_reborn is the supported way to offer email forms here in TXP land.

joebaich · 2012-11-17 06:30:32

Whaleen’s idea with background images is a good one. But is a row or column of images with suitable captions to identify them followed by an appropriate ZCR form with radio buttons or check boxes (i.e. single or multiple choices) with labels that correspond to the image captions too basic for you?

WebmistressM · 2012-11-18 01:59:12

whaleen wrote:

bq. So, how does one make a form where one of the options available has an image instead of text?

Look here? (as an example of a script I might try testing to get my forms doing what you want)
……

It all depends… It’s front-end stuff though, not something Textpattern manages. Textpattern manages how stuff gets into and out of the database. What things look like to users of websites is a different animal. The presentational layer of websites. jQuery and CSS and web forms are where I believe you must start poking.

Does that make any damn sense?

***********

Yes. Yes it does. Thats kind of what I am going for. Sadly javascript is not something I write or work with on a regular basis so I suppose I will have to use this llink as an example and see how to integrate this into zem contact form reborn

Textpattern CMS

Textpattern CMS support forum

#1 2012-11-16 23:26:12

Visual Options in A Form

#2 2012-11-17 00:07:46

Re: Visual Options in A Form

#3 2012-11-17 00:12:00

Re: Visual Options in A Form

#4 2012-11-17 06:30:32

Re: Visual Options in A Form

#5 2012-11-18 01:59:12

Re: Visual Options in A Form

Board footer