Monday, August 12, 2013

Removing the default rowselector column from DOJO Enhanced Grid

Removing the default rowselector column from DOJO Enhanced Grid:

Make sure the value for rowSelector is set as 0px or remove rowSelector property from the grid definition.

var grid = new dojox.grid.EnhancedGrid({
        id : gridObjectName,
        structure : layout,
        rowSelector : '0px',
        sortFields: [{attribute: defaultsort, ascending: true}],
        noDataMessage:"<span class=\"dojoxGridNoData\">No Matching Rows Found!!</span>",
        plugins : {
            pagination : {
                pageSizes : [ "25", "50", "100" ],
                description : true,
                sizeSwitch : true,
                pageStepper : true,
                gotoButton : true,
                /* page step to be displayed */
                maxPageStep : 4,
                /* position of the pagination bar */
                position : "bottom"

Programmatically Uncheck/Check DOJO Checkboxs

Programmatically Uncheck/Check DOJO Checkboxs

The below lines of code will help us to check /uncheck set of dojo checkboxes from javascript.

dojo.forEach (dojo.query("input[type=checkbox]"), function(item){
var widget = dijit.getEnclosingWidget(item);
widget.set('checked', false);

We can change the dojo.query parameter accordingly to fetch the checkboxes.

Thursday, August 8, 2013

Creating Validation TextArea in DOJO

Creating Validation TextArea in DOJO:

Sometimes we may need to do the validation of the data entered in TextArea but unfortunately the default TextArea provided by DOJO will not support the validation .

We can create a custom component extending both dijit.form.ValidationTextBox and dijit.form.SimpleTextarea, this will provide the functionality of both the ValidationTextBox and

                  postCreate: function() {
                validate: function() {
                    if (arguments.length==0) {
                    return this.validate(false);
                    return this.inherited(arguments);
                onFocus: function() {
                    if (!this.isValid()) {
               onBlur: function() {

We have to add the dojo require for ValidationTextarea  -  dojo.provide("ValidationTextarea");

Using the ValidationTextarea in jsp page:

<textarea id="clntlocn" name="clntlocn" data-dojo-type="ValidationTextarea" required="true" missingMessage="Enter the Client Location Name" rows="2" cols="20"" maxLength="50" style="resize:none"></textarea>

Now we can include all the validations applicable for dijit.form.ValidationTextBox to

Validating the Email address in DOJO

Validating the Email address in DOJO

<input  data-dojo-type="dijit.form.ValidationTextBox"regExpGen="dojox.validate.regexp.emailAddress" required="true" name="email"  id="email" missingMessage="Enter the Email id"> </input>

We have to add  regExpGen="dojox.validate.regexp.emailAddress" in the

Also, we have to add the following dojo require


Handling the select event of dojo tab container

Handling the select event of dojo tab container:

<div data-dojo-type="dijit/layout/TabContainer" style="height:  400px;" id="client">
   <div id="usersTab" data-dojo-type="dijit/layout/ContentPane" title="Users" >
  <div id="akrTdrTab" data-dojo-type="dijit/layout/ContentPane" title="AKR/TDR" >

Add the below code in the JSP page to handle the selection event of the tab.

      dojo.addOnLoad(function() {
             tabContainer = dijit.byId('client');
             dojo.connect(tabContainer, "selectChild",handleSelectedTabs);

    function handleSelectedTabs(selectedTab){
                  case "usersTab":searchUsersData();
                  case "akrTdrTab":searchAkrtdrData();