Implicit Submission Rule

bindrid

@allen
This one bit me today, took about an hour to figure out.

I have a form with a number of textboxes on it followed by a DataTable with a couple of buttons on it.

Whenever my customer hit the return key on the text box, it would trigger a click on the first button on the form, which in this case, was the first button in the datatable.

This is the expected behavior under HTML5 because the button generated by DataTable did not include type so they are, by default submit buttons.

I had to change DataTable code to prevent this from happening.

I changed

        var button = $('<' + buttonDom.tag + '/>')
            .addClass( buttonDom.className )
            .attr( 'tabindex', this.s.dt.settings()[0].iTabIndex )
            .attr( 'aria-controls', this.s.dt.table().node().id )
            .on( 'click.dtb', function (e) {

to

        var button = $('<' + buttonDom.tag + '/>')
                        .attr('type', 'button')
            .addClass( buttonDom.className )
            .attr( 'tabindex', this.s.dt.settings()[0].iTabIndex )
            .attr( 'aria-controls', this.s.dt.table().node().id )
            .on( 'click.dtb', function (e) {

to solve this problem.

Here is one discussion of the problem.

https://stackoverflow.com/questions/37791840/why-a-button-is-clicked-when-a-form-is-submitted/37792378#37792378

allan

Thanks! I'll have that added for the next update of Buttons (which shouldn't be too far away).

Allan

allan

I've committed this in now.

Thanks again!

Allan

bindrid

@allan , Great and your welcome and thank you I will push the patch and take out my quick fix.