I followed the walkthrough and the form is still not showing. I am adding the JS at the top of the page (I also tried adding it at the bottom of the page) and adding the below script
<div class="formulate-wrapper">
@Html.Action("Render", "FormulateRendering", new { form = ((Umbraco.Web.PublishedModels.Home)Model).BottomForm })
</div>
If I check the source of the page I am finding the following dynamic script
And there is a JSON object with the details of my form
{"data":{"name":"Registration Form","alias":null,"randomId":"bae21d2e0cb34b2899d5fe736c8a74ca","fields":[{"alias":"Name","label":"Name","id":"19f89987a17f4defa7d568107b7af7d3","randomId":"1da7e8f8fce045c8973cd5c263364707","fieldType":"text","validations":[{"id":"1d2f41ba933e4409b15cb980b5221158","alias":"NameValidation","validationType":"regex","configuration":{"message":"Please input a valid name.","pattern":"^[\w\u0027\-,.][^0-9!¡?÷?¿/\\+=@#$%ˆ\u0026(){}|~\u003c\u003e;:[\]]{2,}$"}}],"configuration":{},"initialValue":null,"category":"Standard"},{"alias":"Email","label":"Email","id":"630c78e222664e25af895974059ca4b9","randomId":"bffb7aa1b61f4f1490f937b18b31feed","fieldType":"text","validations":[{"id":"898f2a554c3e40eb9f9ce0ea981b088d","alias":"Email_Validation","validationType":"regex","configuration":{"message":"Please input a valid email.","pattern":"^(?(\")(\".+?(?\u003c!\\)\"@)|((0-9a-z)(?\u003c=[0-9a-z])@))(?(\[)(\[(\d{1,3}\.){3}\d{1,3}\])|(([0-9a-z][-\w][0-9a-z]\.)+[a-z0-9][\-a-z0-9]{0,22}[a-z0-9]))$"}}],"configuration":{},"initialValue":null,"category":"Standard"},{"alias":"Seminar","label":"Seminar","id":"d7961a89b5404b3e845cd4c4dea9fdff","randomId":"703966a3d6514f76973b4a33608515f2","fieldType":"hidden","validations":[],"configuration":{},"initialValue":null,"category":"Standard"}],"rows":[{"isStep":false,"cells":[{"columns":12,"fields":[{"id":"19f89987a17f4defa7d568107b7af7d3"},{"id":"630c78e222664e25af895974059ca4b9"},{"id":"d7961a89b5404b3e845cd4c4dea9fdff"}]}]}],"payload":{"FormId":"05f0e3ca893f47c48b4ed1ab788ae262","PageId":1105,"__RequestVerificationToken":"XQBWxYfEE0RbQvCKLlGxmlBYb0GxLQ7YzrqGBZumDWQsyMS-m9AjLWkdn96LCFmxCS0tvGpU0NYL5DT9ImAa1Mq6Dy6hEo7zD63DQbJEKcs1"},"url":"/umbraco/formulate/submissions/submit"}};
The first thing that stands out is that your screenshot of the "dynamic script" appears to be minified strangely (some line breaks are missing). Maybe that's just due to whatever you're using to view the source? If it really got minified that way, it would be a problem, because some things appear to be commented out.
Here's an example of some of that dynamic script that hasn't been minified (which I got in Chrome by viewing the source of a page with a Formulate form):
Notice that there are a few line breaks splitting the code onto multiple lines.
I am adding the JS at the top of the page (I also tried adding it at the bottom of the page)
Those are "responsive.plain-javascript.min.js" and "custom-formulate-script.js".
I have some further questions on top of Shaishav's questions. Do you see any console errors in Chrome? What browser are you using (and what version)? What Formulate and Umbraco versions are you using?
Does window["formulate-plain-js-forms"] show an empty array when you run it in the Chrome console after your page has loaded (it should)?
HI thanks for the quick answer I was using Firefox and did not see any errors in the console, I tried using Chrome and found a JS error. Turns out it was an error in the regex validation which was wrong. The form is showing now thanks.
Form not loading
I followed the walkthrough and the form is still not showing. I am adding the JS at the top of the page (I also tried adding it at the bottom of the page) and adding the below script
If I check the source of the page I am finding the following dynamic script
And there is a JSON object with the details of my form
{"data":{"name":"Registration Form","alias":null,"randomId":"bae21d2e0cb34b2899d5fe736c8a74ca","fields":[{"alias":"Name","label":"Name","id":"19f89987a17f4defa7d568107b7af7d3","randomId":"1da7e8f8fce045c8973cd5c263364707","fieldType":"text","validations":[{"id":"1d2f41ba933e4409b15cb980b5221158","alias":"NameValidation","validationType":"regex","configuration":{"message":"Please input a valid name.","pattern":"^[\w\u0027\-,.][^0-9!¡?÷?¿/\\+=@#$%ˆ\u0026(){}|~\u003c\u003e;:[\]]{2,}$"}}],"configuration":{},"initialValue":null,"category":"Standard"},{"alias":"Email","label":"Email","id":"630c78e222664e25af895974059ca4b9","randomId":"bffb7aa1b61f4f1490f937b18b31feed","fieldType":"text","validations":[{"id":"898f2a554c3e40eb9f9ce0ea981b088d","alias":"Email_Validation","validationType":"regex","configuration":{"message":"Please input a valid email.","pattern":"^(?(\")(\".+?(?\u003c!\\)\"@)|((0-9a-z)(?\u003c=[0-9a-z])@))(?(\[)(\[(\d{1,3}\.){3}\d{1,3}\])|(([0-9a-z][-\w][0-9a-z]\.)+[a-z0-9][\-a-z0-9]{0,22}[a-z0-9]))$"}}],"configuration":{},"initialValue":null,"category":"Standard"},{"alias":"Seminar","label":"Seminar","id":"d7961a89b5404b3e845cd4c4dea9fdff","randomId":"703966a3d6514f76973b4a33608515f2","fieldType":"hidden","validations":[],"configuration":{},"initialValue":null,"category":"Standard"}],"rows":[{"isStep":false,"cells":[{"columns":12,"fields":[{"id":"19f89987a17f4defa7d568107b7af7d3"},{"id":"630c78e222664e25af895974059ca4b9"},{"id":"d7961a89b5404b3e845cd4c4dea9fdff"}]}]}],"payload":{"FormId":"05f0e3ca893f47c48b4ed1ab788ae262","PageId":1105,"__RequestVerificationToken":"XQBWxYfEE0RbQvCKLlGxmlBYb0GxLQ7YzrqGBZumDWQsyMS-m9AjLWkdn96LCFmxCS0tvGpU0NYL5DT9ImAa1Mq6Dy6hEo7zD63DQbJEKcs1"},"url":"/umbraco/formulate/submissions/submit"}};
Am i missing something?
Hi Andrew,
What are you seeing on the page? Is their some error?
Cheers, Shaishav
The first thing that stands out is that your screenshot of the "dynamic script" appears to be minified strangely (some line breaks are missing). Maybe that's just due to whatever you're using to view the source? If it really got minified that way, it would be a problem, because some things appear to be commented out.
Here's an example of some of that dynamic script that hasn't been minified (which I got in Chrome by viewing the source of a page with a Formulate form):
Notice that there are a few line breaks splitting the code onto multiple lines.
By "the JS", which JavaScript are you referring to? There are two files you'd probably want: http://www.formulate.rocks/plain-javascript/render-form
Those are "responsive.plain-javascript.min.js" and "custom-formulate-script.js".
I have some further questions on top of Shaishav's questions. Do you see any console errors in Chrome? What browser are you using (and what version)? What Formulate and Umbraco versions are you using?
Does
window["formulate-plain-js-forms"]
show an empty array when you run it in the Chrome console after your page has loaded (it should)?HI thanks for the quick answer I was using Firefox and did not see any errors in the console, I tried using Chrome and found a JS error. Turns out it was an error in the regex validation which was wrong. The form is showing now thanks.
is working on a reply...