我希望能够远程提交表单(因此页面不刷新),然后执行一些javascript代码。这是我到目前为止所得到的
<script>
$(function() {
// Subscribe to receive messages!
var client = new Faye.Client('http://localhost:9292/faye');
// Our own private channel
var private_subscription = client.subscribe('<%=request.path + @id1.to_s + @id2.to_s%>',
function(data) {
$('<p></p>').html(data.username + ": " + data.msg).appendTo('#chat_room');
});
// Handle form submission to publish messages.
$('#new_message').submit(function(){ // THIS LINE GIVING TROUBLE
client.publish('<%=request.path + @id1.to_s + @id2.to_s%>', {
username: '<%= @user.fname+' '+@user.lname%>',
msg: $('#message_message').val()
});
// Clear the message box
$('#message_message').val('');
return false;
});
});
</script>
<div class="chat_container">
<div id="chat_room">
<p>Chat with <%= @other.fname+' '+@other.lname%> </p>
</div>
<%= simple_form_for Message.new, :id => "new_message",:controller => "messages", :action => "create", :remote => true do |f| %>
<%= f.text_field :message, :autocomplete => "off" %>
<%= f.hidden_field :sender_id, :value => @user.user_id %>
<%= f.hidden_field :receiver, :value => @other.user_id %>
<%= f.hidden_field :sent_at, :value => Time.now %>
<%= f.submit "Send", class: "btn btn-medium btn-primary" %>
<% end %>
</div>
如果我将我的javascript函数“#new_message”的名称更改为,则该表单会正确提交到我的数据库中,但我会丢失聊天室功能。 (通过FAYE向该聊天室中的所有客户端发送消息并清除text_box的代码将不会被调用。)
如果我保留我的javascript函数“#new_message”的名称,该消息将被传输到聊天室中的所有客户端,文本框将被清除,但什么都不会存储到我的数据库中。
我能做些什么才能完成数据存储和聊天室功能?
编辑:尝试这无济于事
$('#new_message').bind('ajax:success', function() {
client.publish('<%=request.path + @id1.to_s + @id2.to_s%>', {
username: '<%= @user.fname+' '+@user.lname%>',
msg: $('#message_message').val()
});
// Clear the message box
$('#message_message').val('');
return false;
});
});
答案 0 :(得分:2)
我认为你只需要挂钩表单提交的一个ajax回调:
$("#new_message").bind("ajax:success", function(evt, data, status, xhr) {
// Your client code and message clearing code
});