JSFiddle - React, Tailwind, and code Playground

by psoares

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dijit/themes/tundra/tundra.css">
<div>
     <label for="login" class="labelClass">Login:</label>
     <input class="text" type="text" name="login" id="login" value="Username" dojoType="dijit.form.ValidationTextBox" required="true" size="20" length="20" missingMessage="You must enter your Username." />
</div>
<div>
     <label for="pass" class="labelClass">Pass:</label>
     <input class="text" type="password" name="pass" id="pass" value="password" dojoType="dijit.form.ValidationTextBox" required="true" size="20" length="20" missingMessage="You must enter your Password." />
</div>

CSS

.dijitTextBox { 
    background-color : lime; 
    padding : 30px;
}

JavaScript

require(['dojo/ready', 'dijit/form/ValidationTextBox'], function(ready, ValidationTextBox) {
    ready(function(){
        var textBox = dijit.byId("login");
        textBox.on("Change", function(value) { 
             alert("Login name changed to " + value);
        });   
    }); 
});