笨的Ajax表单提交

Question

我使用笨，和jQuery的Forrm插件：http://malsup.com/jquery/form/

我有一个问题得到一个表格才能正常工作。

查看

<div class="row"> 
    <div class="well col-sm-5 col-sm-offset-3"> 
     <h2><span class="fa fa-key"></span>&nbsp;&nbsp;Please login below</h2> 
     <form class="form-horizontal" id="LoginForm" role="form" method="post" action="/login_controller/process" onsubmit="PostFormRedirect('#LoginForm', '#RetMsg', '/');return false;"> 
      <div class="row small-pad"> 
       <div class="input-group"> 
        <span class="input-group-addon"><i class="fa fa-inbox" style="max-width:20px;min-width:20px;"></i></span> 
        <input type="email" class="form-control" id="UserName" name="UserName" placeholder="Email" /> 
       </div> 
      </div> 
      <div class="row small-pad"> 
       <div class="input-group"> 
        <span class="input-group-addon"><i class="fa fa-key" style="max-width:20px;min-width:20px;"></i></span> 
        <input type="password" class="form-control" id="UserPass" name="UserPass" placeholder="Password" /> 
       </div> 
      </div> 
      <div class="row small-pad"> 
       <button type="submit" class="btn btn-primary pull-right"><span class="fa fa-sign-in"></span>&nbsp;&nbsp;Sign in</button> 
      </div> 
      <div class="row small-pad center-text"> 
       <a href="/forgot" class="is-ajax-inner" data-where="#RetMsg">Forgot My Password</a> 
      </div> 
     </form> 
     <div id="RetMsg"></div> 
    </div> 
</div> 

控制器

class Login_controller extends CI_Controller { 

    public function __construct(){ 
     $this->load->database(); 
     var_dump('loaded'); 
     exit; 
    } 

    public function process(){ 
     $this->load->model('login_model'); 
     $this->login_model->process(); 
    } 

} 

型号

class Login_model extends CI_Model { 

    function process(){ 
     var_dump('YEP'); 
     exit; 
    } 

} 

PostFormRedirect功能

function PostFormRedirect(FormID, Target, Location){ 
    try{ 
     $subButton = jQuery('[type="submit"]'); 
     var options = { 
      target: Target, 
      beforeSubmit: function() { 
       $subButton.attr('disabled', 'disabled'); 
       jQuery(Target).html('<div class="pageLoader">Loading...<br /><img src="/assets/images/ajax-loader.gif" alt="loading..." height="11" width="16" /></div>'); 
       jQuery(Target).slideDown('fast'); 
      }, 
      success: function (html) { 
       setTimeout(function() { 
             var $t = Math.round(new Date().getTime()/1000); 
             jQuery(Target).html(html); 
             jQuery(Target).slideUp('fast'); 
             if(typeof(Location) !== 'undefined'){ 
              window.location.href = Location + '?_=' + $t; 
             } 
            }, 3000); 
      }, 
      error: function(e){ 
       var $html = e.responseText; 
       jQuery(Target).html($html); 
       jQuery(Target).slideDown('fast'); 
       if(jQuery('#captcha-gen').length){ 
        var $t = Math.round(new Date().getTime()/1000); 
        jQuery.get('/inc/captcha.php?_=' + $t, function(data){ 
         jQuery('#captcha-gen').html(data); 
        }); 
       } 
       $subButton.removeAttr('disabled'); 
      } 
     }; 
     jQuery(FormID).ajaxSubmit(options); 
    }catch(err){ 
     alert(err.message); 
    } 
} 

的.htaccess

# The Friendly URLs part - for normal pages 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteRule ^(.*)$ index.php/$1 [L,QSA,NC] 

的config/routes.php文件

$route['default_controller'] = 'pages/view'; 
$route['(:any)'] = 'pages/view/$1'; 
$route['404_override'] = ''; 

什么是happenning是，现在，RetMsg正显示出我一个404错误......我什么时候才能摆脱404错误的， RetMsg再次向我显示登录表单。

我在做什么错？我期望它给我看var_dump('YEP');

Answer 1

尝试通过URL（手动）调用您的控制器，如果它的工作没有与routes.php发布。

---

请关注并采取在这部分代码...action="/login_controller/process" onsubmit="PostFormRedirect('#LoginForm', '#RetMsg', '/');...

尝试编辑动作细看来action="<?= base_url('login_controller/process')?>和base_url()是URL助手（自动加载它）。

---

一些调试技巧：

启用控制器探查$this->output->enable_profiler(TRUE);不幸的是你的位指示必须正确加载（无404错误），但这可能会帮助你在未来甚至在AJAX调用（你可以看到POST数据发送）。在实际的应用程序中禁用这个，因为JSON数据将被“损坏”。

对于AJAX测试使用谷歌浏览器（或FF），右键单击并检查元素看看网络选项卡（你已经知道这一点），但现在，每当你进行AJAX调用，将会有行头/身体等标题，你可以看到什么网址被称为，因此“为什么”有404错误。

在构造函数中使用这个if/else声明忽略非AJAX调用

public function __construct() { 
     parent::__construct(); 
     if (!$this->input->is_ajax_request()) { 

      redirect(); //no ajax redirect to home 

     } 

     $this->output->enable_profiler(FALSE); //force to disable profiler 

    }