Remplir un kendoDropDownList avec appel Ajax

Salutation à tous!!!

Voila je travail en ce moment avec l'API de KendoUI. Et la j'expérimente l'utilisation d'un kendoDropDownList (une liste déroulante avec une recherche avec autocompletion lien ici: http://demos.telerik.com/kendo-ui/dr...erverfiltering). Du coup j'essaie charger cette liste avec une action d'un de mes controller sur Symfony. Pour cela kendoUI utilise des datasource et j'essaie de faire un appel ajax dessus pour récupérer mes données. Mais Pour l'instant rien ne fonction et je trouve rien sur internet sur charger ce kendoDropDownList en utilisant du php.

voici le javascript:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29

$("#recherche_pef").kendoDropDownList({ filter: "startswith", dataTextField: "NomPEF",//valeur à rechercher dataValueField: "IDPEF",//valeur retounrné après recherche (genre id pour traitement) placeholder: "Rechercher un PEF/DP...", dataSource: { //type: "odata", serverFiltering: true, transport: { /*read: {   //url: "EventsSaisieDepart/RecherchePEF",   url: "RecherchePEF",   dataType: "json"   }*/ read: function(options) { $.ajax({ type: "GET", url: "EventsSaisieDepart/RecherchePEF", // contentType: "application/json; charset=utf-8", dataType: 'json', //data: JSON.stringify({key: "value"}), success: function(data) { options.success(data); } }); } } } });

---

L'action de mon controller symfony:

Code:

---

1 2 3 4 5 6 7 8 9 10 11

public function RecherchePEFAction(){ $test = "coucou"; $test2 = $_GET['$inlinecount']; $test3 = $_GET['filter']; //$tab = array(); $tab = array("IDPEF"=>"1", "NomPEF" => "gare du nord"); //$tab = array("IDPEF"=>"2", "NomPEF" => "gare du sud"); //$tab = array("IDPEF"=>"3", "NomPEF" => "gare de l'est"); return json_encode($tab); //var_dump($tab); }

---

Voila quelqu'un aurait-il une solution ou s'y connaitrait en kendoUI ?? Car la je bloque complètement... Merci d'avance!!!

J'ai trouvé la solution depuis un moment et j'ai oublié de poster la solution :). Donc je suis passé par la création d'une datasource pour alimenter mon kendoDropDownList.

Voici le code javascript:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42

var pef={{liste_pef|raw}}; Listepef = new kendo.data.DataSource({ data:pef, sort: { field: 'nom', dir: 'asc' } }); $("#recherche_pef").kendoDropDownList({ filter: "startswith", dataTextField: "nom",//valeur à rechercher dataValueField: "code",//valeur retounrné après recherche (genre id pour traitement) optionLabel: "Rechercher", dataSource:Listepef, change: function(e) { var id_pef = $("#recherche_pef").data("kendoDropDownList").value();   $.ajax({ type: 'POST', url : "{{ path('miseaJourPEF')}}", dataType : 'text', // on spécifie bien que le type de données est en JSON data : { id_pef: id_pef // on donne la chaîne de caractère tapée dans le champ de recherche }, success : function(data){ // on se prépare à renvoyer les données réceptionnées grâce à l'évènement de succès   var new_data = $.parseJSON(data); // console.log(new_data); $("#treeview_copie").data("kendoTreeView").dataSource.data(new_data);     }, error : function(erreur){ alert("Une erreur est survenue "+ erreur); console.log(erreur); } }); }, open: function () { $("#recherche_pef").getKendoDropDownList().list.find("k-list-optionlabel").first().hide(); }   });

---

Le code php qui me permet de charger ma liste:

Code:

---

1 2 3 4 5 6 7

$req_pef = $em->getRepository('gideBundle:PEF')->listePEFrecherche(); $liste_pef=json_encode($req_pef);   return $this->get('templating')->renderResponse('AppliBundle:Dep:Copie.html.twig', array( 'liste_pef'=>$liste_pef   ));

---