jQuery .submit().ajax()必须单击两次发送按钮才能获得正确的响应

丹·列维·特姆塔

我有一个包含5个字段的表单,该表单是通过AJAX发送到PHP脚本的,该脚本执行一些简单的验证并返回一个字符串。

我已经为实际提交做了一些jQuery脚本,当我尝试发送表单时,我必须单击两次send按钮。

更新:转到实时站点的网址:http ://www.dan-levi.no/new/#!/ Kontakt

这是一些代码:

的HTML

<form id="contact_form" class="form-horizontal" action"includes/contact.php" method"post">
            <div class="control-group">
                <label class="control-label" for="contact_name">Ditt navn og evt. bedrift</label>
                <div class="controls">
                    <input type="text" class="input-large" id="contact_name" name="contact_name" placeholder="Ditt navn og evt. bedrift" />
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="contact_email">E-post</label>
                <div class="controls">
                    <input type="email" class="input-large" id="contact_email" name="contact_email" placeholder="E-post" />
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="contact_tel">Telefon</label>
                <div class="controls">
                    <input type="tel" class="input-large" id="tel" name="contact_tel" placeholder="Telefon" />
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="contact_subject">Emne</label>
                <div class="controls">
                    <input type="text" class="input-large" id="subject" name="contact_subject" placeholder="Emne for melding" />
                </div>
            </div>

            <div class="control-group">
                <label class="control-label" for="contact_desc">Din beskjed</label>
                <div class="controls">
                    <textarea rows="10" class="input-large" id="contact_desc" name="contact_desc" placeholder="Din beskjed"></textarea>
                </div>
            </div>
            <div class="text-error pull-right" id="error_message"></div><br>
            <input class="btn btn-large pull-right" type="submit" name="" value="Send" /><br>
</form>

Java脚本

$(document).ready(function() {
    $('#contact_form').submit(function(e) {
        data = $('#contact_form').serialize();
        $.ajax({
            url: 'includes/contact.php',
            type: 'POST',
            data: data,
        })
        .done(function(response) {
            if (response == 'empty') {
                $('#error_message').text('Noen av feltene er tomme.')
            } else {
                $('.message').html(response);
                $('#contact_form').fadeOut('400');
                $('#info_line').fadeIn('400').text('Takk for din henvendelse');
            };  
        })        
        e.preventDefault();
    });
});

的PHP

$contact_name = $_POST['contact_name'];
$contact_email = $_POST['contact_email'];
$contact_tel = $_POST['contact_tel'];
$contact_subject = $_POST['contact_subject'];
$contact_desc = $_POST['contact_desc'];

if ($contact_name == '' || $contact_email == '' || $contact_tel == '' || $contact_subject == '' || $contact_desc == '') {
    echo "empty";
    die();
}
echo $contact_name.'<br><br>';
echo $contact_email.'<br><br>';
echo $contact_tel.'<br><br>';
echo $contact_subject.'<br><br>';
echo $contact_desc.'<br><br>';

我无法找出为什么我必须两次单击按钮,我尝试了一些反复试验,请阅读论坛中的答案。我试图序列化表单外地的提交功能,我只是不能让它表现出我想要的方式。非常感谢所有帮助。

哦,值得一提。实际的响应是,我第一次单击时该字段为空(php验证),但第二次按应有的方式工作。

贾斯汀

使用常规输入按钮而不是提交按钮进行ajax调用。

$("#button").click(function () { ... ajax ... }

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用Jquery延迟Submit按钮的单击

来自分类Dev

使用Jquery延迟Submit按钮的单击

来自分类Dev

Rails-jQuery为什么我必须单击两次才能显示jQuery效果?

来自分类Dev

Rails-jQuery为什么我必须单击两次才能显示jQuery效果?

来自分类Dev

Safari无法读取JQuery表单Submit上的Submit按钮值

来自分类Dev

带有onclick的jquery链接标签href需要两次单击才能加载ajax

来自分类Dev

我必须在jquery按钮上单击两次以提交注册表格

来自分类Dev

jQuery .submit()不触发

来自分类Dev

jQuery Submit()未触发

来自分类Dev

jQuery .submit()错误

来自分类Dev

通过JQuery.submit()发送的TYPO3表单

来自分类Dev

jQuery的submit方法忽略GET发送的POST。为什么?

来自分类Dev

通过JQuery.submit()发送的TYPO3表单

来自分类Dev

jQuery UI取消按钮需要单击两次以关闭

来自分类Dev

jQuery移动按钮单击处理程序触发两次?

来自分类Dev

jQuery移动按钮单击处理程序触发两次?

来自分类Dev

按钮单击在模态jQuery上执行两次

来自分类Dev

jQuery .submit不会被第一次调用

来自分类Dev

添加.submit(function(){}后,JQuery Ajax停止工作

来自分类Dev

javascript中的.submit与jQuery中的.submit

来自分类Dev

jQuery Ajax表单仅在单击两次后提交

来自分类Dev

在按钮单击上设置隐藏变量的值,然后使用.submit()jquery struts提交表单

来自分类Dev

如何使用jQuery监听类型为Submit的按钮上的单击事件?

来自分类Dev

为什么HTML表单无法使用JQuery发送带有名称=“ submit”和类型=“ submit”的信息

来自分类Dev

jQuery Validation - prevent submit on remote

来自分类Dev

jQuery Submit()无法正常工作

来自分类Dev

必须单击两次按钮才能触发c ++

来自分类Dev

jQuery单击触发两次

来自分类Dev

jQuery单击两次重复

Related 相关文章

  1. 1

    使用Jquery延迟Submit按钮的单击

  2. 2

    使用Jquery延迟Submit按钮的单击

  3. 3

    Rails-jQuery为什么我必须单击两次才能显示jQuery效果?

  4. 4

    Rails-jQuery为什么我必须单击两次才能显示jQuery效果?

  5. 5

    Safari无法读取JQuery表单Submit上的Submit按钮值

  6. 6

    带有onclick的jquery链接标签href需要两次单击才能加载ajax

  7. 7

    我必须在jquery按钮上单击两次以提交注册表格

  8. 8

    jQuery .submit()不触发

  9. 9

    jQuery Submit()未触发

  10. 10

    jQuery .submit()错误

  11. 11

    通过JQuery.submit()发送的TYPO3表单

  12. 12

    jQuery的submit方法忽略GET发送的POST。为什么?

  13. 13

    通过JQuery.submit()发送的TYPO3表单

  14. 14

    jQuery UI取消按钮需要单击两次以关闭

  15. 15

    jQuery移动按钮单击处理程序触发两次?

  16. 16

    jQuery移动按钮单击处理程序触发两次?

  17. 17

    按钮单击在模态jQuery上执行两次

  18. 18

    jQuery .submit不会被第一次调用

  19. 19

    添加.submit(function(){}后,JQuery Ajax停止工作

  20. 20

    javascript中的.submit与jQuery中的.submit

  21. 21

    jQuery Ajax表单仅在单击两次后提交

  22. 22

    在按钮单击上设置隐藏变量的值,然后使用.submit()jquery struts提交表单

  23. 23

    如何使用jQuery监听类型为Submit的按钮上的单击事件?

  24. 24

    为什么HTML表单无法使用JQuery发送带有名称=“ submit”和类型=“ submit”的信息

  25. 25

    jQuery Validation - prevent submit on remote

  26. 26

    jQuery Submit()无法正常工作

  27. 27

    必须单击两次按钮才能触发c ++

  28. 28

    jQuery单击触发两次

  29. 29

    jQuery单击两次重复

热门标签

归档