jQuery ajaxForm dönen .json dosyası

Question

Ajax üzerinden JSON'u iade ettiğim raylarda bir model oluşturma formum var. Kodum şimdiye kadar benziyor:

$('#new_stem').ajaxForm({ //#new_stem is my form 
    dataType: 'json', 
    success: formSuccess 
}); 

function formSuccess(stemObj) { 
    //does stuff with stemObj 
} 

Ve ben bir dosya yükleyen kişiyle çok bölümlü bir form var (ama bunun alakalı olup olmadığından emin değilim).

Formu gönderdiğimde iyi çalışıyor (modellerim düzgün bir şekilde oluşturuluyor ve json olarak üretiliyor), ancak formSuccess işlevi tarafından ele alınan json yerine, "stems.json" için bir indirme işlemi başlatılıyor (yol Firefox'taki kök oluşturma eylemime.

Bunun olmasına ne sebep oldu ve ne çözebilirdi? Sorunun bir parçası olup olmadığından emin değilim, ancak formumda bir gönder düğmesi bulunmadığından, $ ('# new_stem) .submit()

' u çağıran bir tıklama işleyicisiyle bir bağlantım var. Teşekkürler çocuklar!

DÜZENLEME:

Etag  "b53e5247e7719cf6b1840e2c6e68781c" 
Connection  Keep-Alive 
Content-Type application/json; charset=utf-8 
Date  Mon, 03 May 2010 02:19:31 GMT 
Server  WEBrick/1.3.1 (Ruby/1.8.7/2010-01-10) 
X-Runtime  241570 
Content-Length 265 
Cache-Control private, max-age=0, must-revalidate 

artı

Answer 1

Çözmeyi hedeflediğim tam olarak olmasa da, ihtiyaçlarıma göre biraz farklı bir çözüm bulmayı başardım!

ajax dosya yüklemeleri iframe'ler üzerinden yapıldığı için, iframe .json dosyasını yükledikten sonra Firefox tarafından bir indirme işlemi olarak yorumlanmış ve bir indirme istemi açılmıştır. Bunu önlemek için bazı sunucu ayarlarıyla oynayabildiğime eminim, ama zaten buna yeterince zaman ayırdım.

Öyleyse yaptığım çıktıyı json yerine metin olarak verilmişti, çünkü sadece bir kimlik numarası için gerçekten avlanıyordum. Kodum şimdi benziyor:

$(document).ready(function() { 
    $('#continue-upload').click(function() { 
    $('#new_stem').ajaxSubmit({ 
     dataType: 'text', //'json', 
     success: formSuccess 
    }); 
    }); 
}); 

Ben de ön etiketleri sarılı, bu yüzden de benim sonuçlar işlevinde bu kapalı şerit için gerekli geldi gerekli kimlik numarası.

Şimdi bunu yapmak istediğim buydu woo!

Answer 2

onun Content-Type yanıt başlığını yanlış ve böylece tarayıcı ne bilmiyor sanki gibi geliyor bir çerez başlığındaki: Kundakçı beni başlığı söyler aşağıdakileri içerir onunla yap. application/json olmalıdır. Gerçek yanıt başlıklarını saptamak için Firebug'un Net panelini kullanabilirsiniz.

Answer 3

submit olayının varsayılan işlemini mi yapıyorsunuz? Formun gerçekte sunulması gibi görünüyor (klasik anlamda – şeklinde, Firefox aslında formun action sayfasında belirtilen sayfaya gidiyor).

Answer 4

Bu plugin, ajax kullanarak MultiPart Formları göndermenize izin verecektir.

Ajax'ın 'başarılı:' seçeneğini kullanmak istiyorsanız, formu ajax kullanarak göndermeniz gerekir. Şu anda temel olarak sadece formu geleneksel şekilde gönderen submit() işlevini kullanıyorsunuz. Json verilerini indirilmiş bir dosya olarak veya tarayıcılarınızda görebilmeniz, bunun gerçekleştiği anlamına gelir.

O eklenti kullanmak gerekir - eklenti sayesinde

(eğer çok parçalı işlevi gerekir, aksi takdirde sadece düzenli Ajax işlevini kullanın), bu gibi kullanabilirsiniz olacaktır:

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


$.ajaxFileUpload(
    { 
    url:serverurl, 
    secureuri:false, 
    fileElementId:elementId, 
    dataType: 'json', 
    success: function (data, status) 
    { 
    /* show success message */ 
    }, 
    error: function (data, status, e) 
    { 
    /* handle error */ 
    } 
}); 

}); 

Eğer Dosya yüklemesi olmadan yapmak istiyorum, bunu yapmak için daha kolay bir yol var.

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

$.post('YOUR_URL', $("#FormName").serialize(), function(data){ 
    alert(data.name); // John 
    }, "json"); //specify return data is going to be json 


    }); 

Answer 5

Belki

$('#cpFileUpload').ajaxForm({ 
     dataType: 'html',   
     success: function(data) {   
      eval(data);     
      if (data.result == false) { 
       alert('error on server side'); 
      } else {     
       // do what you want 
      } 
     }  
    }); 

yardımcı Ve sunucu tarafında çıkış bu (sadece bu çıkış veya vücut etiketi içinde herhangi bir başka metin olmadan) gibi

var data = {result: true, html: 'ok'} 

kadar güzel değil olması gerekir, ancak çalışma

Answer 6

Tarayıcınızın .json dosya kümesini indirmesini önlemek için İçerik türü üstbilgisini "text/html" olarak değiştirin.

PHP:

header("Content-type: text/html"); 

ASP.NET MVC:

$(".addform").ajaxSubmit({ 
      url: "file.php", 
      type: "POST", 
      dataType: "text", 
      iframe: true, 
      success: function (text) { 
       var data = $.parseJSON(text); 
      }, 
      error: function (xmlRequest, textStatus, errorThrown) { 
       alert(errorThrown); 
      } 
     }); 

İşleri mükemmel: Bu gibi metin sonucunu ayrıştırmak gerekir javascript olarak

return Json(obj, "text/html"); 

.

Answer 7

Aslında bu eklentinin ajaxSubmit kodu biraz rahatsız. AjaxSubmit çalışmasını (yazma sırasında) yapmak için sunucunuzun JSON verilerini content-type = text/html olarak döndürmesi gerekir. Eklenti otomatik olarak < \ pre> etiketlerini vb. Sanırım jsonları geri çekebilmek için gizli iframe almayı denedikleri zaman json'a bir metin yazmaya ve iframe'den ayrılmaya karar verdiler.