web-dev-qa-db-fra.com

AJAX and Web Api Post Method - Comment ça marche?

J'essaie d'écrire dans ma base de données en utilisant AJAX/Jquery et c #. Chaque fois que je passe le paramètre dans le code C #, il affiche null. J'utilise le modèle par défaut généré par visual studio lors de la création d'une classe de contrôleur. Toute aide serait appréciée!

Note: C’est un service de repos que j’essaie d’appeler. (Un site Web ASP standard ... pas MVC. En outre, l'API GET Rest fonctionne parfaitement.)

Jquery/AJAX:

        var dataJSON = { "name": "test" }

        $('#testPostMethod').bind("click", GeneralPost);
        function GeneralPost() {
            $.ajax({
                type: 'POST',
                url: '../api/NewRecipe',
                data:JSON.stringify(dataJSON),
                contentType: 'application/json; charset=utf-8',
                dataType: 'json'
            });
        }

C #

    //If I remove the [FromBody] Tag then when I click the button this method is never called.
    public void Post([FromBody]string name)

    {

    }

MODIFIER:

J'ai légèrement ajusté mon code mais je rencontre toujours le même problème. Pour récapituler, il charge la méthode POST, mais il passe à null.

C #

 public class RecipeInformation
    {
        public string name { get; set; }

    }

        public void Post(RecipeInformation information)

        {

        }

AJAX:

    var dataJSON = { information: { name: "test" } };

    $('#testPostMethod').bind("click", GeneralPost);
    console.log(dataJSON);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '../api/NewRecipe',
            data: dataJSON,
            contentType: 'application/json; charset=utf-8',
        });
    }
c#jqueryajaxasp.net-web-api
23
Yecats

Pour un type simple, côté serveur:

public void Post([FromBody]string name)
{
}

côté client, vous définissez si vous voulez envoyer au format json:

    var dataJSON = "test";

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '/api/NewRecipe',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }

Si vous voulez le faire fonctionner en type complexe, côté serveur, vous devez définir:

public class RecipeInformation
{
    public string name { get; set; }
}

public class ValuesController : ApiController
{
    public void Post(RecipeInformation information)
    {
    }
}

Et du côté client:

    var dataJSON = { name: "test" };

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '/api/NewRecipe',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }
50
cuongle

Je suppose que vous utilisez ASP.NET WebAPI et qu'il lie tous les types simples (int, bool, chaîne, etc.) de l'URL et tous les types complexes du corps. Lorsque vous avez marqué name avec l'attribut FromBody, il le lie depuis le corps de la demande au lieu du mappage d'URL.

Vous pouvez en savoir plus sur le routage ASP.NET WebAPI et la liaison de paramètres ici: 

2
Sławomir Rosiek

Vous pouvez essayer de faire quelque chose comme ça et utiliser la méthode jquery param

    var postData = {
        name : 'name'
    }

    $('#testPostMethod').bind("click", GeneralPost);
    function GeneralPost() {
        $.ajax({
            type: 'POST',
            url: '../api/NewRecipe',
            data: $.param(postData,true),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json'
        });
    }
2
itsstephyoutrick

Il manque un élément qui concerne les attributs de contrat de données Si vous définissez votre classe comme:

[DataContract]
public class RecipeInformation
{
    [DataMember]
    public string name { get; set; }
}

Ces attributs se trouvent dans System.Runtime.Serialization et l’analyseur Json (Json.NET) les utilise pour (aide) désérialiser le modèle.

1
Christopher Stevenson

La liaison dans les contrôleurs API est un peu étrange. Je crois:

public void Post([FromBody]RecipeInformation information)

avec

var dataJSON = { name: "test" };

devrait fonctionner, et fonctionnera certainement si vous le transmettez simplement en tant que données de formulaire.

1
Yaur

$ ("# updateuser"). click (function () {

        var id = $("#id").val();
        var dataJSON = $("#username").val();

        alert("" + dataJSON);

        $.ajax({


            url: 'http://localhost:44700/api/Home/' + id,
            type: 'PUT',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',

            success: function (data, textStatus, xhr) {
                $.each(data, function (key, val) {
                    $("<li>" + val + "</li>").appendTo($("#names"));
                })
            },
            error: function (xhr, textStatus, errorThrown) {
                alert('Error in Operation');
            }

            })

    })
0
Rai Ahmad Fraz

J'ai trouvé le problème avec l'aide de Microsoft Docs Utilisez le code JS comme indiqué 

$.post('api/updates/simple', { "": $('#status1').val() });

Ce qui m’a manqué, c’est d’ajouter un nom de propriété vide. L’opération doit donc être {"":data:JSON.stringify(dataJSON)}, au lieu de data:JSON.stringify(dataJSON),

0
RobLudlmsFrn