クロスドメインの読み取りJSONレスポンス

Question

 <script> 
     $.ajaxSetup({contentType: 'application/json'}); 
     function submit_data(f){ 
      alert('submitting') 
      var data_string = $(f).serialize(); 
      $.ajax({ 
       url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
       dataType: "jsonp", 
       type : 'post', 
       processData: false, 
       crossDomain: true, 
       contentType: "application/json", 
       jsonp: false, 
       jsonpcallback: result() 
      }); 
     } 

     function result(){ 
      alert('back in') 
      alert(data) 
     } 
     function jsonp1300279694167(){ 
      alert('dhoom') 
     } 
     </script> 

上記のスクリプトは、ドメイン内でクエリを実行し、フォーム内にデータを投稿しています。
すべてうまくいくようです。 JSONレスポンスは、Firebugコンソールに表示されます。私は応答を処理し、それに応じてステータスメッセージを表示したいと思います。私はそれをどのように達成すべきですか？

---

UPDATE

私はT.J.により示唆されるように試してみましたCrowderしかし、まだ運がありません。変更されたコードはdataと警告undefinedにアクセスしていない

function submit_data(f){ 
    alert('submitting') 
    var data_string = $(f).serialize(); 
    $.ajax({ 
      url: "http://localhost:3000/application/1/contact_us.json?"+data_string, 
      dataType: "jsonp", 
      crossDomain: true, 
      success: handleSuccess() 
     }); 
} 



function handleSuccess(data) { 
    alert("Call completed successfully"); 
    alert(data); 
} 

これ以下の通りです。 success: handleSuccess()からそれを渡そうとすると、エラーが発生し、httpリクエストでリダイレクトされます。

Ruby on Railsアプリケーションから応答があります。ここで私は

def create 
    errors = ContactUsForm.validate_fields(params) 
    logger.info errors.inspect 
    if errors.blank? 
     respond_to do |format| 
     format.json {render :json => {:status => 'success'}.to_json} 
     end 
    else 
     respond_to do |format| 
     format.json {render :json => {:status => 'failure', :errors => errors}.to_json} 
     end 
    end 
    end 

を打っています方法は、私はあなたが近くにいる私のレールのアプリで

Answer 1

を試みることができる場合、私は願っています私は上記の回答を含めて多くのチュートリアルを試してみましたが、運がなかったです。だから私は

<form action="" onsubmit="submit_data(this, '1'); return false;"> 
    // some form fields 
</form> 

フォームフォームcreate.js.erb

で

<script> 
    function submit_data(f, app_id){ 
    var data_string = $(f).serialize(); 
    $.ajax({ 
       url: "http://www.example.com/"+app_id+"/contact_us.js?"+data_string, 
       dataType: "jsonp", 
       crossDomain: true, 
      }); 
    } 

    function show_errors(jsonOb) 
    { 
     $("span.error").remove(); 
     $.each(jsonOb, function(key,val){ 
     $("#contact_us_form_"+key).after("<span class=error>"+val+"</span>") 
    }); 
    } 


</script> 

私のコントローラで

def create 
    @application = Application.find params[:application_code] 
    @errors = ContactUsForm.validate_fields(params, @application) 
    @application.save_contact_us_form(params[:contact_us_form]) if @errors.blank? 

    respond_to do |format| 
     format.js #{render :json => {:status => 'success'}.to_json} 
    end 
    end 

そして最後にする機能を提出することに

以下のようなものを実装しました

<% if @errors.blank? %> 
    window.location = "<%= @application.redirect_url %>" 
<% else %> 
    var errors = replaceAll('<%= escape_javascript(@errors.to_json)%>', "&quot;", "'") 
    var errors_json = eval('(' + errors + ')') 
    show_errors(errors_json); 
    function replaceAll(txt, replace, with_this) { 
    return txt.replace(new RegExp(replace, 'g'),with_this); 
    } 
<% end %> 

このように私はsubmit_formをフォームに送信して、show_errorsというJavaScript関数をサーバーから呼び出すことができます。そして、それは動作します.. これは最悪の解決策である場合でも私はコメントをしたいと思いますか？

Answer 2

を設定する必要があります任意のものがあります。また、あなたのコード

$.ajax({ 
    url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
    dataType: "jsonp", 
    type : 'post', 
    processData: false, 
    crossDomain: true, 
    contentType: "application/json", 
    jsonp: false, 
    success: function(data) { 
     // Use data here 
    } 
}); 

：あなたはいつものようにsuccessコールバック（ajaxのドキュメントを参照してください）、ない特別なものを使用し

jsonpresponse: result() 

を... コールはresult機能するであろうと、 ajax呼び出しのjsonpresponseプロパティの戻り値を使用します。あなたが別の関数を使用したい場合は、そう、それは大丈夫ですが、あなたは()が含まれていません。また

$.ajax({ 
    url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
    dataType: "jsonp", 
    type : 'post', 
    processData: false, 
    crossDomain: true, 
    contentType: "application/json", 
    jsonp: false, 
    success: result 
}); 

function result(data) { 
    // use `data` here 
} 

、私はあなたが使用している場合jsonpパラメータをしたい/あなたが必要としないかなり確信していますsuccessので、最後に

$.ajax({ 
    url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
    dataType: "jsonp", 
    type : 'post', 
    processData: false, 
    crossDomain: true, 
    contentType: "application/json", 
    success: result 
}); 

function result(data) { 
    // use `data` here 
} 

：あなたがcontentTypeを設定したいか？それは、というコンテンツがサーバから受信されたコンテンツではなく、に送信されたことに関連しています。 JSONでエンコードされたデータをサーバーに実際に投稿しているなら、大丈夫です。 jQueryのserialize関数を使用しているようですが、これはJSONを生成しません（URLエンコードされたデータ文字列を生成します）。したがって、電話とajaxSetupコールの両方から、contentTypeも削除することをお勧めします。

Answer 3

あなたはjQuery-JSONP
jQuery-JSONP How To

[例]

$.getJSON('server-url/Handler.ashx/?Callback=DocumentReadStatus', 
    { 
     userID: vuserID, 
     documentID: vdocumentID 
    }, 
    function(result) { 
     if (result.readStatus == '1') { 
      alert("ACCEPTED"); 
     } 
     else if (result.readStatus == '0') { 
      alert("NOT ACCEPTED"); 
     } 
     else { 
      alert(result.readStatus); 
     } 
    });