HTML form code

  • Profile Image
    pickupchange
    Asked on December 14, 2016 at 07:17 AM

    Hello,
    I'm integrating my jot forms with a popup service, and when I connect the form in the popup through html code, it creates 2 more input fields that I don't need.

    If you want to check through my forms, it's the Tinder form.

    I could take away the "Source" field, but anyway there is the last "input" that should be about the website to redirect the subscriber...

    How can I cover those last 2 fields?

    Thanks
    Alessandro

  • Profile Image
    seth
    Answered on December 14, 2016 at 07:24 AM

    Hello,

    I think there is an issue with the code that you use to embed JotForm or the HTML that you embed JotForm into. Could you please tell us which embed option did you use? You can check from here:

    https://www.jotform.com/help/67-Which-form-embed-code-should-I-use

    Also could you please send us the web site URL, or the source code you are using for letting us to investigate the issue further?

    We are awaiting your response.

    Regards.

  • Profile Image
    pickupchange
    Answered on December 14, 2016 at 07:42 AM

    Hello Seth,
    I'm using a plugin for wordpress called Thrive Leads. It allows me to add the form html code and it creates the input fields in the popup.

    I copy the source code, and at the end the popup works perfectly.

    The problem is that it creates those 2 additional fields that I can't hide.

    I paste below the source code I'm using.

    <script src="https://cdn.jotfor.ms/static/prototype.forms.js" type="text/javascript"></script> <script src="https://cdn.jotfor.ms/static/jotform.forms.js?3.3.16099" type="text/javascript"></script> <script type="text/javascript"> JotForm.init(function(){ setTimeout(function() { $('input_4').hint('Enter your name'); }, 20); setTimeout(function() { $('input_3').hint('Enter your Email address'); }, 20); JotForm.clearFieldOnHide="disable"; JotForm.onSubmissionError="jumpToSubmit"; }); </script> <link target="_blank" href="https://cdn.jotfor.ms/static/formCss.css?3.3.16099" rel="nofollow noopener" rel="stylesheet" type="text/css" /> <link type="text/css" rel="stylesheet" target="_blank" href="https://cdn.jotfor.ms/css/styles/nova.css?3.3.16099" rel="nofollow noopener" /> <link type="text/css" media="print" rel="stylesheet" target="_blank" href="https://cdn.jotfor.ms/css/printForm.css?3.3.16099" rel="nofollow noopener" /> <style type="text/css"> .form-label-left{ width:150px !important; } .form-line{ padding-top:12px; padding-bottom:12px; } .form-label-right{ width:150px !important; } .form-all{ width:650px; color:#555 !important; font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, sans-serif; font-size:14px; } .form-radio-item label, .form-checkbox-item label, .form-grading-label, .form-header{ color: #555; } </style> <form class="jotform-form" action="https://submit.jotformeu.com/submit/60812728043351/" method="post" name="form_60812728043351" id="60812728043351" accept-charset="utf-8"> <input type="hidden" name="formID" value="60812728043351" /> <div class="form-all"> <ul class="form-section page-section"> <li class="form-line jf-required" data-type="control_textbox" id="id_4"> <label class="form-label form-label-left form-label-auto" id="label_4" for="input_4"> Name <span class="form-required"> * </span> </label> <div id="cid_4" class="form-input jf-required"> <input type="text" class=" form-textbox validate[required]" data-type="input-textbox" id="input_4" name="q4_name" size="20" value="" /> </div> </li> <li class="form-line jf-required" data-type="control_email" id="id_3"> <label class="form-label form-label-left form-label-auto" id="label_3" for="input_3"> E-mail <span class="form-required"> * </span> </label> <div id="cid_3" class="form-input jf-required"> <input type="email" class=" form-textbox validate[required, Email]" id="input_3" name="q3_email" size="30" value="" /> </div> </li> <li class="form-line" data-type="control_textbox" id="id_5"> <label class="form-label form-label-left form-label-auto" id="label_5" for="input_5"> Source </label> <div id="cid_5" class="form-input jf-required"> <input type="text" class=" form-textbox" data-type="input-textbox" id="input_5" name="q5_source" size="20" value="landing page" /> </div> </li> <li class="form-line" data-type="control_button" id="id_2"> <div id="cid_2" class="form-input-wide"> <div style="margin-left:156px;" class="form-buttons-wrapper"> <button id="input_2" type="submit" class="form-submit-button" data-component="button"> Submit </button> </div> </div> </li> <li style="display:none"> Should be Empty: <input type="text" name="website" value="" /> </li> </ul> </div> <input type="hidden" id="simple_spc" name="simple_spc" value="60812728043351" /> <script type="text/javascript"> document.getElementById("si" + "mple" + "_spc").value = "60812728043351-60812728043351"; </script> </form> <script type="text/javascript">JotForm.ownerView=true;</script>

  • Profile Image
    Chriistian
    Answered on December 14, 2016 at 08:03 AM

    Can you try to re-embed your form to your site using the iFrame embed code and see if this will fix the issue? To get the iFrame embed code of your form, just follow the instructions provided on this article: Getting the form iFrame code.

     

    If the issue still persists, can you provide us the exact URL of your website where the form was embedded so we can further investigate?

  • Profile Image
    pickupchange
    Answered on December 14, 2016 at 09:15 AM

    At the end I found out how to change this thing with CSS.

    Thanks for your help