Sunday, August 4, 2013

Populating DOJO dropdown list based on JSON Data

Populating DOJO dropdown list based on JSON Data:

<select data-dojo-type=dijit.form.Select data-dojo-props='name:"dcDistcode"' missingMessage="Enter the Distict code" style="width: 180px" id="dcDistcode"></select>

var data ={"identifier":"value","items":[],"label":"distcode"};
            var len = newContent.length;   
            data.items.push(dojo.mixin({"distcode": "--SELECT--"},{"value": ""}));           
               
            for(var i=0; i < len ; ++i){       
                data.items.push(dojo.mixin({"distcode": newContent[i].dcDistcode+' - '+newContent[i].dcDistname},{"value": newContent[i].dcDistcode}));           
            }
             var distStore = dojo.data.ItemFileReadStore({data: data});
             dijit.byId("dcDistcode").setStore(distStore);


identifier specifies the value for the drop down list,  label specifies the display label for the drop down list.

newContent is the JSON data received from the server.


Saturday, August 3, 2013

Validating the DOJO form programatically from Java Script

Validating the DOJO form programatically from Java Script

Sometimes we may need to validate the dojo form programatically from java script.

<form id="createForm" data-dojo-type="dijit.form.Form" data-dojo-attach-point="form"> .......</form>

The below line of code will help us to validate the form from java script

var formResult=dijit.byId('createForm').validate();

The validation result will be true if the validation of all the filed is success else the value will be false.


Getting the selected rows from DOJO Enhanced Grid

Getting the selected rows from DOJO Enhanced Grid :

The below line of code will help us to get the selected rows of the  Enhanced grid

dijit.byId(gridId).selection.getSelected();

Getting the model value of the selected rows.

var selectedRows=dijit.byId(gridId).selection.getSelected();

for(int i=0;i<selectedRows.length;i++)
{
   selectedRows[i].empName;
}



Stopping the Busy Button in DOJO

Stopping the Busy Button in DOJO

Getting the selected rows from DOJO Enhanced Grid :

DOJO busy button will help us to display the Busy Label to user while performing some actions, sometimes we need to stop the busy label and to display the normal button back.

<button data-dojo-type="dojox.form.BusyButton" id="loginButton" style ="margin-top: 10px; margin-right: -8px;" data-dojo-props="busyLabel:'Authenticating...'" onclick="loginForm()">SignIn</button>

If we are clicking on SignIn the button label will be changed to "Authenticating..." and the user will not be able to click the button again but in case of authentication failure the button should be displayed as normal

The below line of code will help as to cancel the busy button.

dijit.byId('loginButton').cancel();