Comment lier kendo mvc de l'interface utilisateur dropdownlist dynamiquement

Je suis en train de travailler sur asp.net mvc avec Kendo UI mvc. J'ai deux kendo listes déroulantes. une liste de cliniques et d'autre de la liste des patients en clinique sélectionnée. Mais il n'y a pas de relation directe entre la clinique et le patient à utiliser la cascade dropdownlist. pour ce que j'ai utilisé des appels ajax en dropdownlist événement de changement et d'obtenir la liste des patients. et c'est ma première dropdownlist pour la liste des cliniques

 @(
  Html.Kendo().DropDownList()
  .Name("ddlClinics")
  .Events(e=>e.Change("ChangeClinic"))
  .BindTo(new SelectList((List<Account.Entities.Clinic>)ViewBag.lstClinic,
 "ClinicID", "ClinicName")))

et c'est mon deuxième dropdownlist pour listpatients

@(
 Html.Kendo().DropDownList()
.Name("ddlPatients")
.BindTo(new SelectList((List<Patient>)ViewBag.Patients, 
"PatId", "PatName"))))

Je veux lier dynamiquement la liste des patients à la deuxième dropdownlist lors de la première dropdownlist changements,

function ChangeClinic()
{
$.ajax({
url: '/Messages/GetPatient',
 type: 'Post',
 data: { email: '@User.Identity.Name' },
 cache: false,
 success: function (result) {
 var ddlPatients = $('#ddlPatients').data('kendoDropDownList');
 var main = [];
 $.each(result, function (k, v) {
 main.push({ "PatId": v.PatId, "PatName": v.PatName });
  });
  ddlPatients.dataTextField = "PatName";
  ddlPatients.dataValueField = "PatId";
  ddlPatients.dataSource.data(main);
  ddlPatients.reload();
 }
 });
}

je suis en mesure de lier la liste dropdownlist mais tous les éléments sont montre que 'undefined'. merci donc de me guider.

OriginalL'auteur Karthik Bammidi | 2012-11-01

  1. 5

    De ce que je peux dire, il y a une relation entre les cliniques et les patients, de sorte que vous devriez être en mesure d'utiliser le CascadeFrom("DropDownList1") fourni dans l'emballage. Nous utilisons une cascade de dropdownlist dans un mode semblable à la relation entre les districts scolaires et les écoles:

    @(Html.Kendo().DropDownList()
            .Name("District")
            .HtmlAttributes(new { style = "width:300px;" })
            .BindTo(ViewBag.districts)
            .DataTextField("DistrictName")
            .DataValueField("DistrictID")
            .OptionLabel("Select District")
)
@(Html.Kendo().DropDownList()
            .Name("School")
            .HtmlAttributes(new { style = "width:300px;" })
            .CascadeFrom("District")
            .BindTo(ViewBag.schools)
            .DataTextField("SchoolName")
            .DataValueField("SchoolID")
            .OptionLabel("Select School")
)

    OriginalL'auteur Elsimer

  2. 2

    Au lieu de créer un tel tableau qui est inutile à la source de données à utiliser:

    success: function (result) {
 var ddlPatients = $('#ddlPatients').data('kendoDropDownList');
 var main = [];
 $.each(result, function (k, v) {
 main.push({ "text": v.PatId, "value": v.PatName });
  });

  ddlPatients.dataSource.data(main);
 }
 });

    OriginalL'auteur Petur Subev

  3. 1

    Si vous voulez remplir deuxième liste Déroulante sur la base de la première liste Déroulante valeur.
    Telerik Fourni, 

    .CascadeTo("DropDownList2")

    Veuillez voir le lien suivant pour obtenir des informations détaillées.

    Une cascade de liste Déroulante dans Telerik dropdownlist

    OriginalL'auteur Kailas Mane

  4. 0

    Si vous n'êtes pas à l'aide de 

    .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action        ("FunctionName", "ControllerName").Data("filterDropdown1");
                            }).ServerFiltering(true);
                        })
.CascadeFrom("Dropdown1")

    propriétés dans la définition de la deuxième liste déroulante à l'aide de la définition mentionnée dans la question ci-dessus. j'.e:-

    @(
 Html.Kendo().DropDownList()
.Name("ddlPatients")
.BindTo(new SelectList((List<Patient>)ViewBag.Patients,"PatId", "PatName"))
)

    ensuite, vous pouvez lier les données de la 2ème liste déroulante directement dans le succès de la fonction de l'ajax post.

        function ChangeClinic()
        {
        $.ajax({
        url: '/Messages/GetPatient',
         type: 'Post',
         data: { email: '@User.Identity.Name' },
         cache: false,
         success: function (result) {
         $('#ddlPatients').data('kendoDropDownList').dataSource.data(result);
             //ddlPatients.reload();

  }
         });
        }

    @Remarque:- 1) La valeur de résultat doit contenir la liste des nouveaux patients ayant des propriétés "PatId" et "PatName" en fonction du paramètre e-mail transmis à la fonction "Messages" dans GetPatient contrôleur, et il n'y aura pas besoin de ddlpatients.reload(), enfait .reload() n'est pas pris en charge, il va casser l'exécution, afin de ne pas les utiliser .reload().

    OriginalL'auteur Shivam657