AJAX çağrısı MVC'deki OnChange etkinliğinde

Question

Görünümün bir parçası olan açılır listenin onchange olayı üzerine bir AJAX çağrısı yapmalıyım. Değişim olayında veritabanını aramam gerekiyor, bazı hesaplamalar UI'yi gösteriyor ve daha sonra bir grafik kontrolünü doldurmak için hesaplamaları kullan. UI ekranı bu sırada. Grafik Açılır kategoriler derece ile alt kategorilerden liste Yani ben, değişikliği etkinliğinde DIV3 kategoriler oylarını görüntülemek derecelendirme kullanmak gerekir gibi grafiği doldurmak için skor puanı sıralar. Kolayca .NET'de yapıldı ama nasıl MVC ?? Düşünebildiğim tek seçenek, arkasındaki kodla kullanıcı kontrolünü oluşturmak ama MVC'yi kullanmanın amacını yitirmek. Herhangi bir yardım için teşekkür ederiz.

Answer 1

Kısmi görünümden yararlanın. Orada ASP.Net MVC Kısmi Görünüm google eğer birçok bağlantılar vardır ama burada yolu ben

http://blog.stevensanderson.com/2008/10/14/partial-requests-in-aspnet-mvc/

Answer 2

intestering bulundu biridir ben tamamen size yapmaya çalıştığını anlamak emin değilim ama MVC Muhtemelen bir çift AJAX çağrısını bir araya getirme görevini üstlenirdim. İlk seçimine göre kategori derecelendirmelerini günceller. Bu, muhtemelen puanları kolayca çıkarabilmeniz için JSON'u döndürür. İkincisi, ilk olarak döndürülen derecelendirme puanlarını alır ve grafiği HTML olarak işleyen bir eylemi çağırır; yani, döndürülen ve belgede uygun yere yerleştirilen kısmi bir görünüm oluşturur.

Answer 3

Bunu nasıl uygulayacağınız hakkında genel bir fikir verilmektedir.

<script type="text/javascript"> 
    // assuming you're using jQuery 
    $("#ddlAjax").change(function (event) { 
     $.ajax({ 
      url: "Controller/GetPartialGraph/" + $(this).val(), 
      data: { id = $(this).val() /* add other additional parameters */ }, 
      cache: false, 
      type: "POST", 
      dataType: "html", 

      success: function (data, textStatus, XMLHttpRequest) { 
       $("#divPartialView").html(data); // HTML DOM replace 
      } 
     }); 
    }); 
</script> 

<select id="ddlAjax"> 
    ... list of options 
</select> 


<div id="divPartialView"> 
    <!-- something like this in your ASP.NET View --> 
    <%= Html.RenderPartial("MyPartialView", Model) %> 
</div> 

Denetleyici eylem yönteminiz.

[HttpPost] 
public PartialViewResult GetPartialGraph(int id /* drop down value */) 
{ 
    // do calculations whatever you need to do 
    // instantiate Model object 
    var model = myBusinessLogicService.DoCalculations(id); 

    return PartialView("MyPartialView", model); 
} 

Bence bu aradığınız cevaptır.

Answer 4

Tamam, ia bir onchange olay çağırmak için bir yol istediğini bir dropdownlist değişiklik bu yararlı olabilir eğer:

@Html.DropDownListFor(
         model => model.SelectedId, 
         new SelectList(ViewBag.Ids, "Id", "Name"), 
         "[All]", 
         new { onchange = "onChangeId();", @id ="municipalityDropDown" } 
         ) 

o zaman bu javascript kodu olabilir ve ajax kodu. Ve burada bir eylem yöntemini çağırmak için bir jax kod örneği.

function onChangeId() { 
     jQuery.ajax({ 
      url: '@Url.Action("Action Method Name", "Controller Name")', 
      type: 'POST', 
      contentType: 'application/json', 
      data: JSON.stringify({ data: data2 }), 
      success: function (result) { } 
     }); 
    } 

Answer 5

Evet, bu doğru - tek değişiklik değiştiriliyor:

onchange = “this.form.submit();” 

ile:

onchange = “$(this.form).submit();” 

çalıştığını Benim için this mesaja