Ce que je fais, c'est que j'obtiens des données côté serveur en utilisant mvc. Les données arrivent correctement dans la partie retour. Mais lorsque je débogue côté client, je n'obtiens que la valeur du paramètre en tant que [.

Vous trouverez ci-dessous la réponse JSON que je reçois.

[{"VENDORNAME":"ABC","VENDORCODE":"1234"},{"VENDORNAME":"Abc test","VENDORCODE":"233311"},{"VENDORNAME":"ABC 2","VENDORCODE":"12345"}]

Mais lorsque j'enregistre le client, je ne l'obtiens que [ dans le paramètre.

Ci-dessous ce code

getValue: function (element) {        
        return {
            label: element.VENDORNAME,
            value: element.VENDORCODE
         };
    },  

Dans element je n'obtiens que [

S'il vous plaît suggérer où je me trompe

mettre à jour

Voici le code complet

var autocompleteOptions = {        

    url: function (phrase) {
        return AppConfig.PrefixURL + 'App/GetVendorData';
    },

    getValue: function () {        
        return {
            label: element.VENDORNAME,
            value: element.VENDORCODE
         };
    },      

    ajaxSettings: {
        dataType: "json",
        method: "POST",
        data: {
            dataType: "json",                
        }
    },        

    preparePostData: function (data) {
        data.phrase = $("#txtAssignVendor").val();           
        return data;
    },

    requestDelay: 400
};

Et lien de référence ci-dessous

http://easyautocomplete.com/examples#examples-ddg

Code serveur

[HttpPost]
    public JsonResult GetVendorData(string phrase)
    {
        string strJsonData = "";
        try
        {
            Assignment ObjSAPAssign = new Assignment();
            DataTable dt = ObjSAPAssign.GetVendorList(phrase);               
            strJsonData = JsonConvert.SerializeObject(dt, Formatting.None);                
        }
        catch (Exception ex)
        {
            ApplicationLog.Error("Error", "GetVendorData", ex.Message);
            ErrorLog.HandleErrorLog("", "", "GetVendorData", ex.Message);
        }
        return Json(strJsonData);
    }
1
hud 16 mars 2019 à 15:35

2 réponses

Meilleure réponse

L'erreur était que vous étiez en train de sérialiser votre DataTable deux fois, une fois par JsonConvert.SerializeObject() et l'autre par la méthode Json().


Créez une classe de modèle comme celle-ci :

public class VendorData 
{ 
    public string VENDORNAME { get; set; } 
    public string VENDORCODE { get; set; } 
}

Voici la méthode d'action modifiée

[HttpPost] 
public JsonResult GetVendorData(string phrase) 
{ 
    try 
    { 
        Assignment ObjSAPAssign = new Assignment(); 
        DataTable dt = ObjSAPAssign.GetVendorList(phrase); 
        List<VendorData> vendorList = dt.AsEnumerable().Select(row => new VendorData 
        { 
            VENDORNAME = row.Field<string>("VENDORNAME"), 
            VENDORCODE = row.Field<string>("VENDORCODE") 
        }).ToList();

        // Serializing only once 
        return Json(vendorList, JsonRequestBehavior.AllowGet); 
    } 
    catch (Exception ex) 
    { 
        ApplicationLog.Error("Error", "GetVendorData", ex.Message); 
        ErrorLog.HandleErrorLog("", "", "GetVendorData", ex.Message); 
        return Json(new object(), JsonRequestBehavior.AllowGet); 
    } 
}

et enfin côté client :

var autocompleteOptions = { 

url: function (phrase) { 
    return AppConfig.PrefixURL + 'App/GetVendorData'; 
}, 

getValue: "VENDORNAME", 

template: { 
    type: "description", 
    fields: { 
    description: "VENDORCODE" 
    } 
}, 

list: { 
    match: { 
        enabled: true 
    } 
}, 

ajaxSettings: { 
    dataType: "json", 
    method: "POST", 
    data: { 
        dataType: "json", 
    } 
}, 

preparePostData: function (data) { 
    data.phrase = $("#txtAssignVendor").val(); 
    return data; 
}, 

requestDelay: 400 
};
1
Kunal Mukherjee 18 mars 2019 à 12:23

Votre code serveur :

    string strJsonData = "";
    try
    {
        Assignment ObjSAPAssign = new Assignment();
        DataTable dt = ObjSAPAssign.GetVendorList(phrase);               
        strJsonData = JsonConvert.SerializeObject(dt, Formatting.None);                
    }
    catch (Exception ex)
    {
        ApplicationLog.Error("Error", "GetVendorData", ex.Message);
        ErrorLog.HandleErrorLog("", "", "GetVendorData", ex.Message);
    }
    return Json(strJsonData);

Vous créez la liste des fournisseurs dans dt, puis vous utilisez JsonConvert.SerializeObject() pour créer la réponse JSON. Cependant, vous le sérialisez ensuite à nouveau dans ce dernier appel à Json(). ça doit être clair

    return strJsonData;

C'est pourquoi vous obtenez [ comme premier "élément": le plugin de saisie semi-automatique parcourt votre JSON en tant que chaîne. Si vous modifiez cette instruction return, elle recevra correctement votre table actuelle.

edit — Je suis presque sûr que ce qui précède décrit le problème, mais ma suggestion ne fonctionnera pas car strJsonData est le mauvais type de données (pas JsonResult). Sur la base de cette autre question je pense que cela pourrait fonctionner : n'utilisez pas JsonConvert.SerializeObject. Au lieu de cela, utilisez plain Json() :

    DataTable dt;
    try
    {
        Assignment ObjSAPAssign = new Assignment();
        dt = ObjSAPAssign.GetVendorList(phrase);               

    }
    catch (Exception ex)
    {
        ApplicationLog.Error("Error", "GetVendorData", ex.Message);
        ErrorLog.HandleErrorLog("", "", "GetVendorData", ex.Message);
    }
    return Json(dt, JsonRequestBehavior.AllowGet);                

(Notez que je ne connais pas vraiment C# - le fait est que vous devez utiliser Json() pour obtenir JsonResult à partir du DataTable.)

Maintenant, une fois que cela est réglé et que le plugin de saisie semi-automatique reçoit correctement le tableau, la prochaine chose à décider est de savoir quoi faire avec cette fonction getValue(). Le plugin s'attend à traiter des chaînes. Dans votre code, vous avez cette fonction qui renvoie un objet, et cela va juste embrouiller le plugin.

Je ne sais pas ce dont vous avez besoin pour la plus grande application, mais la fonction pourrait faire quelque chose comme ceci :

      getValue: function(element) {
        return element.VENDORNAME + " - " + element.VENDORCODE;
      }
2
Pointy 16 mars 2019 à 14:34