Kendo UI grid should display message as 'no data' for selected in drop

Question

Using Kendo UI for the grid. It displays data based on the drop-down option selected. When it loads the first time I have set the .norecords message as 'Select an option.' So when some option from the drop-down has no data to display in the grid it shows the same message 'Select an option.' I want to have a message displayed as No data for selected option message but it shows select an option message for dropdown option as 'Select an option' when already option is selected.

Sachin Singh · Answer

for kendo UI for MVC, don't use the norecord extension method, instead use databound as "text/javascript" > $(document).ready(function () { noResultsFound(); }); function noResultsFound() { var grid= $( "#grid" ).data( "kendoGrid" ); var customMsg; var val= $( "#ddl" ).data( "kendoDropDownList" ).val(); if (val!=null || val!= "" ) { customMsg= "please select and option" ; } else { customMsg= "sorry! no data for this option." ; } var displayMSG = " " + customMsg + " " ; grid.bind( "dataBound" , function (e) { if (e.sender.dataSource.view().length === 0) { e.sender.table.closest( ".k-grid-content" ).attr( "style" , "overflow-x:hidden;" ); e.sender.table.closest( ".k-grid-content" ).replaceWith(displayMSG) } }); }

Sachin Singh · Answer

you can write a custom function for that $( "#grid" ).kendoGrid({ columns: [ { field: "name" }, { field: "age" } ], pageable: true , noRecords: { template : function(e){ var val= $( "#ddl" ).data( "kendoDropDownList" ).val(); if (val!=null || val!= "" ) { return "please select an option" } else { return "sorry! no data for this option." } } });