I have a full Roots site that has been built over the last year. I am using Ninja Forms to create a couple forms, and I am unable to type into any input fields. (note: I can type in Text Areas just fine). I’m very confused, as I did a gulp clean and then reloaded one of the ninja forms preview pages and was still unable to type anything. This leads me to believe it is not a CSS/JS issue from my theme’s CSS/JS, but I am very confused at what is causing the issue.
If I switch to Twenty Fifteen, the inputs behave fine. Also (with my theme active) if I delete the key listeners that Ninja Forms adds to the input fields, the inputs behave fine. Even stranger behavior, the inputs work on mobile.
When I say that an input doesn’t work, I mean that I can click on the input and see my cursor, but no text is able to be typed.
Does anyone have any experience with this or have any ideas about what may be the cause? I am using the latest Ninja Forms and WP.
Any chance for a link? There are so many possibilities. But, feels like a js problem to me.
The site is hosted at salonvoandspa.com, click Career Services for the problem form.
The strange part about the JS is that the form works with the default theme, but not with mine even when I don’t include any JS other than JQuery.
Good news: Not a Roots issue.
Bad news: There seems to be a sort-of-known conflict between Ninja Forms and Jasny Bootstrap’s javascript. You’re not alone out there in experiencing the issue, but a quick search failed to turn up a posted solution/workaround.
This appears to be the issue on your page as removing the Jasny Bootstrap js allows typing in your form fields. Didn’t look too close, but guessing you’re using Jasny for the offcanvas menu and maybe the data mask on the phone number form field.
See: http://stackoverflow.com/questions/25440788/unable-to-type-in-ninja-forms-textbox
Wow, thank you for tracking that down!
How are you able to remove that one js in the browser and get the forms to work?
YW. To be honest, I have no idea if the submission aspect works without the Jasny Bootstrap script. I only looked at whether the input functioned as needed without it active.
So I’m trying to get around this by customizing my jasny js file, but I was using the CDN before. I’m having trouble getting a local version included. If I add it to the manifest file using the “files” key, jshint yells and complains about jasny’s lack of semicolons, and f I add it to the manifest using the “vendor” key, it doesn’t seem to get included in the HTML at all.
Am I missing a step for including the tag of the vendor js file?