跳到主要內容

[HTML/MVC] 連動 Dropdownlist 後端->View



[.CS]

            var result = new SelectList(new[]
            {
                new { Id = "A", Name = "Code A" },
                new { Id = "B", Name = "Code B" },
                new { Id = "C", Name = "Code C" },
            }, "Id", "Name");


            ViewBag.DDLData = result;


[HTML]

          <select name="ddlT" id="ddlID">        
          @foreach (var item in (SelectList)ViewBag.DDLData)
          {
            <option value="@item.Value" >@item.Text</option>
          }
        </select>

       <select name="ddlT2" id="ddlID2">
       </select>


        //依 Value 設定 Selected
         <script>
             $(document).ready(function () {
                   $("[name=ddlT] option[value='C']").attr("selected", "selected");
                   ChangeOptions();
                   $('#ddlID').change(function () { ChangeCountyOptions(); });
                   $("[name=ddlT2] option[value='3']").attr("selected", "selected");
             });

            function ChangeOptions() {
         
                var selectedCityId = $.trim($('#ddlID option:selected').val());
         
                $('#ddlID2').empty();
                $.ajax(
                {
                    url: "/THTML/GetCountyOptions/",
                    data: { cid: selectedCityId },
                    type: 'post',
                    cache: false,
                    async: false,
                    dataType: 'html',
                    success: function (data) {
                        if (data.length > 0) {
                            $('#ddlID2').append(data);
                        }
                    }
                });          
             }
         </script>


參考連結


留言