Search code examples
jqueryasp.net-mvckendo-uihtml-helperkendo-autocomplete

Bind ID as Value with Text in Autocomplete


I am using Kendo Autocomplete, In that I am filling the Text and also using that text parse data, But I want to use ID as Value to send it on server side on Form Submit.

I am using this Kendo Editor But Can't able to Bind the "CustomerID" as the Value of Autocomplete::

 @(Html.Kendo().AutoComplete()
                                  .Name("Customers")
                                  .DataTextField("CustomerShortName")
                                  .Value("CustomerID")
                                  .Filter("contains")
                                  .MinLength(3)
                                  .Template("<label>${ data.CustomerShortName }</label>")
                                  .HtmlAttributes(new {  disabled="disabled" })
                                  .DataSource(source =>
                                  {
                                      source.Read(read =>
                                      {
                                          read.Action("GetCustomers", "GetData");
                                      })
                                      .ServerFiltering(true);
                                  })
                            )   

Please Help me on this ASAP.


Solution

  • I have done this in another way, I have made a Hidden type for its ID value i.e. for "CustomerID" as

    @Html.HiddenFor(x=>x.CustomerID)
    

    and on change of kendo Autocomplete I have written some event as,

        @(Html.Kendo().AutoComplete()
                                          .Name("Customers")
                                          .DataTextField("CustomerShortName")
                                         .Events(events => events.Select("CustomerSelect"))
                                          .Filter("contains")
                                          .MinLength(3)
                                          .Template("<label>${ data.CustomerShortName }</label>")
                                          .HtmlAttributes(new {  disabled="disabled" })
                                          .DataSource(source =>
                                          {
                                              source.Read(read =>
                                              {
                                                  read.Action("GetCustomers", "GetData");
                                              })
                                              .ServerFiltering(true);
                                          })
                                    )    
    

    And For that I am using Javascript Function as::

    <script>
    //Set CustomerID
        function CustomerSelect(e)
        {
            var DataItem = this.dataItem(e.item.index());
            $("#CustomerID").val(DataItem.CustomerID);
    }
    </script>
    

    And that value I am using While Submitting the Form. Thanks for your help.