JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://afarkas.github.com/webshim/demos/js-webshim/dev/extras/modernizr-custom.js"></script>
<script src="http://afarkas.github.com/webshim/demos/js-webshim/dev/extras/mousepress.js"></script>
<script src="http://afarkas.github.com/webshim/demos/js-webshim/dev/polyfiller.js"></script>
<form id="myform">
    <label>
        Required field:
        <input type="text" required="required">
    </label>
    <p>
        <button id="btn-myform-submit">Submit (works)</button>
    </p>
</form>

<p>
    <button id="btn-myform-trigger-submit">Trigger "submit" on form (doesn't work)</button>
    <button id="btn-myform-trigger-click">Trigger "click" on button (works)</button>
</p>

JavaScript

jQuery.webshims.polyfill('forms forms-ext');

$.webshims.setOptions('forms', {
    customMessages: true,
    replaceValidationUI: true
});

$.webshims.ready('DOM forms forms-ext', function() {

    $('#myform').bind('submit', function(event) {
        event.preventDefault();
        alert('submit');
    });

    $('#btn-myform-trigger-submit').click(function(event) {
        event.preventDefault();
        $('#myform').trigger('submit');
    });

    $('#btn-myform-trigger-click').click(function(event) {
        event.preventDefault();
        $('#btn-myform-submit').trigger('click');
        alert("click");
    });
    
});