Filtering Foreign Key Data using Batch edit mode

[David Galeano]

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. 

[Ajith R]

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

batchAdd

batchDelete

beforeBatchAdd

beforeBatchDelete

beforeBatchSave

cellEdit

cellSave

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.

@(Html.EJ().Grid<object>("Grid")

-------

-------

.Columns(col =>

{

-----

-----

col.Field("CustomerID").HeaderText("Designation").ForeignKeyField("CustomerID").ForeignKeyValue("ContactTitle").DataSource(((IEnumerable<object>)ViewBag.name)).Add();

col.Field("ShipCity").HeaderText("Country").ForeignKeyField("ShipCity").ForeignKeyValue("Country").DataSource(((IEnumerable<object>)ViewBag.country))

.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) {

$.ajax({

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 });

}

})

}

</script>

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.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents
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.

Regards,
Ajith R