PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Images In Multi-Page Form

  1. mrhoneyfoot
    Member

    Hi guys.

    Another Question. Is it possible to include images in a multi-page form? For instance as multiple choice selections?

    My goal is to build a form that allows users to generate a quote for multiple products, one at a time, prices being generated by their selection, and measurements inputted after their selection. Similar to http://www.doubleglazingontheweb.co.uk/quote_step2_styles.php

    I know this isn't really what gravity forms are designed for. Is it too ambitious?

    Posted 11 years ago on Tuesday January 18, 2011 | Permalink
  2. mrhoneyfoot
    Member

    That looks like one way of doing it. However, I want to be a bit more ambitious. Instead of just having the images there in the background, is it possible to have a user click the image to select that option? Instead of having to locate the radio button at the side of image.

    Additionally, I have way more images in mind. Is it possible to add around 60-80 images as multiple-choice options? In other words, can multiple choices in the same form field be spread over a few pages in a multi-page form? Or is that too much?

    Thanks again illionisharley.

    Posted 11 years ago on Tuesday January 18, 2011 | Permalink
  3. This is possible; however, for 60 - 80 images it would be quite tedious. Something like this should get you started:

    http://pastie.org/1474491

    There is no way to split a form field up over multiple pages as a form field is limited to one page.

    Posted 11 years ago on Tuesday January 18, 2011 | Permalink
  4. mrhoneyfoot
    Member

    Thanks for that David.

    So am I right in thinking the code would have to continue like the following:

    $choice_html = str_replace('>First Choice<', '><img src=".......
    $choice_html = str_replace('>Second Choice<', '><img src=".......
    $choice_html = str_replace('>Third Choice<', '><img src=".......

    ... and so on? With my manually inputting each url. I don't mind how long that might take. Only that it works.

    Of course it wouldn't look good with them all on the same page. I will keep the numbers down to 60 images, and spread them across 5 fields (and therefore 5 pages) of 12 each.

    My intention is to use conditional logic to allow users to browse the 5 pages without selecting anything, but allow them no further until one is selected. Essentially to emulate a single field. Would the logic be possible along such lines? For example:

    Always show 'Next Styles' & 'Previous Styles' buttons to simulate browsing back and forth.

    AND

    Show 'Continue to Measurements' Button if ANY OF the following are true:

    Styles field 1 ANY choice selected
    Styles field 2 ANY choice selected
    Styles field 3 ANY choice selected
    Styles field 4 ANY choice selected
    Styles field 5 ANY choice selected

    Is this possible?

    Really appreciate this support. Best support on any forum for any product I've ever bought online.

    Posted 11 years ago on Wednesday January 19, 2011 | Permalink
  5. mrhoneyfoot - you might consider xScape Framework and GD Custom Taxonomy plugin they have full integration and support for Gravity Forms and now very rich image handling as of Jan 2011. Milan is a good guy and very capable. His products are taking off in new capability right now.

    POST EXPLAINATION:
    http://www.dev4press.com/2011/blog/plugins/gd-custom-posts-and-taxonomies-tools-2-5-pro/comment-page-1/#comment-8883

    DEMO:
    http://www.dev4press.com/2011/tutorials/plugins-tutorials/gd-taxonomies-tools/enhance-wordpress-taxonomy-terms-images/

    This is not an answer to your Q here - but a heads up to maybe attack it from another angle if not being able to spread a form field over multiple pages ends up a show stopper down this path.

    Greg

    Posted 11 years ago on Wednesday January 19, 2011 | Permalink
  6. Hi mrhoneyfoot,

    Your assumption on how the continuing code would look is correct.

    Based on your description, Gravity Forms is able to function in that way. Clever idea. :)

    Posted 11 years ago on Wednesday January 19, 2011 | Permalink
  7. mrhoneyfoot
    Member

    Thanks GregH. Milan's work looks interesting but I'm not sure how to integrate it into gravity forms. Does his xScape framework just make attaching images easier?

    David Smith, unfortunately I've run into some problems with the logic before getting around to the images.

    Firstly, the hidden form submit button only appears on the last page break once ANY option in any field is selected, rather than on the current page-break. So for usability it's problematic. Any way around that?

    Secondly, users can select more than one choice from the 5 fields. This creates a problem when trying to send the field data to another form. So emulating a single field across multiple pages doesn't seem to be workable in this way.

    Is there a way to have the 60 images as part of the same field and display them in three rows, with 20 columns, and showing only 4 columns at a time at a time inside a html horizontal slider? Or is that unrealistic?

    I am impressed with gravity forms, but please, if I'm dreaming an impossible dream just let me know. If you think the solution is to be found outside gravity forms, speak up. Like GregH. Thanks man. Wish I understood what you are recommending though.

    Posted 11 years ago on Thursday January 20, 2011 | Permalink
  8. David Smith - Is it possible to have a two page form where you upload couple of images on the first page and then use them as an checkbox options on the second?

    Posted 11 years ago on Friday January 28, 2011 | Permalink
  9. Gwolf
    Member

    Hi mrhoneyfoot, we are working on a similiar project - forms with loads of images as options.Is there a way to contact you for advice about your solution.
    Thank you.

    Posted 11 years ago on Monday January 31, 2011 | Permalink
  10. @Tiedemies, The images are not actually uploaded until the form is actually submitted, so unfortunately this would not be possible.

    @MrHoneyfoot, operating under the premise of having several pages worth of images that are intended to work as a "linked" field, I still believe this is possible.

    Firstly, the hidden form submit button only appears on the last page break once ANY option in any field is selected, rather than on the current page-break. So for usability it's problematic. Any way around that?

    You can use page logic to determine if any of the 60 options has been selected. Here is a very basic example of page logic: http://grab.by/8GH8

    So the second page will not show at all if one of the options from the first page is selected. This would become very tedious having to add in all those conditions as each page would require conditions for all the preceding pages... but in regards to being possible, yes that would work.

    Secondly, users can select more than one choice from the 5 fields. This creates a problem when trying to send the field data to another form. So emulating a single field across multiple pages doesn't seem to be workable in this way.

    If you are using check boxes they would be able to select more than one by the nature of the field itself. However if you use radio buttons this could be prevented (in combination with the above information).

    It'll take some work to make this happen, but I believe it is possible. Let me know if you run into any other issues.

    Posted 11 years ago on Monday January 31, 2011 | Permalink
  11. @David Smith - Thanks, I figured it might be so. What about loading the images dynamically? Would that be possible? If there is a certain path to the image files, could Gravity Forms load the images from that path as options, instead of direct links?

    Posted 11 years ago on Monday January 31, 2011 | Permalink
  12. mrhoneyfoot
    Member

    @David Smith. Thanks for the explanation. I'll pursue this solution again. In the meantime I went down the route of making a plain html page with image options functioning as links to a gform with query strings. I'm trying to send the image in the query string to a html block. Is that possible?

    @Gwolf. What's your e-mail address?

    Posted 11 years ago on Tuesday February 1, 2011 | Permalink
  13. @Tiedemies, sorry I didn't follow what you were suggesting. Could give me some more details of what you had in mind?

    @MrHonyeFoot, it is possible to sent the URL of the image through the query string and then adding the image to the content of the HTML block before it is rendered using the "gform_pre_render" hook.

    Posted 11 years ago on Tuesday February 1, 2011 | Permalink
  14. @David Smith - I meant that if you know a path to a folder (i.e. photo album as in ../files/photo_album/), could Gravity Forms load image files from that folder dynamically (without the need of typing each image's exact path and filename) as selectable options?

    Posted 11 years ago on Tuesday February 1, 2011 | Permalink
  15. mrhoneyfoot
    Member

    @David Smith, that's almost exactly what I want to achieve. How do you set the parameter that the html block is trying to catch? Can't do it using gforms ui. Can you post a sample snippet?

    I'd love to find out how you do that. My workaround from not knowing how involves 72 separate html blocks. Each containing an image and using conditional logic. Finding a solution for just one block would be awesome.

    Alex Cancado mentioned the pre_render hook in a similar post, but I'm not sure how it works: http://forum.gravityhelp.com/topic/allow-html-block-to-be-dynamically-populated

    Posted 11 years ago on Tuesday February 1, 2011 | Permalink
  16. mrhoneyfoot
    Member

    @ David Smith, regarding the snippet you posted earlier (http://pastie.org/1474491) I'm trying to replace images in a second field. How do I repeat the function again? The first field I'm trying to apply it to works fine, anything after that fails. Am I doing it wrong?

    Posted 11 years ago on Wednesday February 2, 2011 | Permalink
  17. Hi MrHoneyfoot,

    Here is how you would replace multiple options for multiple fields:

    http://pastie.org/1522610

    Posted 11 years ago on Wednesday February 2, 2011 | Permalink
  18. mrhoneyfoot
    Member

    Thanks David. Much appreciated as always.

    Posted 11 years ago on Thursday February 3, 2011 | Permalink