从HTML表单发送两次AJAX调用

时间:2014-06-29 14:54:22

标签: jquery ajax

我有一个简单的HTML表单,它链接到一个jQuery函数,该函数将数据发送到PHP脚本。问题是ajax调用正在发送两次。当我看到2个相同的条目进入数据库时​​,我最初收到了警报。我切换到了firebug并且确定 - 发送了2个POST请求和2个相同的GET回调。我已经查看了堆栈的答案,并找到了一个看似相同的问题,但该答案建议在函数中使用bind和unbind而没有明确解释为什么问题存在。我认为隐藏的提交按钮可能是一个问题,但如果我评论这个 - 同样的问题。有许多风滚草问题与我的问题非常相似。任何帮助将不胜感激....

HTML表格

          <form action="" method="post">
                  <table>   
                        <tr> 
                            <td>                          
                                <img class="profile_picture_mail" src="../<?php echo grab_thread_thumbnail($id); ?>">
                            </td>
                            <td>  
                            <input id="message_subject" name="subject" type="text" 
                            placeholder="Message subject" size="20"  maxlength="3000" value=""/>
                            </td>
                        </tr>                        
                  </table>
                  <table>
                        <tr> 
                            <td>        
                            <textarea id="message_field" name="message" type="text" placeholder="Message details"></textarea>                               
                            </td>
                        </tr>      
                  </table>
                <input id="submit_message" type="button" name="submit" value="send message" />              
                <input id="profile_id" type="hidden" value="<?php echo $id;?>"/>           
           </form>

JQUERY

      $(document.body).on("click", "#submit_message", function(){
         var recipientId = $('#profile_id').val();
            $.ajax({
              url: '../ajax/insert_message.php',
              type: 'post',
              data: {
                 'subject': $('#message_subject').val(),
                 'message': $('#message_field').val(),
                 'recipientId': recipientId,
                   },
                  success: function(html) {

                         $('.reveal-modal-mail').load('message_box.php', {id: recipientId});
                         $('input[type="text"],text').val('');
                         $('input[type="text"],textarea').val('');
                          }
                    });
             return false;
              });

编辑:我将提交按钮的ID更改为id =&#34; submit_a_message&#34;问题解决了。我认为这意味着我有一个额外的提交按钮,在某个地方具有相同的ID,虽然在我的生活中我找不到它。如果我错误地假设为什么会这样,请告诉我。渴望深究这一点......

1 个答案:

答案 0 :(得分:2)

也许这可以解决您的问题:jQuery/Ajax request is being sent twice。他们说你可以试试

$("#submit_message").unbind('click').bind('click', function () { });