We have Grid on form which has 11 columns, the column is of type selection box,t

Hi sathya we are using following javascript for getting date picker in grid,

dateOnGrid = {
          // verifyDate:
          //
          // @params: element - Form Element -
          //
          // @description: verifies that its next sibling is a link (assumes the
          // picker link)
          //
          verifyDate : function(element) {
                    try {
                              if (element.nextSibling.tagName.toLowerCase() == 'a') {
                                        return true;
                              } else {
                                        return false;
                              }
                    } catch (e) {
                              return false;
                    }
          },
          // attachDate:
          //
          // @params: gridId - formID of grid; gridFieldId - formID of column in grid
          // to attach data box to
          //
          // @description: rewrites cloneable column with data box; also rewrites all
          // existing cells in table if they don't have a box
          //
          attachDate : function(gridId, gridFieldId) {
                    // debugger;
                    // update the cloneable column
                    try {
                              var namespace = window.FormDesigner.runtimeNamespace;
                              var gridDom = window.Build.util.getComponentContainer(gridId,
                                                  namespace);
                              var cloneableTR = $('tr.cloneable', gridDom)[0];
                              var cloneDivs = $('div', cloneableTR);
                              var selectedIdField = $('input[@id*={0}]'.supplant(gridFieldId),
                                                  cloneDivs)[0];
                              dateOnGrid.formatInputField(selectedIdField);
                              // make sure visible "date" fields are updated
                              var textConfig = document.getElementsByName(gridFieldId);
                              var textConfigLen = document.getElementsByName(gridFieldId).length;
                              var i = 0;
                              for (i = 0; i < textConfigLen; i++) {
                                        if (!dateOnGrid.verifyDate(textConfig[i])) {
                                                  dateOnGrid.formatInputField(textConfig[i]);
                                        }
                              }
                    } catch (e) {
                              // alert(e.message);
                    }
          },
          // formatInputField:
          //
          // @params: selectedIdField - ID of column on the grid -
          //
          // @description: attaches a date picker to all fields in the specified
          // column on a grid (should only be used for text fields)
          // also attaches a picker to the cloneable row which is copied everytime you
          // click add an item
          //
          formatInputField : function(selectedIdField) {
                    var image = document.createElement('img');
                    image.setAttribute('alt', 'Select Date');
                    image.setAttribute('src', '/suite/components/toolbar/img/calendar.gif');
                    var functionString = "onclick='dateOnGrid.datePopup();return false;'";
                    var code = "<a href='javascript:void(0)' " + functionString + " >"
                                        + image.outerHTML + "</a>";
                    var newElement = document.createElement('a');
                    // css change only looks good with more than one column - can remove to
                    // change text box size
                    $(selectedIdField).css("width", "30%");
                    // end css update
                    selectedIdField.parentNode.insertBefore(newElement,
                                        selectedIdField.nextSibling);
                    selectedIdField.nextSibling.outerHTML = code;
          },
          // datePopup:
          //
          // @params: none
          //
          // @description: brings up the calendar popup for a date object, tied to a
          // specific cell
          //
          datePopup : function() {
                    // debugger;
                    var target = event.srcElement.parentNode.parentNode
                                        .getElementsByTagName('INPUT')[0];
                    window.asiFormDatePicker = new MDatetime('asiFormDatePicker');
                    asiFormDatePicker.target = target;
                    asiFormDatePicker.display(target.value, event);
                    return false;
          },
          // validateDate:
          //
          // @params: fieldId
          //
          // @description: validate of a field for grid
          //
          validateDate : function(fieldId) {
                    var fieldValues = window.FormAPI.getValue(fieldId).id;
                    var asDateValues = Date.Util.parseValue(fieldValues, 'date');
                    var isStandardValid = Date.Util.validate(asDateValues, 'date');
                    return isStandardValid;
          }
};

Hi sathya we are using following javascript for getting date picker in grid,

dateOnGrid = {
          // verifyDate:
          //
          // @params: element - Form Element -
          //
          // @description: verifies that its next sibling is a link (assumes the
          // picker link)
          //
          verifyDate : function(element) {
                    try {
                              if (element.nextSibling.tagName.toLowerCase() == 'a') {
                                        return true;
                              } else {
                                        return false;
                              }
                    } catch (e) {
                              return false;
                    }
          },
          // attachDate:
          //
          // @params: gridId - formID of grid; gridFieldId - formID of column in grid
          // to attach data box to
          //
          // @description: rewrites cloneable column with data box; also rewrites all
          // existing cells in table if they don't have a box
          //
          attachDate : function(gridId, gridFieldId) {
                    // debugger;
                    // update the cloneable column
                    try {
                              var namespace = window.FormDesigner.runtimeNamespace;
                              var gridDom = window.Build.util.getComponentContainer(gridId,
                                                  namespace);
                              var cloneableTR = $('tr.cloneable', gridDom)[0];
                              var cloneDivs = $('div', cloneableTR);
                              var selectedIdField = $('input[@id*={0}]'.supplant(gridFieldId),
                                                  cloneDivs)[0];
                              dateOnGrid.formatInputField(selectedIdField);
                              // make sure visible "date" fields are updated
                              var textConfig = document.getElementsByName(gridFieldId);
                              var textConfigLen = document.getElementsByName(gridFieldId).length;
                              var i = 0;
                              for (i = 0; i < textConfigLen; i++) {
                                        if (!dateOnGrid.verifyDate(textConfig[i])) {
                                                  dateOnGrid.formatInputField(textConfig[i]);
                                        }
                              }
                    } catch (e) {
                              // alert(e.message);
                    }
          },
          // formatInputField:
          //
          // @params: selectedIdField - ID of column on the grid -
          //
          // @description: attaches a date picker to all fields in the specified
          // column on a grid (should only be used for text fields)
          // also attaches a picker to the cloneable row which is copied everytime you
          // click add an item
          //
          formatInputField : function(selectedIdField) {
                    var image = document.createElement('img');
                    image.setAttribute('alt', 'Select Date');
                    image.setAttribute('src', '/suite/components/toolbar/img/calendar.gif');
                    var functionString = "onclick='dateOnGrid.datePopup();return false;'";
                    var code = "<a href='javascript:void(0)' " + functionString + " >"
                                        + image.outerHTML + "</a>";
                    var newElement = document.createElement('a');
                    // css change only looks good with more than one column - can remove to
                    // change text box size
                    $(selectedIdField).css("width", "30%");
                    // end css update
                    selectedIdField.parentNode.insertBefore(newElement,
                                        selectedIdField.nextSibling);
                    selectedIdField.nextSibling.outerHTML = code;
          },
          // datePopup:
          //
          // @params: none
          //
          // @description: brings up the calendar popup for a date object, tied to a
          // specific cell
          //
          datePopup : function() {
                    // debugger;
                    var target = event.srcElement.parentNode.parentNode
                                        .getElementsByTagName('INPUT')[0];
                    window.asiFormDatePicker = new MDatetime('asiFormDatePicker');
                    asiFormDatePicker.target = target;
                    asiFormDatePicker.display(target.value, event);
                    return false;
          },
          // validateDate:
          //
          // @params: fieldId
          //
          // @description: validate of a field for grid
          //
          validateDate : function(fieldId) {
                    var fieldValues = window.FormAPI.getValue(fieldId).id;
                    var asDateValues = Date.Util.parseValue(fieldValues, 'date');
                    var isStandardValid = Date.Util.validate(asDateValues, 'date');
                    return isStandardValid;
          }
};