What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Terms of use widget is not working on Internet Explorer

    Asked by MelanieMackenzie on September 27, 2015 at 10:46 PM

    Hello,

     

    The checkbox does not seem to work on the JotForm on Internet Explorer.


    It will not allow the box to be ticked, and consequently the form cannot be submitted.

     

    Please advise if there is updated coding for the form that should be used on IE.

     

    MT!

     

     

    Page URL:
    https://secure.jotformpro.com/form/52147512604953

    Screenshot
    JotForm checkbox Updated terms of use
  • Profile Image

    Answered by Ben on September 28, 2015 at 04:40 AM

    Based on your screenshot, the issue is not with the IE (per say) but with the widget not being loaded for some reason.

    What I would suggest is to use a different Terms of Use setup.

    For example, you can have the same setup by adding the following to your form:

    -- If you want to have the link to your terms of use --

    1. Add a checkbox to your form

    2. then in the options add the following:

    <span id="ben_terms">I agree to be bound by the <a target="_blank" href="{TermsLink}">{TermsKeyword}</a> in their entirety.</span>

    3. change the {TermsLink} into the link to your terms and conditions

    4. Change the {TermsKeyword} to what you would like the link to show

    - A good example of this is the link: http://www.jotform.com hidden behind a keyword JotForm.

    5. Once you have added this, you should add the following CSS to your form:

    #ben_terms {
        color: #999;
        font-size: 16px;
        line-height: 24px;
    }
    #ben_terms > a {
        color: #228acf;
    }

    You can see how to do that here: Inject Custom CSS Codes

    6. You find out the ID of this new checkbox as shown here: How to find Field IDs & Names (we only use the number so #input_569_0, would be 569)

    7. Apply the ID instead of {id} to the following CSS and add the CSS to your form as above:

    #input_{id}_0 {
        border: 1px solid gray;
        box-shadow: none;
        height: 20px;
        width: 20px;
    }
    #cid_{id} {
        display: inline;
        float: left;
        width: 95%;
    }

    It might seem as a lot, but this will work on all browsers.

    You can see how this looks here (with terms showing jotform terms of use): http://form.jotformpro.com/form/52702228812955

    Now, there is also another way to set this up:

    -- If you do not want to have the link to the terms of use --

    There are less steps to achieve this since we do not have the link

    1. Add checkbox to your form

    2. set one option titled in any manner that you wish

    3. find the ID of the field as above: How to find Field IDs & Names where we again, only grab the number

    4. apply the following CSS to your form as shown here: Inject Custom CSS Codes while changing the {id} with the ID from above:

    #id_{id}:hover .form-checkbox-item:after {
        color: red;
        content: "REQUIRED";
        font-weight: bold;
        margin-left: 20px;
    }
    #id_{id} .form-checkbox-item {
        font-size: 16px;
    }

    You can see how this would look here: http://form.jotformpro.com/form/52702599636970

    If you wish, you can also simply clone the forms to your own account and only make the small changes to the field. You can do that by following the steps here: How to Clone an Existing Form from a URL

    Do let us know how it goes :)