JSFiddle - React, Tailwind, and code Playground

by molecule

HTML

<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-4.0.2a/resources/css/ext-all.css">

JavaScript

var form = Ext.create('Ext.form.Panel', {

    renderTo: Ext.getBody(),

    fieldDefaults: {
        labelAlign: 'right',
        labelWidth: 135,
        msgTarget: 'side',
        allowBlank: true,
        inputType: 'password'
    },

    buttons: [{
        text: 'Change',
        formBind: true,
        //disabled: true,
        scope: this,
        handler: function() {
            form.submit({url:'echo/json'});
        }}],
    items: [{
        xtype: 'textfield',
        name: 'pw_old',
        fieldLabel: 'Old password'},
    {
        xtype: 'textfield',
        name: 'pw_new1',
        id: 'pw_new1',
        fieldLabel: 'New password',
        minLength: 8,
        maxLength: 16},
    {
        xtype: 'textfield',
        name: 'pw_new2',
        fieldLabel: 'Confirm new password',
        }]

});

form.on('beforeaction', function(f, action){
    console.log(f, action);
});