davidhq
davidhq

Reputation: 4760

Chrome Extensions programming - cancelling a form submit

I have a chrome extension which is just a simple form with two input fields and a submit button. The problem I encountered is that something like this:

  $('#submit').submit(function() {
    $('#word').val('')
    $('#translation').val('')
    return false
  })

Still reloads the popup.html (e.g. submits the form)! I was forced to change the type of the submit button to just 'button' and use

  $('#submit').live('click', function(e) {
    $('#word').val('')
    $('#translation').val('')
  })

This works, but now (of course) the ENTER doesn't work for form 'submission'... and I feel this is a hack when the original prevention of reload by returning false should work...

Anyone else had such a problem?

Upvotes: 0

Views: 930

Answers (2)

user900202
user900202

Reputation:

we can cancel the submit action by calling .preventDefault() on the event object or by returning false from the onsubmit event of the form.

 $('#YOUR_FORM_ID').submit(function() {
    $('#word').val('')
    $('#translation').val('')
    return false
  })

Upvotes: 0

Esailija
Esailija

Reputation: 140210

The .submit() is an event on the form, not on the submit button.

I.E.

<form onsubmit="return false;"></form>

Upvotes: 2

Related Questions