web-dev-qa-db-fra.com

Envoi de données de chaîne au contrôleur MVC à l'aide de jQuery $ .ajax () et $ .post ()

Il doit y avoir quelque chose qui me manque. J'ai essayé d'utiliser $ .ajax () et $ .post () pour envoyer une chaîne à mon contrôleur ASP.NET MVC, et tant que le contrôleur est atteint, la chaîne est nulle lorsqu'elle y arrive. Alors voici la méthode de publication que j'ai essayée:

$.post("/Journal/SaveEntry", JSONstring);

Et voici la méthode ajax que j'ai essayée:

$.ajax({
    url: "/Journal/SaveEntry",
    type: "POST",
    data: JSONstring
});

Voici mon contrôleur:

public void SaveEntry(string data)
{
    string somethingElse = data;
}

Pour l’arrière-plan, j’ai sérialisé un objet JSON à l’aide de JSON.stringify (), et cela a abouti. J'essaie de l'envoyer à mon contrôleur pour le désérialiser (). Mais comme je l'ai dit, la chaîne arrive à zéro à chaque fois. Des idées?

Merci beaucoup.

UPDATE: Il a été répondu que mon problème était que je n'utilisais pas une paire clé/valeur en tant que paramètre de $ .post (). J'ai donc essayé ceci, mais la chaîne est toujours arrivée au contrôleur en tant que null:

$.post("/Journal/SaveEntry", { "jsonData": JSONstring });
asp.net-mvcjquerycontroller
14
MegaMatt

Répondu. Les noms de variables ne sont pas correctement définis après ma première mise à jour. J'ai changé le nom de la variable dans le contrôleur en jsonData. Mon nouvel en-tête de contrôleur ressemble à ceci:

public void SaveEntry(string jsonData)

et mon post action dans JS ressemble à:

$.post("/Journal/SaveEntry", { jsonData: JSONstring });

JSONstring est un objet JSON "stringified" (ou "serialized") que j'ai sérialisé à l'aide du plugin JSON proposé sur json.org. Alors:

JSONstring = JSON.stringify(journalEntry);  // journalEntry is my JSON object

Ainsi, les noms de variable dans $ .post et dans la méthode Controller doivent être identiques, sinon rien ne fonctionnera. Bon à savoir. Merci pour les réponses.

22
MegaMatt

Réponse finale:

Il semble que les noms des variables ne soient pas alignés dans son message, comme je l’ai suggéré dans un commentaire après avoir réglé les problèmes de formatage des données (en supposant que c’était également un problème.

En fait, assurez-vous que vous utilisez le bon nom de clé recherché par votre code côté serveur, comme le montre l'exemple d'Olek - c'est-à-dire. Si votre code recherche les données variables, vous devez utiliser les données comme clé. - prodigitalson Il y a 6 heures

@prodigitalson, cela a fonctionné. Les noms de variables ne faisaient pas la queue. Voulez-vous poster une deuxième réponse pour que je puisse l'accepter? Merci. - Mega Matt il y a 6 heures

Il devait donc utiliser une paire clé/valeur et s’assurer qu’il récupérait la bonne variable à partir de la requête côté serveur.

l'argument de données doit être une paire clé-valeur

$.post("/Journal/SaveEntry", {"JSONString": JSONstring});
5
prodigitalson

Il semble que dataType est manquant. Vous pouvez également définir contentType au cas où. Souhaitez-vous essayer cette version?

$.ajax({
    url: '/Journal/SaveEntry',
    type: 'POST',
    data: JSONstring,
    dataType: 'json',
    contentType: 'application/json; charset=utf-8'
});

À votre santé.

1
Alex Bernatskyi

Merci d'avoir répondu à cela résout mon cauchemar.

Ma grille

..
.Selectable()
.ClientEvents(events => events.OnRowSelected("onRowSelected"))
.Render();

<script type="text/javascript">
function onRowSelected(e) {
        id = e.row.cells[0].innerHTML;
        $.post("/<b>MyController</b>/GridSelectionCommand", { "id": id});
    }
</script>

mon contrôleur

public ActionResult GridSelectionCommand(string id)
{
     //Here i do what ever i need to do
}
1
ngwanevic

Le chemin est ici.

Si vous voulez spécifier

dataType: 'json'

Alors utilisez,

$('#ddlIssueType').change(function () {


            var dataResponse = { itemTypeId: $('#ddlItemType').val(), transactionType: this.value };

            $.ajax({
                type: 'POST',
                url: '@Url.Action("StoreLocationList", "../InventoryDailyTransaction")',
                data: { 'itemTypeId': $('#ddlItemType').val(), 'transactionType': this.value },
                dataType: 'json',
                cache: false,
                success: function (data) {
                    $('#ddlStoreLocation').get(0).options.length = 0;
                    $('#ddlStoreLocation').get(0).options[0] = new Option('--Select--', '');

                    $.map(data, function (item) {
                        $('#ddlStoreLocation').get(0).options[$('#ddlStoreLocation').get(0).options.length] = new Option(item.Display, item.Value);
                    });
                },
                error: function () {
                    alert("Connection Failed. Please Try Again");
                }
            });

Si vous ne spécifiez pas

dataType: 'json'

Puis utiliser

$('#ddlItemType').change(function () {

        $.ajax({
            type: 'POST',
            url: '@Url.Action("IssueTypeList", "SalesDept")',
            data: { itemTypeId: this.value },
            cache: false,
            success: function (data) {
                $('#ddlIssueType').get(0).options.length = 0;
                $('#ddlIssueType').get(0).options[0] = new Option('--Select--', '');

                $.map(data, function (item) {
                    $('#ddlIssueType').get(0).options[$('#ddlIssueType').get(0).options.length] = new Option(item.Display, item.Value);
                });
            },
            error: function () {
                alert("Connection Failed. Please Try Again");
            }
        });

Si vous voulez spécifier

dataType: 'json' et contentType: 'application/json; jeu de caractères = utf-8 '

Puis utiliser

$.ajax({
            type: 'POST',
            url: '@Url.Action("LoadAvailableSerialForItem", "../InventoryDailyTransaction")',
            data: "{'itemCode':'" + itemCode + "','storeLocation':'" + storeLocation + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: 'json',
            cache: false,
            success: function (data) {

                $('#ddlAvailAbleItemSerials').get(0).options.length = 0;
                $('#ddlAvailAbleItemSerials').get(0).options[0] = new Option('--Select--', '');

                $.map(data, function (item) {
                    $('#ddlAvailAbleItemSerials').get(0).options[$('#ddlAvailAbleItemSerials').get(0).options.length] = new Option(item.Display, item.Value);
                });
            },
            error: function () {
                alert("Connection Failed. Please Try Again.");
            }
        });
0
Md. Nazrul Islam

Si vous ne pouvez toujours pas le faire fonctionner, essayez en vérifiant l'URL de la page vous appelez le $.post depuis.

Dans mon cas, j'appelais cette méthode depuis localhost:61965/Example et mon code était le suivant:

$.post('Api/Example/New', { jsonData: jsonData });

Firefox a envoyé cette demande à localhost:61965/Example/Api/Example/New, c'est pourquoi ma demande n'a pas fonctionné.

0
Jakub Lokša