on my website https://fikasfest.netlify.app/ I have 2 forms, one on the contact page, one for the newsletter, appearing after clicking on the footer button. Both forms are functional and I can retrieve the data in my dashboard.
the problem I have is that on the newsletter form, some fields are losing attributes after deploying.
on my localhost and code, both input have a type=“text” attribute, that I also use for CSS styles.
after deploying, both fields looks ends up like this and styles are broken. also the required attribute for the second field disappear. <input name="FirstName:" placeholder="Prénom" data-v-511a3e9c=""> <input name="LastName:" placeholder="Nom*" required="" data-v-511a3e9c="">
if I edit my html in my deploy preview and add the missing tags, everything is back to normal.
Is there something I’m missing ? here is the full form for information, I’m using Nuxt <form method="post" name="newsletter-form" data-netlify="true" data-netlify-honeypot="bot-field"> <input type="hidden" name="form-name" value="newsletter-form" /> <input type="hidden" name="bot-field" /> <input type="text" name="FirstName:" :placeholder="$t('contact.first')" /> <input type="text" name="LastName:" :placeholder="$t('contact.last')" required /> <input type="email" name="Email:" :placeholder="$t('contact.email')" required /> <input type="submit" :value="$t('contact.submit')" /> </form>
Hiya, sorry you are having trouble getting forms to work.
This Support Guide is the first port of call to debug any forms issues. There are also many other Support Guides for forms - you can find them here: #Netlify-support:support-guides
We also recommend trying to search the forums or look at topics tagged Netlify forms if you haven’t already - it’s likely your question was already asked by someone else!
If you are still having problems, please provide more information such as what you have already tried, the form name, and a link to your live form.
Keep in mind that the form is working as I can see my submissions in my dashboard. It’s only the markup that is changing on deploy.
For information, the other form contact-form on the website at fikas is working well and don’t have any issues, expect for that style tag that is added.
This is the same form at Netlify as I get locally when building.
I’m not sure what is happening but it is something in the site build itself. Our support team can troubleshoot issues involving our services. However, as this build issue happens outside of Netlify as well it isn’t Netlify related.
Questions like this are welcome on our community site but our scope of support means our support team won’t be able to answer this question.
Someone else here might have an answer and, if so, other people are welcome to add posts here anytime. If there are Netlify specific questions or if there are any questions about our support scope, please reply here anytime.
Indeed, it was coming from the Nuxt generate command at build. Nuxt uses a html-minifier that will remove all redundant attributs like type="text" on markup.
nuxt generate use the html-minifier lib to minify the *.vue pages ( cf. generator.js script)
It’s not an issue, but a compression feature call removeRedundantAttributes . type=text is remove because it’s already the default value of type, so it’s like redundant.