Prevent form from submit w/ jQuery

Refresh will not submit the form. For the enter key, it should submit only if the form is in focus (selected). If you make sure it is hidden, clicking enter will not submit it.

You can prevent the form from submitting by using a submit event handler:

// When the form is closed... $('form').bind('submit.myform', function(e) { e.preventDefault(); // form will not be submitted }); // When the form is opened $('form').unbind('submit.myform'); 

You can namespace the submit event (as above) to make it easier to remove later on.

I would do something like this:

HTML:

<table> <tr> <td class="text"> Some text </td> <td> <a href="#" id="edit">Edit</a> </td> </tr> </table> <div id="form"> <form action="page" method="POST"> <input type="text" name="text"> <input type="submit" name="submit" id="submit"> </form> </div> 

CSS: Hide the form div, so you can toggle it's visibility with jQuery.

#form { display:none; } 

jQuery: Bind click event on the link, and send the text to the input. The form will then show itself.

$("table").find('td').delegate('a', 'click', function() { var a_elem = $(this), parent_tr = a_elem.parents('tr'), thetext = parent_tr.find('td.text').text().trim(); $("input[name=text]").val(thetext); $("div#form").show(); });