[CodeIgniter] 利用 jQuery 簡易驗證使用者帳號/Email

codeigniter_2
好久沒寫相關 CodeIgniter 文章,針對於剛入門 CI 的新手們,此篇教學如何使用 jQuery AJAX 搭配 CI 來驗證使用者帳號及相關資訊,本篇教學帶您如何在 CI 中發出 AJAX request 給伺服器端。 請先在網頁 header 自行 include jQuery 檔案,或者可以使用 Google AJAX CDN 方式來讀取,將底下程式碼放到 之前:
$(document).ready(function() {
    /* 先停止讀取狀態 */
    $('#Loading').hide();

    /* 填寫好 email 欄位,按下 Tab 會進行讀取 */
    $('#email').blur(function(){
    /* 讀取 email 欄位 */
	var a = $("#email").val();
    /* email 正規語法 */
	var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
    /* 簡易驗證 email */
	if(filter.test(a)){
        /* 讀取狀態 */
		$('#Loading').show();
        /* AJAX 比對資料庫 */
		$.post("controller_name/check_email_availablity", {
			email: $('#email').val()
		}, function(response){
            /* 驗證後讀取 reponse 狀態 */
			$('#Loading').hide();
			setTimeout("finishAjax('Loading', '"+escape(response)+"')", 400);
		});
		return false;
	}
});
在 CI Viewer 加入:
Ajax Indicator
CI Controller(控制器)寫法:
function check_email_availablity()
{
	$this->load->model('My_model');
	$email = $this->input->post('email');
	$get_result = $this->My_model->check_email_availablity($email);

	if($get_result )
	echo 'Email already in use. ';
	else
	echo 'Email Available';
}
驗證 email 函式 $this->My_model->check_email_availablity()
function check_email_availablity($email)
{
    $this->db->select('*');
    $this->db->from('project_users');
    $this->db->where('email', $email);
    $query = $this->db->get('');
    if($query->num_rows() > 0)
        return true;
    else
        return false;
}
此函式會從資料庫比對是否有註冊過此 email,如果有的話回傳 true 反之回傳 false,然後在將處理後的狀態回傳給 response,這樣就可以顯示驗證訊息了。另外可以使用 jQuery plugin: Validation 來驗證 js 部份。^^ Ref: Codeigniter Tutorial: How To check Username/Email availablity using jQuery in Codeigniter?
  • kuntelin

    $get_result = $this->My_model->check_email_availablity();
    沒有傳入參數

  • 已修正

  • V03071106

    您好,我想請問您一些問題…
    我用$this->input->post(‘name’) 接收值,然後放到$aa變數中
    但是我在欄位完全都沒輸入任何字元,也沒有預設值(資料庫也沒有預設值)。

    當我新增到資料庫之後,竟然會塞進 0 
    請問它內建語法不是提到說 ->  不必預先測試它們是否存在

    使用 POST, COOKIE, 或 SERVER 資料CodeIgniter 提供三個讓你取出 POST, COOKIE 或 SERVER 中項目的補助函數。使用這些函數的主要便利性在於, 它們會確認並檢視是否這些項目已被設定並且在未設定時回傳 false (boolean) , 而不是直接取出 ($_POST[‘something’]),官方範例↓這讓你可以方便地使用資料而不必預先測試它們是否存在。不然, 通常你可能會像這樣做:if ( ! isset($_POST[‘something’]))
    {
        $something = FALSE;
    }
    else
    {
        $something = $_POST[‘something’];
    }但是為什麼還是為設定為0呢??這應該是檢查資料有沒有被設定而已,那我如果沒有輸入,又怎麼會出現 0 呢??

  • Hi, 

    很高興看到你提問這問題剛剛看了底層一些程式碼,會造成你這樣的問題,還是有解決法,不過解釋過程有點長,我會另外發一篇 blog 來解釋這問題

  • Bulln01

    您好我想問一下如果我要在輸入錯誤的格式後一樣在網頁上寫上格式錯誤該怎麼做??
    跟Email already in use. 這顯示的方式一樣

  • Bulln01

    抱歉再問一下請問Controller回傳的字中文會亂碼怎麼會這樣?
    Email already in use這個地方打中文回傳是亂碼

  • Pingback: PHP Framework – CodeIgniter « Abner’s Postgraduate Days()