7

我想要做的是当用户点击论坛中的提交按钮时,它应该将收集到的数据发送到 php 脚本,理想情况下,保持在同一页面上。目前,我在表单中(我在表单中有其他标签,但这是我需要关注的两件事)

<form name = "reply" id="replyForm" action="sqlinserter.php" method = "POST">
<button id = "newThread" class="btn btn-primary" type="submit">Submit</button>

如您所见,我使用了一个表单,当用户单击提交按钮时,该表单将数据发送到 sqlinserter.php。基本形式的东西。现在,当它单击提交时,它会转到实际的 sqlinsert.php 页面,该页面是空白的,因为它只是将数据发送到数据库。

但是,我想创建一个简单的 jquery 脚本,您可以在其中单击它使用 ajax 发送数据的按钮。我一直注意到 twitter bootstrap 与按钮的工作方式不同,我不确定如何将他们的按钮与 jquery 一起使用。对此的任何帮助都会很棒。

所以,

  1. 我需要弄清楚如何在 jquery 中使用 twitter 引导按钮。具体来说,我需要弄清楚如何使用提交按钮。
  2. 如何使用ajax发送数据?
4

3 回答 3

11
  1. 我需要弄清楚如何在 jquery 中使用 twitter 引导按钮。具体来说,我需要弄清楚如何使用提交按钮。

Bootstrap 可以和 jQuery 一起使用,不需要额外的步骤。实际上,甚至 bootstrap 本身也在其框架中使用 jQuery。

您仍然可以像往常一样使用 jQuery,并像往常一样使用引导程序。两者都可以工作,没有任何冲突。

  1. 如何使用ajax发送数据?

它可以通过使用 jQuery AJAX 函数之一来完成,例如$.ajax.

click只需在您的按钮上添加新事件 , #newThread。在事件处理程序中编写 AJAX。基于您的代码的示例如下所示。

HTML

<form name = "reply" id="replyForm" action="sqlinserter.php" method = "POST">
    <button id = "newThread" class="btn btn-primary" type="submit">Submit</button>
</form>

JS

$(function() {
    $('#newThread').on('click', function (e) {
        e.preventDefault(); // disable the default form submit event

        var $form = $('#replyForm');

        $.ajax({
            url: $form.attr("action"),
            type: $form.attr("method"),
            data: $form.serialize(),
            success: function (response) {
                alert('response received');
                // ajax success callback
            },
            error: function (response) {
                alert('ajax failed');
                // ajax error callback
            },
        });
    });
});
于 2013-03-21T01:59:47.007 回答
2

没有任何特定方法可以使用 twitter 引导按钮。只需获取此提交的 id 并通过 ajax 提交数据,如下所示:

$.ajax({
            type:'GET',
            dataType:'xml',
            url:'path/to/phpfile.php',
            success:function(data) {
                // Do the handling here
            },
            error:function() {
                alert("Sorry, Ajax call Failed");  
            }
        });
于 2013-03-21T01:42:01.850 回答
0

使用引导程序提交表单没有什么特别的。您只需要确保按钮在表单中(即使它不是引导程序,您也应该想要它)。

<form name = "reply" id="replyForm" action="sqlinserter.php" method = "POST">
<button id = "newThread" class="btn btn-primary" type="submit">Submit</button>
</form> 

你错过了结束</form>标签

于 2013-03-21T01:55:21.820 回答