javascript - force form submit button click with jquery -
trying trigger submit functionality jquery. doing wrong? in theory, should work. i've tried 4 different ways though.
i have tried
$('input#submit').trigger("click"); $( form:first ).submit(); $( form:first ).trigger("submit"); $('form#databaseactionform').submit();
nothng has worked (yet)?!
code:
<html lang="en"> <head> <title>database management</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <script src="http://code.jquery.com/jquery-3.1.0.min.js" integrity="sha256-ccuebr6csya4/9szppfrx3s49m9vuu5bgtijj06wt/s=" crossorigin="anonymous"></script> <style> table td { border: 1px solid black; } table td:first-child { text-align: left; } </style> <script> <!-- $(document).ready(function() { $('#erase').click(function() { if (confirm("are sure want erase data database?")) { $('#buttontypepressed').val("erase"); $('input#submit').trigger("click"); <!-- here --> } }); $('#update').click(function() { var appid = $('#updateappid').val(); var field = $('#fieldname').val(); var value = $('#newvalue').val(); if (appid == null || appid == "") { alert("you must enter id number of entry wish modify."); $('#updateappid').focus(); } else if (field == null || field == "") { alert("you must choose field wish modify."); $('#fieldname').focus(); } else if (value == null || value == "") { alert("you must choose new value wish appear in database."); $('#newvalue').focus(); } else { $('#buttontypepressed').val("update"); $('input#submit').trigger("click"); <!-- here --> } }); $('#delete').click(function() { var appid = $('#deleteappid').val(); if (appid == null || appid == "") { alert("you must enter id number of entry wish delete."); $('#deleteappid').focus(); } else { $('#buttontypepressed').val("delete"); $('input#submit').trigger("click"); <!-- here --> } }); }); --> </script> </head> <body> <div id="container"> <from id="databaseactionform" name="databaseactionform" method="post" action="<?php echo htmlspecialchars($_server['php_self']); ?>"> <table border=0 style="margin: 50px auto; text-align: right;"> <tr style="text-align: center; font-weight: bold; font-size: 1.5em; text-decoration: underline;"> <th>action</th> <th>additional info</th> <th>button</th> </tr> <tr name="clear"> <td>erase database</td> <td style="text-align: center;">are sure?</td> <td><input type="button" id="erase" name="erase" value="erase all?" /></td> </tr> <tr name="update"> <td>update value</td> <td> entry id: <input type="text" id="updateappid" name="updateappid" placeholder="app entryid" /><br /> field name: <input type="text" id="fieldname" name="fieldname" placeholder="field change" /><br /> new value: <input type="text" id="newvalue" name="newvalue" placeholder="new value" /><br /> </td> <td><input type="button" id="update" name="update" value="update value" /></td> </tr> <tr name="delete"> <td>delete payment</td> <td> entry id: <input type="text" id="deleteappid" name="deleteappid" placeholder="app entryid" /> </td> <td><input type="button" id="delete" name="delete" value="delete entry" /></td> </tr> </table> <input type="hidden" id="buttontypepressed" name="buttontypepressed" /> <input type="submit" id="submit" name="submit" value="submit" style="position: absolute; left: -9999px; width: 1px; height: 1px;" tabindex="-1"/> </form> </div> </body>
there 2 issues here, 1 typo in element name form
, have from
.
another name/id of submit button, should not submit
override default submit
property(the function) of form
element
<input type="submit" id="bsubmit" name="bsubmit" value="submit" style="position: absolute; left: -9999px; width: 1px; height: 1px;" tabindex="-1" />
then use below snippet submit form
$('#databaseactionform').submit();
demo: fiddle
Comments
Post a Comment