How could I Bind Dropdown which change value depending on textBox value

[Pinaki]

I am successfully done cascading drop-down. But my requirement is to bind dropdown depend on the value of textbox.
Can you please help me.

My code snipe

<td class="EditlableTD">
                                        @Html.LabelFor(model => model.ReferredBy)
                                    </td>
                                    <td class="EditTextBoxTD">
                                        <input type="text" id="R_Ranks" name="ReferredBy" class="k-textbox" />
                                       
                                    </td>
                                </tr>
                                <tr>
                                    <td class="EditlableTD">
                                        Rank
                                    </td>
                                    <td class="EditTextBoxTD">
                                    <script>

                       function filterRank() {
                           return {
                               R_Ranks: $("#R_Ranks").val()
                              };
                       }
                    
                    </script>  
                      @(Html.Kendo().DropDownList()
                                      .Name("Rank")
                                      .OptionLabel("Select Rank...")
                                      .DataTextField("Rk_Name")
                                      .DataValueField("Rk_InternalCode")
                                      .DataSource(source =>
                                      {
                                          source.Read(read =>
                                          {
                                              read.Action("ShowSelectedRank", "Home")
                                                 .Data("filterRank");
                                          })
                                          .ServerFiltering(true);
                                      })
                                        .Enable(true)
                                        
                                        .AutoBind(false)
                                        //.CascadeFrom("BranchCode")
                                        .HtmlAttributes(new {style="width:200px;" })
                                        

                       )
</td>
</tr>

It bind value first time depend on R_Ranks text box value. But 2nd time text change does not effect the dropdown bind.

[Jayesh Goyani]

Hello,

<input id="target" type="text" value="CountryName" />

 

 @(Html.Kendo().ComboBoxFor(model => model.StateID)

                    .Name("StateID")

          .Placeholder("--Select--")

                  .DataTextField("StateName")

                  .DataValueField("StateID")

)

  $(document).ready(function () {

$('#target').change(function() {

  BindStateCombo($(this).val());

});

  });

 

 

function BindStateCombo(CoutryText) {

 

        var dataSource = new kendo.data.DataSource({

            transport: {

                read: {

                    url: 'Your BaseUrl Comes Here' + "Account/GetStateByCountry",

                    data: {

                        Value: CoutryText

                    }

                }

            }

        });

 

        var ddl = $('#StateID').data("kendoComboBox");

        ddl.setDataSource(dataSource);

        ddl.refresh();

    }

public JsonResult GetStateByCountry(string Value)

        {

           // Value is your textbox's Text/Value

            var dataitem = "Get Your State List";

 

            return Json(dataitem, JsonRequestBehavior.AllowGet);

        }

This same solutions also wroked for DropDownList.

Thanks,
Jayesh Goyani

[Doug]

Jayesh,

I know this is a very old posted but I need a point of clarification.

from your code snippet

                read: {
                    url: 'Your BaseUrl Comes Here' + "Account/GetStateByCountry",
                    data: {
                        Value: CoutryText
                    }
                }

 

Shouldn't the "Value: CountryText" really by "Value: CountryName" so it matches the text input?