Serializacja do JSON w jQuery [duplikat]

Używam jquery-json od 6 miesięcy i działa świetnie. Jest bardzo prosty w użyciu:

var myObj = {foo: "bar", "baz": "wockaflockafliz"};
$.toJSON(myObj);

// Result: {"foo":"bar","baz":"wockaflockafliz"}

Działa na IE8+

Nie potrzeba jQuery, użyj:

JSON.stringify(countries); 

Nie używałem go, ale możesz spróbować jQuery plugin napisany przez Mark Gibson

Dodaje dwie funkcje: $.toJSON(value), $.parseJSON(json_str, [safe]).

Nie, standardowym sposobem serializacji do JSON jest użycie istniejącej biblioteki serializacji JSON. Jeśli nie chcesz tego robić, będziesz musiał napisać własne metody serializacji.

Jeśli chcesz wskazówek, jak to zrobić, sugeruję zbadanie źródła niektórych dostępnych bibliotek.

EDIT: nie powiem, że pisanie własnych metod serliazacji jest złe, ale musisz wziąć pod uwagę, że jeśli jest to ważne dla Twojej aplikacji do użyj dobrze uformowanego JSON, a następnie musisz zważyć narzut "jeszcze jednej zależności" w stosunku do możliwości, że Twoje niestandardowe metody mogą pewnego dnia napotkać przypadek awarii, którego nie przewidziałeś. To, czy ryzyko jest akceptowalne, zależy od Ciebie.

Znalazłem to gdzieś. Nie pamiętam gdzie... prawdopodobnie na StackOverflow :)

$.fn.serializeObject = function(){
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name]) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

Jeśli nie chcesz korzystać z zewnętrznych bibliotek, istnieje metoda .toSource() natywny JavaScript, ale nie jest idealnie cross-browser.

Najlepszym sposobem jest włączenie polyfill dla JSON obiektu.

Ale jeśli nalegasz, aby utworzyć metodę serializacji obiektu do notacji JSON ( poprawne wartości dla JSON ) wewnątrz przestrzeni nazw jQuery, możesz zrobić coś takiego:

Implementacja

// This is a reference to JSON.stringify and provides a polyfill for old browsers.
// stringify serializes an object, array or primitive value and return it as JSON.
jQuery.stringify = (function ($) {
  var _PRIMITIVE, _OPEN, _CLOSE;
  if (window.JSON && typeof JSON.stringify === "function")
    return JSON.stringify;

  _PRIMITIVE = /string|number|boolean|null/;

  _OPEN = {
    object: "{",
    array: "["
  };

  _CLOSE = {
    object: "}",
    array: "]"
  };

  //actions to execute in each iteration
  function action(key, value) {
    var type = $.type(value),
      prop = "";

    //key is not an array index
    if (typeof key !== "number") {
      prop = '"' + key + '":';
    }
    if (type === "string") {
      prop += '"' + value + '"';
    } else if (_PRIMITIVE.test(type)) {
      prop += value;
    } else if (type === "array" || type === "object") {
      prop += toJson(value, type);
    } else return;
    this.push(prop);
  }

  //iterates over an object or array
  function each(obj, callback, thisArg) {
    for (var key in obj) {
      if (obj instanceof Array) key = +key;
      callback.call(thisArg, key, obj[key]);
    }
  }

  //generates the json
  function toJson(obj, type) {
    var items = [];
    each(obj, action, items);
    return _OPEN[type] + items.join(",") + _CLOSE[type];
  }

  //exported function that generates the json
  return function stringify(obj) {
    if (!arguments.length) return "";
    var type = $.type(obj);
    if (_PRIMITIVE.test(type))
      return (obj === null ? type : obj.toString());
    //obj is array or object
    return toJson(obj, type);
  }
}(jQuery));

Użycie

var myObject = {
    "0": null,
    "total-items": 10,
    "undefined-prop": void(0),
    sorted: true,
    images: ["bg-menu.png", "bg-body.jpg", [1, 2]],
    position: { //nested object literal
        "x": 40,
        "y": 300,
        offset: [{ top: 23 }]
    },
    onChange: function() { return !0 },
    pattern: /^bg-.+\.(?:png|jpe?g)$/i
};

var json = jQuery.stringify(myObject);
console.log(json);

Tak, powinieneś JSON.stringify i JSON.parse your "Json_PostData" before calling $.ajax

   $.ajax({
            url:    post_http_site,  
            type: "POST",         
            data:   JSON.parse(JSON.stringify(Json_PostData)),       
            cache: false,
            error: function (xhr, ajaxOptions, thrownError) {
                alert(" write json item, Ajax error! " + xhr.status + " error =" + thrownError + " xhr.responseText = " + xhr.responseText );    
            },
            success: function (data) {
                alert("write json item, Ajax  OK");

            } 
    });

To w zasadzie 2-etapowy proces:

Po pierwsze, musisz przeciągnąć TAK

var JSON_VAR = JSON.stringify(OBJECT_NAME, null, 2); 

Następnie musisz przekonwertować łańcuch znaków na obiekt

var obj = JSON.parse(JSON_VAR);

Jedną z rzeczy, której powyższe rozwiązania nie biorą pod uwagę, jest to, że masz tablicę wejść, ale podano tylko jedną wartość.

Na przykład, jeśli zaplecze oczekuje szeregu ludzi, ale w tym konkretnym przypadku, masz do czynienia z jedną osobą. Wtedy robi:

<input type="hidden" name="People" value="Joe" />

Wtedy z poprzednimi rozwiązaniami, byłoby to po prostu mapować do czegoś takiego jak:

{
    "People" : "Joe"
}

Ale tak naprawdę powinno być

{
    "People" : [ "Joe" ]
}

Aby to naprawić, wejście powinno wyglądać like:

<input type="hidden" name="People[]" value="Joe" />

I użyłbyś następującej funkcji (bazującej na innych rozwiązaniach, ale nieco rozszerzonej)

$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
    if (this.name.substr(-2) == "[]"){
        this.name = this.name.substr(0, this.name.length - 2);
        o[this.name] = [];
    }

    if (o[this.name]) {
        if (!o[this.name].push) {
            o[this.name] = [o[this.name]];
        }
        o[this.name].push(this.value || '');
    } else {
        o[this.name] = this.value || '';
    }
});
return o;
};