Comment remplir dynamiquement les options de sélection de jqGrid à l'aide de réponses JSON étendues ?

Afficher les données indirectes dans jqGrid

jqGrid fournit un formateur "select" pour afficher les données indirectes. Cependant, ce formateur présente des limites en termes d'options de remplissage dynamique. Pour surmonter ce problème, la réponse JSON du serveur peut être étendue pour inclure des données supplémentaires utilisées pour renseigner les options de sélection.

Question originale :

La structure des données est la suivante :

SID	SNAME	CITY
1	ABC	11
2	XYZ	12
3	ACX	13
4	KHG	14
5	ADF	15
6	KKR	16

Un autre tableau fournit les noms de villes :

CID	CNAME
11	Chennai
12	Mumbai
13	Delhi

Le but est d'afficher les données comme :

SID	SNAME	CITY
1	ABC	Chennai
2	XYZ	Mumbai
3	ACX	Delhi
4	KHG	Banglore
5	ADF	Hyderabad
6	KKR	Kolkatta

Solution utilisant la réponse JSON étendue :

Le serveur peut étendre la réponse JSON pour inclure un attribut « cityMap » qui mappe les identifiants de ville aux noms de ville :

<code>{
    "cityMap": {"11": "Chennai", "12": "Mumbai", "13": "Delhi"},
    "rows": [
        { "SID": "1",  "SNAME": "ABC", "CITY": "11" },
        { "SID": "2",  "SNAME": "XYZ", "CITY": "12" },
        { "SID": "3",  "SNAME": "ACX", "CITY": "13" },
        { "SID": "4",  "SNAME": "KHG", "CITY": "13" },
        { "SID": "5",  "SNAME": "ADF", "CITY": "12" },
        { "SID": "6",  "SNAME": "KKR", "CITY": "11" }
    ]
}</code>

Configuration jqGrid :

<code>colModel: [
    {name: "SNAME", width: 250},
    {name: "CITY", width: 180, align: "center"}
],
beforeProcessing: function (response) {
    var $self = $(this);
    $self.jqGrid("setColProp", "CITY", {
        formatter: "select",
        edittype: "select",
        editoptions: {
            value: $.isPlainObject(response.cityMap) ? response.cityMap : []
        }
    });
},
jsonReader: { id: "SID"}</code>

Cette approche permet de renseigner dynamiquement les options de sélection en fonction des données du serveur. Il peut également être utilisé pour définir dynamiquement d'autres options de colonnes en fonction des données du serveur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!