0

AJAX 要求を使用して jQuery によって入力されるリモート フォームがあります。次に、このフォームを AJAX コールバックにバインドしていますが、コールバックがトリガーされていません。

var msgSuccess=function(evt, data, status, xhr){
  alert('ok!!!');
  console.log(evt);
  console.log(data);
  console.log(status);
  console.log(xhr);
}

var bindMsg = function() {   // BIND IT TO THE CALLBACKS
  $("#composeMsgPopup")
  .live('ajax:beforeSend', loadingCallback)
  .live('ajax:success', msgSuccess)
  .live('ajax:error', failureCallback)
  .live('ajax:complete',completeCallback);
}

$.ajax({      // GETTING THE FORM CODE
  url: link,
  type: "get",
  success: function(response, textStatus, jqXHR) {
    ans=response;
    $("#popup_content").html(ans);
    $("#popup").bPopup();
    bindMsg();
  },
  error: function(jqXHR, textStatus, errorThrown) {
    failureCallback(errorThrown, textStatus, jqXHR);
  },
  complete: function(jqXHR, textStatus) {
    completeCallback("", jqXHR, textStatus);
  },
  beforeSend: loadingCallback
});

フォームのコード:

<%= form_for(:conversation, :remote => true, 
 :url=> {:controller=>:conversations,:action=>:create},
 :html=>{:id => 'composeMsgPopup' }) do |f| %>
<div id="founder-name" class="field"><b>Recipient: <%= @user.name %></b></div>
<div class="field">
  <%= f.label :subject,"Subject" %>
  <%= f.text_field :subject,:class=>"composeMsgField" %>
</div>
<div class="field">
  <%= f.label :content,"Message Content" %>
  <%= f.text_area :content,:class=>"composeMsgField" %>
</div>
<%= f.hidden_field :to_user, :value => @user.id  %>
<%= f.submit "Send", :class=>"submitbt",:id=>'sendMessage' %>
<% end % >

bind() または on() でバインドしようとしましたが、うまくいきません。コードは実行されますが、フォームを送信してもコールバックは実行されません。

4

1 に答える 1

1

わかりました私は解決策を見つけました。リモートフォームが不明な理由でコールバックをトリガーしないため、送信ボタンの動作を変更しました。

     <%= f.button :submit, "Update",:class=>"submitbt",:id=>"submitnewpass",:onclick=>"return false;" %>

ボタンをバインドしてフォームを手動で送信します

 var action=$('#composeMsgPopup')[0].action;   // action url
$("#sendMessage").click(function() {         // bind submit button

    $.ajax({
        type: "POST",
        url: action,
        data: $("#submitnewpass").serialize(), // serializes the form's elements.
        success: function(data)
        {
           // do my stuff

        },
        error:      failureCallback,
        beforeSend: loadingCallback,
        complete:   completeCallback
    });

    return false;
});
于 2012-11-27T10:22:07.593 に答える