required multiple choice element in source code

Hello,

I downloaded the source code for one of my forms that does contain a multiple choice field. The multiple choice field is set to "required" as I need my customers to check at least one box before they are allowed to submit the form.

However, when using the source code all boxes are mandatory instead, i.e. the form can only be submitted if the customer does check all boxes. Which makes the multiple choice list quite useless.

I guess that this is an error in how the source code is created from the form in the publish section of the form builder.

The resulting source code is like this:

      <li class="form-line jf-required" data-type="control_checkbox" id="id_6">
        <label class="form-label form-label-left form-label-auto" id="label_6" for="input_6_0">
          Themengebiete
          <span class="form-required">
            *
          </span>
        </label>
        <div id="cid_6" class="form-input jf-required">
          <div class="form-single-column" data-component="checkbox">
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_0" name="q6_themengebiete[]" value="Security &amp; Compliance" data-calcvalue="123" required="" />
              <label id="label_input_6_0" for="input_6_0"> Security & Compliance </label>
            </span>
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_1" name="q6_themengebiete[]" value="Service Management" data-calcvalue="234" required="" />
              <label id="label_input_6_1" for="input_6_1"> Service Management </label>
            </span>
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_2" name="q6_themengebiete[]" value="Software Packaging" data-calcvalue="345" required="" />
              <label id="label_input_6_2" for="input_6_2"> Software Packaging </label>
            </span>
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_3" name="q6_themengebiete[]" value="Endpoint Management" data-calcvalue="456" required="" />
              <label id="label_input_6_3" for="input_6_3"> Endpoint Management </label>
            </span>
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_4" name="q6_themengebiete[]" value="Managed Services" data-calcvalue="567" required="" />
              <label id="label_input_6_4" for="input_6_4"> Managed Services </label>
            </span>
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_5" name="q6_themengebiete[]" value="Ontrex Schulungen" data-calcvalue="678" required="" />
              <label id="label_input_6_5" for="input_6_5"> Ontrex Schulungen </label>
            </span>
            <span class="form-checkbox-item" style="clear:left;">
              <span class="dragger-item">
              </span>
              <input type="checkbox" class="form-checkbox validate[required]" id="input_6_6" name="q6_themengebiete[]" checked="" value="Allgemeine Informationen zu Ontrex" data-calcvalue="789" required="" />
              <label id="label_input_6_6" for="input_6_6"> Allgemeine Informationen zu Ontrex </label>
            </span>
          </div>
        </div>
      </li>

From my understanding there are a few to many input type="checkbox" class="form-checkbox validate[required]" statements in there; something like that shouldn't be per checkbox, but only once for the whole list.

How can I change the source code so that the multiple choice field per se is required, but behaves just like the embedded <script> version? Or better: can you fix the way the source code is created so that the multiple choice field behaves correctly?

Thanks...

I was able to replicate this issue. Let me do some test first, I will get back to you after a moment.

Thank you.

Upon doing another test. It seems that the Multiple Choice field is correctly working using the embedded Source Code.

And you just need to select atleast 1 option.

Please see the attached GIF image above. This is by using the Downloaded Source Code

Have you embedded the Full Source Code on your live website ? Can you please tell us the website URL so we can check further.

Thank you, 

The original form is https://form.jotformeu.com/80213558527356

The source code intergration can be found at http://ontrex.koch-k.com/anmeldung-newsletter/ (note: please select the DE version of this website from the language selection menu)

It may be that the Typo3 System we are using for our websites does not understand certain parts of the source code. For example, I cannot use embedded js scripting, e.g 

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

but always have to put this into a file and then a statement with src in it

<script src="myscripts.js"></script>

The source code generated by JotForm has been edited by me to remove such embedded statements and put those into src ja files (see code on website http://ontrex.koch-k.com/anmeldung-newsletter/)

I believe using the iFrame Embed code should work with your website. Or you can copy the code below.

<iframe

      id="JotFormIFrame-80213558527356"

      onDISABLEDload="window.parent.scrollTo(0,0)"

      allowtransparency="true"

      allowfullscreen="true"

      src="https://form.jotformeu.com/80213558527356"

      frameborder="0"

      style="width: 1px;

      min-width: 100%;

      height:539px;

      border:none;"

      scrolling="no" >

    </iframe>

I also removed the <script></Script> part.

Please let us know if it still doesn't work after using that code.

This does work, but I'm not sure if it does solve my initial problem behind why I wanted to embed the source code instead of using the "traditional" <script type="text/javascript" src="https://form.jotformeu.com/jsform/80213558527356"></script> (which does work fine for me on my website).

The reason was that we have customers that block the JotForm websites in their company's environment. They allow access to our website, but if I use the <script type="text/javascript" src="https://form.jotformeu.com/jsform/80213558527356"></script> the form will not be displayed. Also the direct link https://form.jotformeu.com/80213558527356 does not work from their company's network.

So I was looking for a method to bring the code to our website, without referring back to a JotForm URL. I believe your solution with the iFrame will go back to JotForm (i.e. the src statement) and therefore wouldn't work from said company's environment either if they visit our website.

But perhaps I will just have to live with some visitors of our website not being able to view forms due to their company's restrictions?

Thank you for your the additional information and the reason why you are using the source code method in embedding.

I believe modifying the SRC/Javascripts will cause the form to malfunction since our Widgets are not stored locally even with the source code embed, they are still communicating with Jotform's server.

So they still might need to whitelist Jotform's domain or IP addresses so that the form will work correctly and just use the iFrame Embed.

Most people use the Source Code is when they add their extra javascript codes such as Trackers or other stuffs but modifying it will cause it to malfunction.

Hope this helps.