DropDownList with different data sources by row

[Duran]

Good afternoon,

I have an ejGrid with a column of "editType: ej.Grid.EditingType.Dropdown".  In this grid's edit mode, I need to have this DropDownList control to have a separate data source by each row, INCLUDING the event of a new blank row.

Currently, I have managed to bind separate data sources on editing via the following code, but I still cannot utilize a separate data source for a new row:

beginEdit: function(i) {

//global js variables, declared outside.

isEditing = true;

activeRow = i.rowIndex;

},

actionComplete: function(i) {

if (isEditing) {

$("#gridStatusID").ejDropDownList({

dataSource: statusData[activeRow],

fields: { id: "StatusID", text: "Status", value: "Status" }

});

//reset

isEditing = false;

activeRow = -1;

}

}

If there is an easier way to go about this, please let me know as well.

Thanks.

-David Duran

[Gowthami V]

Hi David,

We have analyzed your code snippet and we suspect that while adding the new record “beginEdit” clientside event of the grid is not triggered. It will get triggered while editing the record of the grid.

We have created the sample based on your requirement and the same can be downloaded from the following link.

Sample Link: Sample.zip

In the above sample we have used “actionBegin” clientside event which can be triggered while begin the actions like CRUD, Filtering, Sorting etc.. and also we have used “selectedRowIndex” method of the grid for binding datasource to the dropdownlist based on the corresponding row index.

Please refer the below code snippet

$("#Grid").ejGrid({

. . . .

enableAutoSaveOnSelectionChange:false, //Disable auto save while change the selection

 

actionBegin: function (args) {

                   if (args.requestType == "add" || args.requestType == "beginedit")

                    {

                        isEditing = true;

                        activeRow = args.model.selectedRowIndex;

                        if(args.requestType=="add")

                        {

                            var gridobj = $("#Grid").data("ejGrid");

                           

                            activeRow = args.model.selectedRowIndex + 1;

                        }

                        }

                },

});

});

</script>

Please refer the below Online Documentation link to get more information about the events of the grid.

Online Documentation Link: http://help.syncfusion.com/UG/JS_CR/ejGrid.html#Events

Please try the above sample and let us know if you have any queries.

Regards,

Gowthami V.

 

[Duran]

Gowthami,

Thanks for your reply and sample code.  The actionBegin and actionComplete events seem to work well for my purposes.

However, I have noticed that if you set the "enableAutoSaveOnSelectionChange" to false, it can cause issues.  When in edit mode, selecting another row, and hitting the "cancel" icon at the top of the grid, the current editing row will be overwritten with the selected row's data.

-David

[Alan Sangeeth S]

Hi David,

 

 

We are able to reproduce the issue “enableAutoSaveOnSelectionChange issue with record save” and we have logged defect report for this. We have also created an incident 132490 to provide you the defect information and please follow-up with that incident so that you can track this defect status through your direct trac account.

 

 

Please let us know if you have any queries.

 

Regards,
Alan Sangeeth S