Блог

как привязать выпадающий список Telerik MVC со списком состояний США и передавать значения из представления в контроллер?

Привязка выпадающего списка Telerik MVC к списку состояний США и передача выбранного значения обратно контроллеру.

Я хочу привязать выпадающий список Telerik MVC с помощью функции Javascript. Я создал список состояний США в функции Javascript и присваиваю этот список состояний США своему ComboBox…To для отправки выбранного состояния США обратно контроллеру я взял HTML.TextBoxFor и установил для его видимости значение hidden … в моем контроллере я пытаюсь получить доступ к значению этого текстового поля, но оно всегда показывает null.. Пожалуйста, помогите

ниже приведен мой код:-

     <%= Html.Telerik().ComboBox()
    .Name("ComboBox")
    .ClientEvents(events => events
        .OnDataBinding("onDataBinding")
                           .OnChange("getComboBox")
    )
    %>
    <%: Html.TextBoxFor(model => model.EnrolRegAcntDescriptor.state, new { ID = "statetext", style = "visibility:hidden;width:10px" })%>
     <script type="text/javascript">
    function getComboBox() {
        //"ComboBox" is the value specified by the Name() method.
        debugger;
        var combobox = document.getElementById('ComboBox-value').value;
        var combotext = document.getElementById('ComboBox-input').value; //$("#ComboBox").data("tComboBox");
        var index = $("#ComboBox").data("tComboBox").value();
        //  var text = combotext.options[combotext.selectedIndex].value;
      //  var MySelectedvalue = document.getElementByid('tComboBox').options[document.getElementByid('tComboBox').selectedIndex].value
        var states = document.getElementById('statetext').value;
        states = combotext;
                 //   comboBox.select(index);
        //alert(index);
        return states;
    }
  

     <script type="text/javascript">
function onDataBinding(e) {
        var comboBox = $('#ComboBox').data('tComboBox');
        comboBox.dataBind([
            { Text: "ALABAMA", Value: "ALABAMA" },
            { Text: "ALASKA", Value: "ALASKA", Selected: true },
            { Text: "ARIZONA ", Value: "ARIZONA" },
            { Text: "ARKANSAS", Value: "ARKANSAS" },
            { Text: "CALIFORNIA", Value: "CALIFORNIA" },
            { Text: "COLORADO", Value: "COLORADO" },
            { Text: "CONNECTICUT", Value: "CONNECTICUT" },
            { Text: "DELAWARE ", Value: "DELAWARE" },
            { Text: "FLORIDA", Value: "FLORIDA" },
            { Text: "GEORGIA", Value: "GEORGIA" },
            { Text: "HAWAII", Value: "HAWAII" },
            { Text: "IDAHO", Value: "IDAHO" },
            { Text: "ILLINOIS", Value: "ILLINOIS" },
            { Text: "INDIANA", Value: "INDIANA" },
            { Text: "IOWA", Value: "IOWA" },
            { Text: "KANSAS", Value: "KANSAS" },
            { Text: "KENTUCKY", Value: "KENTUCKY" },
            { Text: "LOUISIANA", Value: "LOUISIANA" },
            { Text: "MAINE", Value: "MAINE" },
            { Text: "MARYLAND", Value: "MARYLAND" },
            { Text: "MASSACHUSETTS", Value: "MASSACHUSETTS" },
            { Text: "MICHIGAN", Value: "MICHIGAN" },
            { Text: "MINNESOTA", Value: "MINNESOTA" },
            { Text: "MISSISSIPPI", Value: "MISSISSIPPI" },
            { Text: "MISSOURI", Value: "MISSOURI" },
            { Text: "MONTANA", Value: "MONTANA" },
            { Text: "NEBRASKA", Value: "NEBRASKA" },
            { Text: "NEVADA", Value: "NEVADA" },
            { Text: "NEW HAMPSHIRE", Value: "NEW HAMPSHIRE" },
            { Text: "NEW JERSEY", Value: "NEW JERSEY" },
            { Text: "NEW MEXICO", Value: "NEW MEXICO" },
            { Text: "NEW YORK", Value: "NEW YORK" },
            { Text: "NORTH CAROLINA", Value: "NORTH CAROLINA" },
            { Text: "NORTH DAKOTA", Value: "NORTH DAKOTA" },
            { Text: "OHIO", Value: "OHIO" },
            { Text: "OKLAHOMA", Value: "OKLAHOMA" },
            { Text: "OREGON", Value: "OREGON" },
            { Text: "PALAU", Value: "PALAU" },
            { Text: "PENNSYLVANIA", Value: "PENNSYLVANIA" },
            { Text: "RHODE ISLAND", Value: "RHODE ISLAND" },
            { Text: "SOUTH CAROLINA", Value: "SOUTH CAROLINA" },
            { Text: "SOUTH DAKOTA", Value: "SOUTH DAKOTA" },
            { Text: "TENNESSEE", Value: "TENNESSEE" },
            { Text: "TEXAS", Value: "TEXAS" },
            { Text: "UTAH", Value: "UTAH" },
            { Text: "VERMONT", Value: "VERMONT" },
            { Text: "VERGINIA", Value: "VERGINIA" },
            { Text: "WASHINGTON", Value: "WASHINGTON" },
            { Text: "WEST VIRGINIA", Value: "WEST VIRGINIA" },
            { Text: "WISCONSIN", Value: "WISCONSIN" },
            { Text: "WYOMING", Value: "WYOMING" }
        ], true /*preserve state*/);
    }
  

Нашел ответ самостоятельно.Внесено несколько изменений в код следующим образом..

       <%: Html.TextBoxFor(model => model.EnrolRegAcntDescriptor.state, new { type="Hidden", ID = "statetext", style = "width:10px" })%> 
      function getComboBox() {


        var combobox = document.getElementById('ComboBox-value').value;
        var combotext = document.getElementById('ComboBox-input').value; 
        var index = $("#ComboBox").data("tComboBox").value();

        var states = document.getElementById('statetext').value;
        document.getElementById('statetext').value = index;                    
      //  alert(index);
        return states;
    }