We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Filtering Foreign Key Data using Batch edit mode

I been trying to filter the possible values of a drop down edit Field based on another value of the Row in batch edit mode but I  am having issues. 
I been working with what is on this thread but since is batch edit, the ActionComplete method does not fire as expected.  
Any ideas how to do this? I been trying to work with other events but can't find stable solution. I have tried all client event and the closest one is the RecordClick event. Although i managed to update the data using this event, the drop down doesn't update intermediately. 
Would appreciate it if you can build a working example for me. 

1 Reply

AR Ajith R Syncfusion Team May 6, 2015 12:49 PM UTC

Hi David,

Thanks for using Syncfusion products.

Query: been working with what is on this thread but since is batch edit, the ActionComplete method does not fire as expected. Any ideas how to do this?

We would like to let you know that, the client side event ActionComplete is not triggered when we using Batch edit mode. We have separate events for Batch editing functionality which can be triggered while using batch edit mode in the ejGrid. Please refer the below events and UG Doc to know about the events in Batch editing.

UG Doc: http://help.syncfusion.com/UG/JS_CR/ejGrid.html#Events

Batch Edit Events







We have analyzed your requirement from your provided details and we have created a simple sample to achieve your requirement. We suggest you to use Edit Template instead of client side events and render the drop down list of refreshed data Source based on the relational value in the current row. Please refer the below code snippet for further details.




.Columns(col =>






.EditTemplate(a => { a.Create("create").Read("read").Write("write"); }).Add();



<script type="text/javascript">

function create() {

return $("<input>");


function write(args) {

var gridObj = $("#Grid").ejGrid("instance"); // Get grid object

var tr = args.element.closest("tr"); // Get current row element

var title = $(tr.find("td")[gridObj.getColumnIndexByField("CustomerID")]).html(); // Get value of CustomerID(Designation) column

renderDropDown(title, args.element); // Call the function to render the drop down


function read(args) {

return args.ejDropDownList("getValue"); // get current value


function renderDropDown(title, element) {


url: 'Home/DataSource',

type: 'GET',

data: { "titleValue": title },

success: function (data) {



// Render the drop down list

element.ejDropDownList({ width: "100%", dataSource: data, value: data[0].text, selectedItemIndex: 0 });





We are sorry to let you know that, we have faced an issue “Edit Template with foreign key column throws script error” while implementing your requirement and a support incident has been created under your account to track the status of this issue. Please log on to our support website to check for further updates.

For your convenience we have created a simple sample and the same can be downloaded from the below link.

Sample Link: http://www.syncfusion.com/downloads/support/forum/119024/Sample-16271782.zip

Please refer the below UG Doc and Online Demo to know further details about Edit Template.

UG Doc: http://help.syncfusion.com/ug/js/index.html#!Documents/edittemplate.htm
Online Demo: http://mvc.syncfusion.com/demos/web/grid/edittemplate

Please let us know if you have any concerns.

Ajith R

Live Chat Icon For mobile
Up arrow icon