Html With Javascript Form Validation And Jquery Mobile April 14, 2024 Post a Comment In a HTML form I am using JavaScript Form validation to avoid empty fields. This is the code for the form: Solution 1: Working example: http://jsfiddle.net/Gajotres/vds2U/50/HTML:<!DOCTYPE html><html><head><title>jQM Complex Demo</title><metahttp-equiv='Content-Type'content='text/html; charset=utf-8'/><metaname="viewport"content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/><linkhref="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" /><!--<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>--><scriptsrc="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script></head><body><divdata-role="page"id="index"data-theme="a" ><divdata-role="header"><h3> First Page </h3><ahref="#second"class="ui-btn-right">Next</a></div><divdata-role="content"><formmethod="post"id="form1"name="form1"action=""data-ajax="false"><tablealign="center"><trvalign="baseline"><tdnowrapalign="right">Nickname:</td><td><inputtype="text"name="nickname"value=""size="32"/></td></tr><trvalign="baseline"><tdnowrapalign="right">Email:</td><td><inputtype="text"name="email"value=""size="32"/></td></tr><trvalign="baseline"><tdnowrapalign="right">Password:</td><td><inputtype="text"name="password"value=""size="32"/></td></tr><trvalign="baseline"><tdnowrapalign="right"> </td><td><inputtype="submit"value="Insert record"/></td></tr></table><inputtype="hidden"name="estado"value="0"/><inputtype="hidden"name="MM_insert"value="form1"/></form></div><divdata-role="footer"data-position="fixed"></div></div><divdata-role="page"id="second"data-theme="a" ><divdata-role="header"><h3> Second Page </h3><ahref="#index"class="ui-btn-left">Back</a></div><divdata-role="content"></div><divdata-role="footer"data-position="fixed"></div></div></body></html>CopyJavaScript:$(document).on('submit', '#form1', function(){ var x=document.forms["form1"]["nickname"].value; if (x==null || x=="") { alert("First name must be filled out"); returnfalse; } else { returntrue; } }); CopyChanges:jQuery Mobile has its own way of form handling, you need to disable it if you want to have classic form handling. It is done via attribute data-ajax="false".Never use inline javascript with jQuery Mobile, I mean NEVER.Solution 2: For me this is working fine :<script>functionvalidateForm() { var x=document.forms["form1"]["nickname"].value; if (x==null || x=="") { alert("First name must be filled out"); returnfalse; }else{ returntrue; } } </script>CopyJust added a else statement. It's working fine for me. Solution 3: I think your code should work. But If not you can make some changes as Change 1 Remove Submit event from tag Baca JugaPage Scrolls Back To Top When The Menu Panel Is Opened In Jquery MobilePhonegap Camera Not Loading Image Into TagNo Touch Event For Li Tag<formmethod="post"name="form1"action="<?phpecho$editFormAction; ?>">CopyChange 2.Change submit button to default button and validate event here<inputtype="button" onclick="javascript:validateForm();" value="Insert record"> CopyChange 3. Now change in javascript Add code form sub <script>functionvalidateForm() { var x=document.forms["form1"]["nickname"].value; if (x==null || x=="") { alert("First name must be filled out"); }else{ document.forms["form1"].submit(); } } </script>Copy Share You may like these postsSelecting Text On Focus Using Jquery Not Working In Iphone Ipad BrowsersHow To Refresh Jquery Mobile Table After A Row Is Added DynamicallyJqm Removes My PageJquery Popup Menu No Stick With Header Post a Comment for "Html With Javascript Form Validation And Jquery Mobile"
Post a Comment for "Html With Javascript Form Validation And Jquery Mobile"