Bagaimana cara menggunakan getJSON, mengirim data dengan metode posting?

107

Saya menggunakan metode di atas & bekerja dengan baik dengan satu parameter di URL.

misalnya di Students/getstud/1mana format pengontrol / tindakan / parameter diterapkan.

Sekarang saya memiliki tindakan di pengontrol Siswa yang menerima dua parameter dan mengembalikan objek JSON.

Lalu bagaimana cara memposting data dengan $.getJSON()menggunakan metode post?

Metode serupa juga dapat diterima.

Intinya adalah memanggil tindakan pengontrol dengan AJAX.

Vikas
sumber
4
getdalam getJSONarti gunakan GET untuk mendapatkan beberapa json.
Majid Fouladpour
1
@Majid Fouladpour Ketika saya menanyakan pertanyaan ini, saya tidak tahu itu ..!
Vikas

Jawaban:

216

Metode $ .getJSON () melakukan HTTP GET dan bukan POST. Anda perlu menggunakan $ .post ()

$.post(url, dataToBeSent, function(data, textStatus) {
  //data contains the JSON object
  //textStatus contains the status: success, error, etc
}, "json");

Dalam panggilan itu, dataToBeSentbisa apa saja yang Anda inginkan, meskipun jika mengirim isi dari bentuk html, Anda dapat menggunakan metode serialize untuk membuat data untuk POST dari formulir Anda.

var dataToBeSent = $("form").serialize();
Erv Walter
sumber
7
Hanya ingin menambahkan bahwa $ .getJSON mendukung Jsonp (akses lintas domain) sayangnya $ .post tidak.
Tomas
2
Sebenarnya .getJSON () mendukung akses lintas domain dengan dua cara. JSONP, yang tidak menggunakan GET atau POST tetapi injeksi skrip; tetapi juga CORS - dan .post () juga mendukung CORS. Namun CORS membutuhkan server juga mendukungnya sedangkan JSONP tidak.
hippietrail
2
Tidak benar, JSONP juga membutuhkan dukungan server untuk mengurai parameter callback.
Shrulik
Ketika saya menggunakan fungsi di atas, saya menerima objek string, bukan objek json.
Pratik Singhal
13

Ini adalah solusi "satu baris" saya:

$.postJSON = function(url, data, func) { $.post(url+(url.indexOf("?") == -1 ? "?" : "&")+"callback=?", data, func, "json"); }

Untuk menggunakan jsonp, dan metode POST, fungsi ini menambahkan parameter GET "callback" ke URL. Inilah cara menggunakannya:

$.postJSON("http://example.com/json.php",{ id : 287 }, function (data) {
   console.log(data.name);
});

Server harus siap untuk menangani parameter GET callback dan mengembalikan string json sebagai:

jsonp000000 ({"name":"John", "age": 25});

di mana "jsonp000000" adalah nilai GET panggilan balik.

Dalam PHP implementasinya akan seperti ini:

print_r($_GET['callback']."(".json_encode($myarr).");");

Saya melakukan beberapa pengujian lintas-domain dan tampaknya berhasil. Masih perlu lebih banyak pengujian.

lepe
sumber
1
Ini tidak akan pernah melewati batas yang dimiliki GET sementara ukuran maksimum POST dapat didefinisikan ulang.
Demensik
Mengapa Anda menambahkan ?callback? di url? Itu membuat panggilan balik tidak dipanggil untukku. Saya juga menambahkan JSON.stringify(data). +1, postingan bermanfaat!
Ionică Bizău
@ IonicăBizău: terima kasih. Untuk mengembalikan objek, kita perlu menambahkan parameter "callback" ke URL dan server perlu mengembalikan nama objek yang sama yang dihasilkan oleh JQuery. Saya juga menggunakan fungsi override untuk getJSON ():jQuery.getJSON = function(url, data, func) { return $.get(url+(url.indexOf("?") == -1 ? "?" : "&")+"callback=?", data, func, "json"); }
lepe
7

Cukup tambahkan baris ini ke Anda <script>(di suatu tempat setelah jQuery dimuat tetapi sebelum memposting apa pun):

$.postJSON = function(url, data, func)
{
    $.post(url, data, func, 'json');
}

Ganti (beberapa / semua) $.getJSONdengan $.postJSONdan nikmatilah!

Anda dapat menggunakan fungsi panggilan balik Javascript yang sama seperti dengan $.getJSON. Tidak diperlukan perubahan sisi server. (Yah, saya selalu merekomendasikan penggunaan $_REQUESTdi PHP. Http://php.net/manual/en/reserved.variables.request.php , Di antara $ _REQUEST, $ _GET dan $ _POST mana yang tercepat? )

Ini lebih sederhana dari solusi @ lepe.

Lerin Sonberg
sumber
Ini tidak berfungsi dengan metode done () dan fail () yang biasanya dapat Anda terapkan ke getJSON.
HackWeight
3

Saya memiliki kode yang melakukan getJSON. Saya hanya menggantinya dengan pos. Yang mengejutkan saya, itu berhasil

   $.post("@Url.Action("Command")", { id: id, xml: xml })
      .done(function (response) {
           // stuff
        })
        .fail(function (jqxhr, textStatus, error) {
           // stuff
        });



    [HttpPost]
    public JsonResult Command(int id, string xml)
    {
          // stuff
    } 
Stan Bashtavenko
sumber
3

Saya baru saja menggunakan posting dan jika:

data = getDataObjectByForm(form);
var jqxhr = $.post(url, data, function(){}, 'json')
    .done(function (response) {
        if (response instanceof Object)
            var json = response;
        else
            var json = $.parseJSON(response);
        // console.log(response);
        // console.log(json);
        jsonToDom(json);
        if (json.reload != undefined && json.reload)
            location.reload();
        $("body").delay(1000).css("cursor", "default");
    })
    .fail(function (jqxhr, textStatus, error) {
        var err = textStatus + ", " + error;
        console.log("Request Failed: " + err);
        alert("Fehler!");
    });
Software Fusca
sumber
1

$.getJSON()sangat berguna untuk mengirim permintaan AJAX dan mendapatkan kembali data JSON sebagai tanggapan. Sayangnya, dokumentasi jQuery tidak memiliki fungsi saudara yang harus dinamai $.postJSON(). Mengapa tidak menggunakan $.getJSON()dan menyelesaikannya saja? Nah, mungkin Anda ingin mengirim data dalam jumlah besar atau, dalam kasus saya, IE7 hanya tidak ingin berfungsi dengan baik dengan permintaan GET.

Memang benar, saat ini tidak ada $.postJSON()metode, tetapi Anda dapat mencapai hal yang sama dengan menentukan parameter keempat (tipe) dalam $.post()fungsi:

Kode saya terlihat seperti ini:

$.post('script.php', data, function(response) {
  // Do something with the request
}, 'json');
Tony
sumber
-8

jika Anda hanya memiliki dua parameter, Anda dapat melakukan ini:

$.getJSON('/url-you-are-posting-to',data,function(result){

    //do something useful with returned result//
    result.variable-in-result;
});
mikrofon
sumber
5
Saya pikir ini bukan jawaban atas apa yang telah ditanyakan.
Harmeet Singh