This is a migrated thread and some comments may be shown as answers.
Can't get the value of an input element to use in
1 Answer 3 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Ankit asked on 24 Mar 2021, 03:51 PM

Below is my MultiSelect for a List<long> property of my model. In DataSource Read I am giving a js Function name "userIdFilter"

@(Html.Kendo().MultiSelectFor(m => m.PositionIds)
          .Placeholder("Select Position")
          .DataSource(d => d.Read(read =>
          .HtmlAttributes(new { style = "width:95%;" })

this is userIdfilter method in a script tag

    function userIdFilter() {


          setTimeout(() => console.log($("#Id").val()), 100);

        return { userId: $("#Id").val() };

This is the numeric text box that has id="Id". I have applied display:none to its parent element

@(Html.Kendo().NumericTextBoxFor(m => m.Id).Enable(false))

All these snippets lie in a PopupEditView.cshtml which is called when editing/creating and element from the grid in my index.cshtml file

Now When I call Test it with edit command Edit pop up appears and userIdFilter is called. and value "0" is printed. after 100ms value "1182" is printed. Also my actionMethod recieves value 0.

But when I call userIdFilter() from console it logs value 1182 (the correct value) also object { userId: 1182 } is also logged and after 100ms value 1182 is printed.

Also if I happen to inspect the multiselect in the popup before the request with wrong value for dataSource is sent, Kendo makes a second request with correct value and it works as it should

I just cannot understand this strange behaviour and what is going wrong. Need help

1 Answer, 1 is accepted

Sort by
Telerik team
answered on 29 Mar 2021, 12:15 PM

Hello Ankit,

Based on the provided details it appears that the data handler function is executed prior to the model being bound to the editors in the Grid's editor template. What I can suggest is setting the AutoBind() configuration for the MultiSelect to false and handling the Edit event of the Grid. Within the event handler get a reference of the MultiSelect and call it's dataSource read method:


function onEdit(e) {
        var element = e.container.find("#PositionIds")

Let me know if this suggestion resolves the issue.

Note also that when using the Widget[For] initialization for components there is no need to specify the .Name() configuration option. You can read more on this at the end of the Basic Configuration section here: 

Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Asked by
Top achievements
Rank 1
Answers by
Telerik team
Share this question