Question

I am debugging a page that has a jquery dialog that contains a textbox and an ok button.

When a user hits enter, the page is reloading and the textbox ID & value are being passed to the page reload as get parameters. e.g.

http://example.com?tex_box_id=text_entered_in_text_box

I cannot figure out what is causing this behavior and can’t figure out how to best track it down since the page itself is reloading.

I have tried stepping through all the jquery code, but did not have any luck. I can only assume that somebody somewhere attached a key press listener, but I can’t figure out who. I know I can work around this by preventing theirs from running, but I still really want to figure out why it is happening.

Note that this does NOT happen if you click the OK button, only if you hit enter when you are in the text box

Answer 1

This will disable all of the forms on the pages from being submitted:

$('form').submit(function() {
  return false;
});

While this will “solve” your problem, you should target your form specifically, and use custom JavaScript behavior for submitting the data (e.g. using $.ajax).

For more advanced debugging use the following:

$(window).keydown(function(event) {
  var breakpoint = 1; // Place a breakpoint on this line!
  // Then use the "step out of current function" button to
  // continue through the JS that gets executed... much of it
  // will likely be native code, but if you pay attention to
  // the native function names, you should eventually see the
  // event that is causing the reload.
});