Liste déroulante en cascade dans ASP.Net MVC2

Question

J'utilise mvc2 avec C# ASP.Net. J'essaie d'implémenter une liste déroulante en cascade, dans laquelle mon premier menu déroulant est nommé groupe et mon second est division. ainsi de suite sélectionner le groupe de ses divisions respectives doivent être affichées dans ma 2ème liste déroulante ..

est le code ici que j'ai essayé de mettre en œuvre

ceci est ma partie de vue.

<%= Html.DropDownList("ddlGroup", IEnumerable<SelectListItem>)ViewData["ddlGroup"])%> 
<select id="ddlDivision" name="Division"></select> 

et la partie du script est

$(document).ready(function() { 
    $("#ddlGroup").change(function() { // group drop down selected index change  
    LoadDivision($("#ddlGroup").val());   
    }).change(); // For 1st data in on load 
}); 

function LoadDivision (Group) {  
    var url = "../Training/GetJsonDivision"; 
    $.getJSON(url, { Group: Group }, function (data) {   
    $.each(data, function (index, optionData) {     
     $("#ddlDivision").append("<option value'" + optionData.Division + "'>" + optionData.Division + "</option">); 
    }); 
    }); 
} 

et ma part du contrôleur est

public ActionResult GetJsonDivision(string Group) 
{   
    SelectList division = new SelectList(GetDivision(Group), "Division", "Division"); 
    return this.Json(division, JsonRequestBehavior.AllowGet); 
} 

ici mon GetJsonDivision retourne l'ensemble de la division pour le groupe donné. Dans ma requête jquery, sur l'appel de fonction getJSON, il est transmis au contrôleur et la méthode est exécutée, mais après chaque instruction, je ne suis pas capable de lier les données à la liste déroulante.

Quelqu'un peut-il m'aider à ce sujet. Je ne suis pas clair sur ce qu'est cette optionData que nous donnons dans le paramètre de fonction de rappel, et comment il a été mappé aux valeurs de retour.

merci et respect Malathy.

Answer 1

Je ne crois pas que vous ajoutez vraiment un nouvel élément lorsque vous insérez ce texte directement. Par exemple, essayez quelque chose comme ceci:

$(data).each(function() 
{ 
    var option = $('<option />'); 
    option.val(this.Division).text(this.Division); 
    $('#ddlDivision').append(option); 
}); 

Essayez cela et voyez si cela fonctionne.