Sorunlar, oluşturulan açılır ...

Question

İşte kod iyi çalışıyor

görüntüde benim görünümüdür sunucuya değer seçilebilir ancak ilanı değil

i formu gönderin

, onu sadece ilk açılan listenin değerini gönderir (tarayıcı ağında argümanları kontrol ettim), ayrıca sayfa kaynağını görüntülediğimde ajax işlevini kullanarak oluşturduğum seçenekleri göstermez. İşte

benim Kod benim ilk DropDownList ikinci dropdownlist verilerine

[HttpPost] 
public JsonResult UpdateCountryDropDownList(int ContinentId) 
{ 
    HotelContext H = new HotelContext(); 
    List<SelectListItem> CountryNames = new List<SelectListItem>(); 
    List<Country> Co = H.Country.Where(x => x.ContinentId == ContinentId).ToList(); 
    Co.ForEach(x => 
    { 
     CountryNames.Add(new SelectListItem { Text = x.Name, Value = x.Id.ToString() }); 
    }); 
    return Json(CountryNames , JsonRequestBehavior.AllowGet); 
} 

My Ajax çağrısı ait json dönmek

public ActionResult TwoDropDownList() 
{ 
    HotelContext H = new HotelContext(); 
    ViewBag.DropDownListOne = new SelectList(H.Continent.ToList(), "Id", "Name"); 
    return View(); 
} 

Eylem oluşturmak

eylem

@model Hotel.Models.Continent 
<script> 
     $(document).ready(function() { 
      $("#Name").change(function() { 
       var ContinentoId = $(this).val(); 
       $.ajax({ 
        type: "POST", 
        dataType: "json", 
        data: { ContinentId: ContinentoId }, 
        url: '@Url.Action("UpdateCountryDropDownList","Home")', 
        success: function (result) { 
         var Country = "<select id='ddlCountry'>"; 
         Country = Country + '<option value="">--Select--</option>'; 
         for (var i = 0; i < result.length; i++) { 
          Country = Country + '<option value=' + result[i].Value + '>' + result[i].Text + '</option>'; 
         } 
         Country = Country + '</select>'; 
         $('#Countries').html(Country); 
        }, 
        error: function (xhr, ajaxOptions, thrownError) { 
         console.log(arguments) 
        } 
       }); 
      }); 
     }) 
</script> 

My Görünüm

@using(Html.BeginForm()){ 
    SelectList se = ViewBag.DropDownListOne; 
    @Html.DropDownListFor(x=>x.Name,se,"--Select--") 
    <div id ="Countries"> 
     @Html.DropDownList("ddlCountry",new List<SelectListItem>(),"--Select--") 
    </div> 
    <input type="submit" value="submit" style="margin-top:100px;" /> 
} 

HttpPost Eylem

[HttpPost] 
public string TwoDropDownList(string Name, string ddlCountry) 
{ 
    if (string.IsNullOrEmpty(Name) || string.IsNullOrEmpty(ddlCountry)) 
    { 
     return ("you must select Both"); 
    } 
    else 
     return ("everything is working fine"); 
} 

Answer 1

, üzerine yazmak ve name özniteliği olmadan yeni <select> elemanı oluşturmak (onun değeridir değil geri gönderildi. başarı geri arama durumunda

, sen <option> unsurları oluştururken ve mevcut <select>

012 onları ekleme yapılmalıdır

success: function (result) { 
    var country = $('#ddlCountry); // get the existing element 
    country.empty().append($('<option></option>').val('').text('--Select--')); 
    $.each(result, function(index, item) { 
     country.append($('<option></option>').val(item.Value).text(item.Text)); 
    }); 
} 

Yan not: yöntemleri anonim nesneler topluluğu dönen gerektiğini değil SelectListItem bunları kullanmak olmadığında ek verileri telde (SelectListItem diğer özellikleri) gönderme hiçbir anlamı yoktur.

Answer 2

Sana <div id ="Countries"> için bitiş etiketi </div> eksik olduğunu düşünüyorum.

bu deneyin: Zaten @Html.DropDownList("ddlCountry", new List<SelectListItem>(), "--Select--") tarafından değil ajax çağrısında oluşturulan name="ddlCountry" (bir <select> öğesi

<div id ="Countries"> 
    @Html.DropDownList("ddlCountry",new List<SelectListItem>(),"--Select--") 
</div>