codeigniter ajax表单提交答案

【问题标题】：codeigniter ajax form submitcodeigniter ajax表单提交
【发布时间】：2012-05-01 22:07:02
【问题描述】：

我有一个表单（通过 codeigniter 制作），我想用 ajax onClick 提交。表单提交没有 Ajax，不让我做event.preventDefault();

jQuery 文件

$('#register_submit').click(function(e){//
   e.preventDefault();
    var first_name = $('#register_form1').val();


    $.ajax({
        type: "POST", 
        async: false, 
        url: base_url+"register/registration_val",   
        data: "register_first_name="+first_name,
        success: function(data){
            $('#inferiz').html(data);
        },
        error: function(){alert('error');}
    }); 

});

// 控制器工作正常。名称寄存器，我发布到的函数是registration_val

HTML 文件

 <form method="POST" action='<?php echo site_url('/register/registration_val'); ?>' id='register_form' >
   <input type="login" name="register_first_name" id="register_form1">
   <input type='submit' value="Register" id='register_submit'>
 </form>

问题是，当我单击 SUBMIT 按钮时，jQuery 不执行它的工作，而是将自己提交给控制器并发出错误消息。
我无法阻止表单提交（我认为这可以解决问题），Click 事件被完全忽略。提前致谢

【问题讨论】：

表单是否存在于 DOM 上？你把你的代码放在DOM ready event里面了吗？
您的控制台没有抛出任何错误？如果这不是页面上唯一的 jquery，则可能是其他一些脚本损坏了，只是停止了该脚本的运行。
是的，我有document.ready(function(){ });。除了点击表单提交之外，一切都适用于 js 文件

标签： jquery ajax codeigniter form-submit preventdefault

【解决方案1】：

通过submit 活动而不是click 试试运气：

$('form').submit(function(e){//
   e.preventDefault();
    var first_name = $('#register_form1').val();


    $.ajax({
        type: "POST", 
        async: false, 
        url: base_url+"register/registration_val",   
        data: "register_first_name="+first_name,
        success: function(data){
            $('#inferiz').html(data);
        },
        error: function(){alert('error');}
    });     
});

如果 from 有 id，则将 'form' 替换为 '#{formId}'。

注意事项：

代码应位于 DOM 就绪事件回调中。
如果表单在 DOM 就绪时不存在，则应使用委托事件。

像这样：

$('body').on('submit', 'form', function(e){
   e.preventDefault();
    var first_name = $('#register_form1').val();    

    $.ajax({
        type: "POST", 
        async: false, 
        url: base_url+"register/registration_val",   
        data: "register_first_name="+first_name,
        success: function(data){
            $('#inferiz').html(data);
        },
        error: function(){alert('error');}
    });     
});

只需将body 替换为更接近的static 元素（如果有的话）即可提高性能。

祝你好运！

【讨论】：

绑定 on('submit' 有效，谢谢！顺便说一句，当我有 document.ready(funciton(){ }) 时，为什么你认为它不能只使用 $(form).submit ？或者这不是一回事，我承认了吗？
@SemurNabiev。我会给你一个阅读作业，如果不清楚再问，我会尽力提供帮助。 jquery on。阅读直接和委托事件段落。祝你好运！

【解决方案2】：

如果您将return false; 放在点击事件的末尾，它不应该将您的表单提交给控制器..

【讨论】：