Two Submit buttons - Two thankyou URLs (no conditions)

  • Swoodruff2002
    Asked on October 1, 2015 at 11:42 PM

    Have I have two Submit buttons at the end of my form and two thankyou URLs? I know I can use conditional Logic to direct the thanyou URL, but I want the user to have a choice which option to choose:

     

    BOOK AN APPOINTMENT   & BACK TO NEWS

    My form is not collection any other data, so I have no fields to define conditional logic...

    http://www.jotform.com//?formID=52637143439963

    http://screencast.com/t/semcaHHYkH

     

    Thanks,

     

    Steve

     

     

     

     

     

     

  • Elton Support Team Lead
    Replied on October 2, 2015 at 5:42 AM

    Unfortunately, you can't achieve that with only submit buttons on form. You can't perform condition with the submit buttons itself. It has to be fields to trigger conditions.

    However, I believe that can be easily achieved through simple hyperlinks then add custom CSS codes so the hyperlink text would look like buttons.

    Here's how:

    1. Delete the two submit buttons on your form.

    2. Add a text tool and place the following codes. Make sure to replace the text I have highlighted in green with the actual URL you want each buttons to redirect to.

    <a class="redbutton" style="margin-right:60px;" href="YOUR BOOKING LINK HERE">BOOK A CALL</a><a class="redbutton" href="YOUR NEWS LINK HERE">BACK TO NEWS</a>

    Here's a visual guide:

    Two Submit buttons   Two thankyou URLs (no conditions) Image 1 Screenshot 20

    3. Inject this CSS codes to your form so these hyperlinks would look like buttons.

    .redbutton{text-decoration:none;border: 1px solid #a60000 !important;background: #e60d00;padding: 9px 15px;font-family: "Trebuchet MS", sans-serif;font-size: 14px;cursor: pointer;border-radius: .5em;box-shadow: inset 0px 1px 0px 0px #f29d93;color: #FFF;font-weight: bold;text-shadow: -1px -1px 0px #a60000;}

    Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes-to-your-Form

    If you need further help, let us know.

  • Swoodruff2002
    Replied on October 2, 2015 at 2:47 PM
    Thanks – While I was waiting for a response, I tried something similar… I use images the look like buttons, and then gave each one a URL link. See http://form.jotformpro.com/form/52739054791968?


    But for some reason the button image has an odd outline/boarder around it. Could be the size of the source image –adjusting that now.

    Thoughts?

    Steve

    ...
  • Mike
    Replied on October 2, 2015 at 4:17 PM

    The issue seems to be caused by form styles. This is possible to add the next CSS via form designer in order to remove the outline border from images.

    li[data-type="control_image"] img {
    border-style: none !important;
    }

    Two Submit buttons   Two thankyou URLs (no conditions) Image 1 Screenshot 30

    Two Submit buttons   Two thankyou URLs (no conditions) Image 2 Screenshot 41

    If you need any further assistance, please let us know.

  • Swoodruff2002
    Replied on October 2, 2015 at 4:47 PM
    Sorry where does this go? I went to designer and highlighted the image of the button, and added the
    li[data-type="control_image"] img {
    border-style: none !important;
    }
    But preview is still showing outline: http://screencast.com/t/N5aWF8CYGN

    Steve


    ...
  • Mike
    Replied on October 2, 2015 at 5:58 PM

    You have added it correctly, but code was not working since there were two CSS errors (missing brace and missing semicolon).

    Two Submit buttons   Two thankyou URLs (no conditions) Image 1 Screenshot 20

    I have fixed the CSS errors, so the form should be fine now. Thank you.