react自动触发表单提交_ReactJS：如何从另一个事件触发表单提交事件

I've two react events:

Form submit event

sendMessage: function(event){

console.log(event);

event.preventDefault();

},

keyPress Event

textareaKeypress: function(event){

if (event.which == 13 && !event.shiftKey){

document.getElementById('messagebox').submit();

}

},

but the reactJS is not capturing the form submit triggered by textareaKeypress. How can I call the sendMessage from textareaKeypress with proper event?

解决方案

I learned something new today: this is just how the DOM works.

The form's onsubmit event handler (for example, οnsubmit="return false;") will not be triggered when invoking this method from Gecko-based applications. In general, it is not guaranteed to be invoked by HTML user agents.

According to the HTML spec:

The submit() method, when invoked, must submit the form element from the form element itself, with the submitted from submit() method flag set.

followed by (section 4.10.22.3)

If the submitted from submit() method flag is not set, then fire a simple event that bubbles and is cancelable named submit, at form.

So, the event is not fired if the submit() method flag is set.

I was able to get the behavior you (and I) were expecting via the following code (JSFiddle example):

// ...

this.refs.form.getDOMNode().dispatchEvent(new Event("submit"));

(You'll need more verbose code in IE.)

jQuery's $(form).submit() delegates to $(form).trigger("submit"), so I expect it's a similar workaround.