JSFiddle - React, Tailwind, and code Playground

by kien16

HTML

<link rel="stylesheet" href="http://cdn.sencha.io/ext-4.1.1-gpl/resources/css/ext-all.css">

JavaScript

Ext.onReady(function () {
    Ext.create('Ext.form.Panel', {
        title: 'Basic Form',
        renderTo: Ext.getBody(),
        bodyPadding: 5,
        width: 350,

        url: 'save-form.php',

        items: [{
            xtype: 'textfield',
            fieldLabel: 'Field 1',
            name: 'theField'
        },{
            xtype: 'textfield',
            fieldLabel: 'Field 2',
            name: 'theField'
        },{
            xtype: 'textfield',
            fieldLabel: 'Field 3',
            name: 'theField',
            hidden: true,
            allowBlank : false
        }],

        buttons: [{
            text: 'Submit',
            handler: function () {
                var form = this.up('form').getForm();
                if (form.isValid()) {
                    alert('submit');
                }else alert('fail');
            }
        }]
    });
});