簡體   English   中英

CodeIgniter Ajax表單發布

[英]CodeIgniter Ajax Form Post

我正在使用CodeIgniter和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]

配置/ routes.php文件

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

現在發生的是, RetMsg向我顯示404錯誤...當我可以擺脫404錯誤時, RetMsg再次向我顯示了登錄表單。

我究竟做錯了什么? 我希望它能向我顯示var_dump('YEP');

嘗試調用通過URL(用手)控制器,如果它的工作原理沒有issiue與routes.php


請注意並仔細閱讀這部分代碼...action="/login_controller/process" onsubmit="PostFormRedirect('#LoginForm', '#RetMsg', '/');...

嘗試將action="<?= base_url('login_controller/process')?>編輯為action="<?= base_url('login_controller/process')?>base_url()url幫助器中(自動加載)。


一些調試技巧:

在控制器分析器中啟用$this->output->enable_profiler(TRUE); 不幸的是,您的contoller必須正確加載(沒有404錯誤),但是即使將來在AJAX調用中也可以為您提供幫助(您可以看到發送了哪些POST數據)。 在實際的應用程序中,請禁用此功能,因為JSON數據將“損壞”。

要使用Google Chrome(或FF)進行AJAX測試,請右鍵單擊並檢查元素,看看“網絡”標簽(您已經知道了),但是現在,每當進行AJAX調用時,都會在標題中包含標題/正文等行您可以看到調用了什么URL,因此“為什么”出現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

    }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM