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

Programmatically setting the Selected Item( by Id) with data from a remote data source

I'm trying to set the selected item of a drop down control by id which is an INT, previously worked by setting using the 'Value' field as shown below

@{Html.EJ().DropDownList().Datasource(Model.Collections.Customers).DropDownListFields(f => f.Text("Text").Value("Value"))
                    .ClientSideEvents(ce => ce.Change("updateForm")).Value(Model.CustomerId.ToString()).Render();}

however this doesn't work  when i use a remote data source, I've also tried setting it using 'SelectedItems' and passing it List<int> with 1 item and this error-ed on me  

@Html.EJ().DropDownList(QuestHelper.FieldName(ViewData, "CustomerId")).Datasource(ds => ds.URL("../ApplicationData.svc/Customers")).DropDownListFields(df => df.Text("Name").Value("Id")).WatermarkText(Model.Collections.CustomerWatermark).ShowRoundedCorner(true).AllowVirtualScrolling(true).VirtualScrollMode(VirtualScrollMode.Normal).ItemsCount(7).ClientSideEvents(ce => ce.Change("updateForm")).SelectedItems(Model.selectedItems)

7 Replies

PO Prince Oliver Syncfusion Team June 10, 2016 10:12 AM UTC

Hi Matthew,   
Thanks for contacting Syncfusion support.   
We have fixed the issue. A support incident to provide patch for the issue has been created under your account.      
Please log on to our support website to check for further updates     
Please let me know if you have any questions.     

MS Matthew Shakespeare June 14, 2016 08:14 PM UTC

I've noticed the same issue with your Autocomplete control using SelectValueByKey 

SS Selvamani Sankarappan Syncfusion Team June 15, 2016 10:41 AM UTC

Hi Matthew, 
Thanks for the update, 
In autocomplete control, the selectValueByKey property is working fine with remote data. Please refer the following code example: 
@Html.EJ().Autocomplete("searchCustomer").Datasource(d => d.URL("http://mvc.syncfusion.com/Services/Northwnd.svc/").Offline(false)).Query("ej.Query().from('Orders').select('CustomerID', 'ShipCity')").AutocompleteFields(f => f.Text("ShipCity").Key("CustomerID")).WatermarkText("Search a customer").SelectValueByKey("HANAR") 
We have prepared the sample based on this. Please refer the sample from the following link: 
Selvamani S 

MS Matthew Shakespeare June 15, 2016 12:18 PM UTC

Thanks selvamani,

I've look into the issue further and it's because you only support string types for the SelectValueById 

I should have been more specific I'm trying to select a value by key and the Key is an int.

I'm using an OData 3 data source, and the query generated to select the my customer object doesn't work to select an int

http://[server]:[port]/ApplicationData.svc/qry_CustomerByUser?ShowAllCustomers=1&$select=Name,Id&$filter=tolower(Id)%20eq%20%275%27 or ShowAllCustomers=1&$select=Name,Id&$filter=tolower(Id) eq '5'

http://[server]:[port]/ApplicationData.svc/qry_CustomerByUser?ShowAllCustomers=1&$select=Name,Id&$filter=Id%20eq%205 or ShowAllCustomers=1&$select=Name,Id&$filter=id eq 5

SS Selvamani Sankarappan Syncfusion Team June 16, 2016 12:51 PM UTC

Hi Matthew, 
Sorry for the inconvenience caused, 
Based on the current implementation of the Autocomplete component, the SelectValueByKey property’s value is processed as string data from the server side. Even if we give any type of data to the SelectValueByKey property, it’s handled as string data. So, we suggest to use the string data type for the field mapping the key in your data.  
Please let us know if you need any further assistance, 
Selvamani S  

MS Matthew Shakespeare June 16, 2016 01:20 PM UTC

Thanks for the timely response and suggested work around Selvamani,

However changing my Unique key to a string goes against my professional pride(maybe as a guid),
instead I've opted to use a hidden input field to hold the Id and set the value of autocomplete to the name
@Html.HiddenFor(m => m.CustomerId)
@Html.HiddenFor(m => m.CustomerName)

then I'm replacing the values on post with the values from the autocomplete as it only supports posting strings,
            var formData = $('#form0').serialize();
            var customer = $("#CustomerId").ejAutocomplete("instance");            
            var customerId = customer.model.selectValueByKey;
            var customerName = customer.model.value;
if (customerId) {                
                    item = item.replace("Project.CustomerId=" + oldCustomerId, "Project.CustomerId=" + customerId);
                    item = item.replace("Project.CustomerName=", "Project.CustomerName=" + customerName);



SS Selvamani Sankarappan Syncfusion Team June 17, 2016 01:01 PM UTC

Hi Matthew, 
Thanks for your update, 
As updated previously, the data is returned and handled in JavaScript source as string. So the server side JSON data must be processed as string data in key field for Autocomplete component. So, please use the string data type for the mapping the key field in your data. Or else you can use as per your suggested way to handle SelectValueByKey with a numeral value using hidden element. 
Selvamani S 

Live Chat Icon For mobile
Up arrow icon