Setting onSubmit in React js

Question

On submission of a form  I m trying to doSomething   instead of the default post behaviour    Apparently in React  onSubmit is a supported event for forms  However  when I try the following code   var OnSubmitTest   React createClass       render  function             doSomething   function               alert  it works                        return  lt form onSubmit  doSomething  gt           lt button gt Click me lt  button gt           lt  form gt               The method doSomething   is run  but thereafter  the default post behaviour is still carried out    You can test this in my jsfiddle   My question  How do I prevent the default post behaviour

User · Answer

lt form onSubmit   e    gt   this doSomething    e preventDefault      gt  lt  form gt    it work fine for me

User · Answer

In your doSomething   function  pass in the event e and use e preventDefault     doSomething   function  e        alert  it works         e preventDefault

User · Answer

I d also suggest moving the event handler outside render   var OnSubmitTest   React createClass      submit  function e       e preventDefault        alert  it works            render  function         return          lt form onSubmit  this submit  gt           lt button gt Click me lt  button gt         lt  form gt

User · Answer

You can pass the event as argument to the function and then prevent the default behaviour   var OnSubmitTest   React createClass           render  function             doSomething   function event              event preventDefault               alert  it works                        return  lt form onSubmit  this doSomething  gt           lt button gt Click me lt  button gt           lt  form gt

[javascript] Setting onSubmit in React.js

Examples related to javascript

Examples related to forms

Examples related to form-submit

Examples related to reactjs

Examples related to onsubmit