Support » Plugin: MC4WP: Mailchimp for WordPress » An invalid form control with name=’FNAME’ is not focusable.

  • Resolved Michael Galli

    (@galliweb)


    Hey there, I´m not sure why the integrated mailchimp forms doesn´t work anymore.
    When clicking on “Anmelden” (submit) on the last step of the form nothing happens.

    In the browser console log, there are the following errors appearing:
    – An invalid form control with name=’FNAME’ is not focusable.
    – An invalid form control with name=’EMAIL’ is not focusable.
    – An invalid form control with name=’_mc4wp_agree_to_terms’ is not focusable.

    Does it have something to do with the Mailchimp Form?
    The code of the forms is like this:

    <div class="mc-ec-form">
        <input class="mc-input" type="text" name="FNAME" placeholder="Dein Vorname" required>  
        <input class="mc-input" type="email" name="EMAIL" placeholder="Deine E-Mail Adresse" required>
    	<input type="hidden" name="INTERESTS[772a6cf830]" value="Männer Abnehmen">
        <input type="hidden" name="GESCHLECHT" value="ein Mann">
      	<p class="checktext mc-checkbox-text">
        <input class="check mc-checkbox" name="_mc4wp_agree_to_terms" type="checkbox" value="1" required>E-Mail Kontakt zustimmen</p>
        <input class="mc-submit" type="submit" value="Anmelden">
    </div>

    We use different forms based on the selection of the user.
    The multi step form is the superforms plugin, we integrate the mc form shortcodes in the last step there.

    Do you have a hint for me?
    Best regards
    Mike

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Contributor Lap

    (@lapzor)

    That code looks like it’s copied from a MailChimp embedded form, if you use Mailchimp for WordPress it’s best to build the form in our plugin and not copy code over from somewhere else.

    I clicked the link you attached to this forum post but I didn’t see a Mailchimp for WordPress form on that page. Where can I see the form / how to make the form visible on your site?

    Thanks!

    Thread Starter Michael Galli

    (@galliweb)

    hey there, thanks for your reply.

    in order to see the mc form, you have to choose some steps in the multi step form. In the last step, there is the mc form.

    based on the selection of the steps, there appears a different mc form in the last step. There are 8 different mc forms possible to appear in the last step.

    I can´t build the code only in your plugin due to that hidden field that I can´t select and embed in the plugin.
    <input type="hidden" name="INTERESTS[772a6cf830]" value="Frauen Abnehmen">

    And it worked before so I´m not sure why it stopped working.

    • This reply was modified 2 years, 5 months ago by Michael Galli. Reason: precision
    • This reply was modified 2 years, 5 months ago by Michael Galli.
    Plugin Contributor Lap

    (@lapzor)

    If the interest groups are correct you should be able to insert those via our form builder, if you can’t that that is very likely the reason the form doesn’t work.

    There should be a button above the form builder for the interest group. You can click that and insert them as checkboxes and then change the code from type=”checkbox” to type=”hidden”

    Please remove the code that you copied over from MailChimp, especially JavaScript code if any.

    Hope that helps. If you have any questions, please let me know!

    Thread Starter Michael Galli

    (@galliweb)

    Hey there, thank you for your reply.

    I didn´t see that button first.
    Yeah we are able to add the interest group via form builder.

    I just created a new form and only added the fields via form builder and then tested again. I still can´t submit the form. The browser errors still appear.

    I inserted only the buttons in the form builder and didn´t change the markup. The errors still appear.

    I didn´t copy the form over from MailChimp. I added it via form builder and gave the form some markup in order to be able to style it properly via css.

    <div class="mc-ec-form">
        <input class="mc-input" type="text" name="FNAME" placeholder="Dein Vorname" required>  
        <input class="mc-input" type="email" name="EMAIL" placeholder="Deine E-Mail Adresse" required>
    	<input type="hidden" name="INTERESTS[772a6cf830]" value="Frauen Muskelaufbau">
        <input type="hidden" name="GESCHLECHT" value="eine Frau">
        <p class="checktext mc-checkbox-text">
        <input class="check mc-checkbox" name="_mc4wp_agree_to_terms" type="checkbox" value="1" required>E-Mail Kontakt zustimmen</p>
        <input class="mc-submit" type="submit" value="Anmelden">
    </div>

    The fields name=”EMAIL”, name=”FNAME”, name=”INTERESTS[772a6cf830]”, name=”GESCHLECHT”, name=”_mc4wp_agree_to_terms” and the type=”submit” button are all added via buttons in the form builder.

    So I´m not sure what causes the error. I asked the dev of the super forms plugin and he said it is an error triggered from the MC for WordPress plugin.

    Your plugin worked before so I´m not sure what happened after the migration to a new site. it´s a 1 to 1 copy with the exact same domain.

    Plugin Contributor Lap

    (@lapzor)

    The problem is that the form is enclosed within another <from> tag. Can you make it so that the Mailchimp for WordPress shortcode is not within another form?

    Hope that helps. If you have any questions, please let me know!

    Thread Starter Michael Galli

    (@galliweb)

    No I can´t make that the Mailchimp for WordPress Shortcode is not within another form.

    It has to be in the multi step form. And it worked before, over a year. Exactly as it is now. But it stopped working and I don´t know why.

    So it can´t be the problem that it is within another <form> tag, because it worked before.

    Plugin Contributor Harish Chouhan

    (@hchouhan)

    Hello,

    While it’s hard for us to know why the form worked earlier and not now, to test if there is an issue with our form, please place our form on a new test page without any additional code or multi-form steps and share with us a link to that page so we can test.

    Thread Starter Michael Galli

    (@galliweb)

    Hello there, we finally found the source of the error. It had something to do with a new feature that was added to do “POST” requests in the form plugin. That´s why it stopped working. I tested your plugin on different sites and it worked fine.

    Thank you for your effort and time. It was like finding a piece of sand in a desert :S

    Plugin Contributor Harish Chouhan

    (@hchouhan)

    Hey @galliweb,

    Thanks for the update.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘An invalid form control with name=’FNAME’ is not focusable.’ is closed to new replies.