Erreur d'analyse json avec Ajax et MVC3

Question

C'est la première fois que je travaille avec un poste Ajax Json.

J'ai maintenant le code script suivant :

<script type="text/javascript">
$(document).ready(function () {
    // If the button is clicked, redirect to a controller action, send the data, and show
    // a view with the changes. 
    $('#submitDiffs').click(function () {
        var requirementNumberData = "@Model.FirstOrDefault().Requirement.RequirementNumber";

        var data = [];
        $('table tr').children('td').children('#selected :checked').each(function (i, element) {
            var el = $(element);
            data[i] = el.parent().siblings(':eq(1)').html();
        });

        diffParameters = GetDifferenceParameters(data);
        var jsonData = JSON.stringify(diffParameters, null, 2);

        $.ajax({
            url: '/Requirements/Differences',
            type: 'POST',
            data: jsonData,
            dataType: 'json',
            contentType: 'application/json; charset=utf-8',
            // callback handler that will be called on error 
            success: function (response) {
                alert("Ajax call made successfully!!!");
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.status + '\n\r' + xhr.responseText);
                alert(thrownError);
            }     

        });
    });

    function GetDifferenceParameters(data) {
        var requirementNumber = "@Model.FirstOrDefault().Requirement.RequirementNumber";
        var oldRequirement = data[1];
        var newRequirement = data[0];

        return { 
            RequirementNumber: requirementNumber,
            OldRequirement: oldRequirement,
            NewRequirement: newRequirement
        };
    }
});

Ce code est affiché dans un contrôleur MVC3, code ci-dessous :

[HttpPost]
public ActionResult Differences(RequirementDifferenceViewModel model)
{
    HtmlDiff diff = new HtmlDiff(model.OldRequirement, model.NewRequirement);
    model.ContentDifference = diff.Build();

    return View(model);
}

Voici le modèle de vue :

public class RequirementDifferenceViewModel
{
    public string RequirementNumber { get; set; }
    public string OldRequirement { get; set; }
    public string NewRequirement { get; set; }
    public string ContentDifference { get; set; }
}

Si j'omets le jSON.stringify, l'action du contrôleur n'est pas exécutée et je reçois une erreur 500. Si je stringifie, j'obtiens un statut 200, mais pourtant une erreur de parse jSON est renvoyée à AJAX. Dans les deux cas, la chaîne jSON exacte est envoyée à l'appel AJAX.

Voici la chaîne jSON que j'ai copiée à partir de Firebug :

{
  "RequirementNumber": "PFSNET-UC12-008",
  "OldRequirement": "\n                <p class=\"Bullet1\"><span style=\"font-size:10.0pt;font-family:Wingdings;\nfont-weight:normal\">r<span style=\"font:7.0pt &quot;Times New Roman&quot;\">&nbsp; </span></span><span lang=\"X-NONE\">[PFSNET-UC12-008] – Undo/redo will be supported for Expert\nAssistant. The details can be found in the use case for Undo/Redo.</span>&nbsp; </p> \n\n <p class=\"Bullet2\"><span style=\"font-family:Wingdings;font-weight:\nnormal\" lang=\"X-NONE\">§<span style=\"font:7.0pt &quot;Times New Roman&quot;\">&nbsp; </span></span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T11:06\">A</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\">n ‘Undo\nLast Action’ button will </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T11:06\">also </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\">be available</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T11:05\"> for\nselect products</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\">.&nbsp; See\nUC12-</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-29T14:10\">229</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\"> for\nadditional information.</span></p> \n\n <p class=\"MsoNormal\">&nbsp;</p> \n\n\n            ",
  "NewRequirement": "\n                <p class=\"Bullet1\"><span style=\"font-size:10.0pt;font-family:Wingdings;\nfont-weight:normal\">r<span style=\"font:7.0pt &quot;Times New Roman&quot;\">&nbsp; </span></span><span lang=\"X-NONE\">[PFSNET-UC12-008] – Undo/redo will be supported for Expert\nAssistant. The details can be found in the use case for Undo/Redo.</span>&nbsp; </p> \n\n <p class=\"Bullet2\"><span style=\"font-family:Wingdings;font-weight:\nnormal\" lang=\"X-NONE\">§<span style=\"font:7.0pt &quot;Times New Roman&quot;\">&nbsp; </span></span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T11:06\">A</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\">n ‘Undo\nLast Action’ button will </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T11:06\">also </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\">be available</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T11:05\"> </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-06-20T12:34\">on </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-06-20T12:42\">the\nAdvanced Expert Assistant screen.&nbsp; </span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\">See\nUC12-</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-29T14:10\">229</span><span class=\"msoIns\"><ins cite=\"mailto:Michelle%20Reini%20Hotchkiss\" datetime=\"2012-05-18T08:36\"> for\nadditional information.</span></p> \n\n <p class=\"MsoNormal\">&nbsp;</p> \n\n\n            "
}

J'ai mis cette chaîne dans un site web validateur jSON et elle a passé : [http://jsonformatter.curiousconcept.com/]

L'erreur d'analyse exacte est : Erreur de syntaxe : JSON.parse : caractère inattendu

Toute aide serait appréciée !

EDIT 2 :

Il s'avère que l'erreur d'analyse est due au fait que le gestionnaire de succès AJAX n'est pas en mesure d'analyser correctement la réponse. J'essaie toujours de comprendre cette partie du problème.

Dès que l'événement Success est exécuté, l'exécution du code passe directement à l'événement Error.

Answer 1

Si vous l'exécutez dans un navigateur, tel que firefox ou chrome (pas ie), vous pouvez inspecter le message réseau et regarder les en-têtes. Là, vous devriez être en mesure de voir exactement quelles informations ont été transmises. Il est plus que probable que vous obteniez des caractères que vous n'attendez pas et qui sont à l'origine de l'erreur d'analyse.

Answer 2

var requirementParameters = "{ oldRequirement: contentRecords[1], newRequirement: contentRecords[0] }"; n'est pas valide json

Vous cherchez probablement quelque chose comme :

var requirementParameters = {
    oldRequirement: contentRecords[1],
    newRequirement: contentRecords[0]
};

Cela crée un objet anonyme avec vos champs. L'ancien code était juste une chaîne de caractères qui vous le JSON.stringify Encore une fois.