Thêm thành viên trong CodeIgniter 3x

Sau khi hiển thị ra list thành viên, bài này mình hướng dẫn các bạn thêm thành viên, thêm user trong codeigniter 3x, kiểm tra email, số điện thoại, tên tài khoản tồn tại hay không dựa theo các trường thông tin cần thiết
  • 10:53 16/11/2016
  • Kỳ Nhân
  • 0 Bình luận
  • 768

- Để viết hành động thêm thành viên trong CodeIgniter 3x các bạn cần viết các function thêm, giao diện view thêm thành viên. Trước tiên tạo giao diện thêm thành viên đã.

- Việc tạo giao diện thêm thành viên cũng đơn giản, đa số là sửa lại từ giao diện view của groups mà copy ra thôi, phần này mình hướng dẫn tạo mới, còn nếu có tên file rồi các bạn sửa lại giống nội dung là ok. Vào application/views/admin/users tạo file create.php với nội dung

<?php defined('BASEPATH') OR exit('No direct script access allowed');?>
<div class="container">
    <h1>Thêm Users</h1>
    <?php $this->load->view('admin/users/form'); ?>
</div>

Cũng tại folder users này tạo thêm file form.php với nội dung

<?php defined('BASEPATH') OR exit('No direct script access allowed');?>
<div class="box-form">
    <?php echo form_open_multipart('',array('id'=>'form-users','id_user'=>$id_user));?>
    <div class="clearfix"></div>
    <div class="form-group">
        <div class="row">
            <label class="col-sm-12">Hình ảnh đại diện</label>
            <div class="col-sm-3">
                <input type="file" accept="image/*" name="picture" class="filestyle" data-input="false" data-buttonText="Chọn hình"/>
            </div>
            <div class="col-sm-9">
                <?php if(isset($items) && $items->picture!='') { ?>
                <img src="<?=base_url()?>uploads/<?=(isset($items->picture)) ? $items->picture : ''?>" height="80">
                <?php } ?>                
            </div>
        </div>
    </div>    
    <div class="clearfix"></div>
    <div class="form-group">
        <label>Nhóm tài khoản</label>
        <select class="form-control select2" name="group_id" style="width:100%;">
            <?php foreach($list_group as $item) {?>
            <option value="<?=$item->id?>" <?=(isset($items) && $items->group_id==$item->id) ? 'selected="selected"' : ''?>><?=$item->title?></option>
            <?php } ?>
        </select>
    </div>
    <div class="form-group">
        <label>Tên đăng nhập</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="username" id="username" data-error="Nhập tài khoản" data-error-1="Tên tài khoản đã tồn tại" data-url="<?=base_url('admin/users/check_username')?>"><?=(isset($items)) ? $items->username : ''?></textarea></div>
        <div class="block red mt5 font12"><b>Lưu ý:</b> Tên tài khoản phải không có dấu và khoảng trống</div>
    </div>
    <div class="form-group">
        <label>Mật khẩu</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="password" id="password" data-error="Nhập mật khẩu"><?=(isset($items)) ? $items->pass_token : ''?></textarea></div>
    </div>
    <div class="form-group">
        <label>Xác nhận mật khẩu</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="re_password" id="re_password" data-error="Mật khẩu không trùng khớp"><?=(isset($items)) ? $items->pass_token : ''?></textarea></div>
    </div>
    <div class="form-group">
        <label>Tên hiển thị</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="name" id="name" data-error="Nhập tên"><?=(isset($items)) ? $items->name : ''?></textarea></div>
    </div>    
    <div class="form-group">
        <label>Email</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="email" id="email" data-error="Nhập email" data-error-1="Email đã tồn tại" data-url="<?=base_url('admin/users/check_email')?>"><?=(isset($items)) ? $items->email : ''?></textarea></div>
    </div>
    <div class="form-group">
        <label>Điện thoại</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="phone" id="phone" data-error="Nhập sô điện thoại"><?=(isset($items)) ? $items->phone : ''?></textarea></div>
    </div>
    <div class="form-group">
        <label>Địa chỉ</label>
        <div class="relative"><textarea class="form-control area-input" rows="1" name="address" id="address" data-error="Nhập địa chỉ"><?=(isset($items)) ? $items->address : ''?></textarea></div>
    </div>
    <div class="clearfix"></div>
    <div class="form-group">
        <div class="row">
            <label class="col-sm-12">Ngày sinh *</label>
            <div class="col-sm-12">
                <select name="day" class="select2 w70">
                    <option value="">Ngày</option>
                    <?php for($i=1;$i<=31;$i++) { ($i<10) ? $j = "0".$i : $j = $i; ?>
                    <option value="<?=$j?>" <?=(isset($items) && date("d",$items->birthday)==$j) ? 'selected="selected"' : '' ?>><?=$j?></option>
                    <?php } ?>
                </select>
                <select name="month" class="select2 w80">
                    <option value="">Tháng</option>
                    <?php for($i=1;$i<=12;$i++) { ($i<10) ? $j = "0".$i : $j = $i; ?>
                    <option value="<?=$j?>" <?=(isset($items) && date("m",$items->birthday)==$j) ? 'selected="selected"' : '' ?>><?=$j?></option>
                    <?php } ?>
                </select>
                <select name="year" class="select2 w80">
                    <option value="">Năm</option>
                    <?php $year = (int)date("Y"); for($i=$year;$i>($year-200);$i--) {?>
                    <option value="<?=$i?>" <?=(isset($items) && date("Y",$items->birthday)==$i) ? 'selected="selected"' : '' ?>><?=$i?></option>
                    <?php } ?>
                </select>
            </div>
        </div>
    </div>
    <div class="clearfix"></div>
    <div class="form-group">
        <div class="row">
            <label class="col-sm-12">Giới tính *</label>
            <div class="col-sm-12">
                <label class="radio-inline">
                    <input class="icheck" type="radio" name="gender" value="1" <?=(isset($items) && $items->gender==1) ? 'checked="checked"' : '' ?>> Nam
                </label>
                <label class="radio-inline">
                    <input class="icheck" type="radio" name="gender" value="0" <?=(isset($items) && $items->gender==0) ? 'checked="checked"' : '' ?>> Nữ
                </label>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label>STT</label>
        <input type="number" name="stt" class="form-control" min="0" value="<?=(isset($items->stt)) ? $items->stt : 0 ?>">
    </div>
    <div class="form-group">
        <label>Hiển thị</label>
        <select class="form-control select2" name="hide" style="width:100%;">
            <option value="1" <?=(isset($items) && $items->hide==1) ? 'selected="selected"' : '' ?>>Có</option>
            <option value="0" <?=(isset($items) && $items->hide==0) ? 'selected="selected"' : '' ?>>Không</option>
        </select>
    </div>
    <div class="form-group">
        <button type="submit" class="btn btn-success"><?=$button_title?></button>
    </div>
    <?php echo form_close();?>
</div>

- Sau khi làm xong giao diện ta viết hàm thêm trong Controller Users thôi

public function create() {
        $this->data['button_title'] = 'Thêm users';
        if($this->input->post()) {
            //upload hinh
            $pic_name = '';                
            if($this->upload->do_upload('picture')) {
                $pic_name = $this->upload->file_name;
            }
            $model = [
                'stt' => $this->mcode->clean($this->input->post('stt')),
                'hide' => $this->mcode->clean($this->input->post('hide')),
                'picture' => $pic_name,
                'username' => $this->mcode->username($this->mcode->clean($this->input->post('username'))),
                'user_token' => $this->mcode->hash($this->mcode->clean($this->input->post('username'))),
                'pass_token' => $this->mcode->hash($this->mcode->clean($this->input->post('password'))),
                'group_id' => $this->mcode->clean($this->input->post('group_id')),
                'name' => $this->mcode->clean($this->input->post('name')),
                'email' => $this->mcode->clean($this->input->post('email')),
                'phone' => $this->mcode->clean($this->input->post('phone')),
                'address' => $this->mcode->clean($this->input->post('address')),
                'birthday' => strtotime($this->input->post('day')."-".$this->input->post('month')."-".$this->input->post('year')),
                'gender' => $this->mcode->clean($this->input->post('gender')),                
                'create_at' => time(),
            ];
            if($this->db->insert('users',$model)) {            
                redirect('admin/users/','refresh');
            }
            else {
                echo $this->db->error();
            }
        }
        else {
            $this->data['id_user'] = "";
            $this->data['list_group'] = $this->db->query("select * from groups where hide=1 order by id asc")->result();
            $this->render('admin/users/create');
        }
}

- Biến data['list_group'] là liệt kê các nhóm được tạo lấy từ table groups, hàm strtotime đổi text sang kiểu dữ liệu số ví dụ strtotime('11-11-2016'), đỗi dữ liệu kiểu này sau này các bạn so sánh, in ra ngày tháng năm nhẹ nhàng hơn chỉ cần dùng mà date() là ok. Các bạn tìm hiểu thêm hàm date() là được

- Biến id_user đễ check tên tài khoản, email đã tồn tại hay chưa ở phần dưới

- Các hàm hash,clean bên models được ứng dụng để tạo mã hóa mật khẩu và tài khoản, làm sạch srcript nếu có nhập vào.

- Code trên có tạo user_token pass_token nhằm sau này kiểm tra đăng nhập ta kiểm tra cả tên đăng nhập và mật khẩu đã mã hóa rồi so sánh với trong database, trành tình trang bị tấn công bằng SQL Injection

- Sau khi hoàn thành các bước trên các bạn test thử tạo user tại đường dẫn localhost/ci/admin/users/create.html. Thấy tạo thành công => hàm viết ok

- Khi đó muốn phân trang các bạn vào application/config/routes.php thêm dòng $route['admin/users/:num'] = 'admin/users'; như phần tạo Groups nha.

- Tuy nhiên vẫn còn nhiều bất cập như:

- Kiểm tra mật khẩu nhập lại có trùng khớp không?
- Kiểm tra tên đăng nhập đã tồn tại hay chưa?
- Tên đăng nhập có nhập liền kề không dấu hay không?
- Kiểm tra email đã tồn tại hay không?
- Kiểm tra số điện thoại đã tồn tại hay không?

- Rất nhiều cái phải kiểm tra vậy phải làm thế nào mới làm được? Vậy cách giải quyết thế nào? Các bạn theo dõi bên dưới:

- Cách ứng dụng Validate form bằng plugin jQuery Validation vào CodeIgniter. Các bạn có thể xem kỹ plugins này tại link ==> Validate form bằng plugin jQuery Validation

- Đầu tiên để sử dụng được plugin này các bạn phải down về vài copy vào dự án. Theo dự án đang hướng dẫn cho các bạn mình copy vào assets/admin/extra/validate/jquery.validate.min.js

- Sau khi copy xong các bạn cần insert jquery vào dự án. Vào application/views/layout_admin/include/end.php sửa thành:

<?php defined('BASEPATH') OR exit('No direct script access allowed');?>
<script src="<?=base_url()?>assets/admin/extra/bootstrap/js/bootstrap.min.js"></script>
<script src="<?=base_url()?>assets/admin/extra/validate/jquery.validate.min.js"></script>
<script src="<?=base_url()?>assets/admin/js/admin.js"></script>
</body>
</html>

- Hoàn thành các bước trên các bạn có thể bắt đầu viết validate form rồi. Vào file admin.js bắt đầu viết nào. Như form trên mình gán id là form-users

if($("#form-users").length) {
        var error1=$('#form-users #username').attr('data-error');
        var url_username=$('#form-users #username').attr('data-url');
        var error_username=$('#form-users #username').attr('data-error-1');
        var error2=$('#form-users #password').attr('data-error');
        var error3=$('#form-users #re_password').attr('data-error');
        var error4=$('#form-users #name').attr('data-error');
        var error5=$('#form-users #email').attr('data-error');
        var url_email=$('#form-users #email').attr('data-url');
        var error_email=$('#form-users #email').attr('data-error-1');
        var error6=$('#form-users #phone').attr('data-error');
        var error7=$('#form-users #address').attr('data-error');
        $("#form-users").validate({
            rules: {
                username: {
                    required: true,
                    remote: {
                        url: url_username,
                        type: "post",
                        data: {
                            username: function() {
                                return $('#form-users #username').val();
                            },
                            id_user: function() {
                                return $('#form-users').attr('id_user');
                            },
                        }                    
                    }
                },
                password: "required",
                re_password: {
                    required: true,
                    equalTo: "#password",
                },                
                name: "required",
                email: {
                    required: true,
                    email: true,
                    remote: {
                        url: url_email,
                        type: "post",
                        data: {
                            email: function() {
                                return $('#form-users #email').val();
                            },
                            id_user: function() {
                                return $('#form-users').attr('id_user');
                            },
                        }
                    }
                },
                phone: "required",
                address: "required",
                day: "required",    
                month: "required",    
                year: "required",    
                gender: "required",                    
            },
            messages: {
                username: {
                    required: error1,
                    remote: error_username
                },
                password: error2,
                re_password: {
                    required: error2,
                    equalTo: error3,
                },
                name: error4,
                email: {
                    required: error5,
                    email: error5,
                    remote: error_email,
                },
                phone: error6,
                address: error7,
                day: '',
                month: '',
                year: '',
                gender: '',
            },
            highlight : function (element) {
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight : function (element) {
                $(element).closest('.form-group').removeClass('has-error');
            },
        });    
    }

- Hàm js trên có tác dụng kiểm tra nếu tồn tại id tên là form-users thì mới chạy hàm, các biến error, url_username, url_email... đễ hiện thông báo lỗi, các đường dẫn ajax đẩy đi để kiểm tra, mình viết trên view để js dựa vào rồi lấy, sẽ dễ dàng thay đổi tự động trên view hơn là viết sẳn trên file js.

- Hàm remote là hỗ trợ cùa plugin validate form, hoạt động cũng giống như ajax, như hàm viết ở username, sẽ đẩy tới url là biến url_username có giá trị là localhost/ci/admin/users/check_username, và biến id_user ( biến này nếu sửa thành viên thì tồn tại còn thêm sẽ là giá trị rỗng )

- Hàm trên tuy hơi dài tý nhưng các bạn cố gắng tham khảo, tìm hiểu kỹ một tý sẽ giúp ích các bạn nhiều vào lĩnh vực lập trình sau này. Vì validate form sử dụng rất nhiều.

- Vậy localhost/ci/admin/users/check_username từ đâu mà có? Phần này các bạn phải khởi tạo trong Controller Users, các bạn viết thêm 2 function sau vào file application/controllers/admin/Users.php

   public function check_username() {
        $id_user = $this->input->post('id_user');
        $username = $this->mcode->username($this->input->post('username'));
        $check = $this->db->query("select id from users where username='$username' and id!='$id_user'")->num_rows();
        if($check>0) {
            echo "false";
        }
        else {
            echo "true";
        }
    }
    public function check_email() {
        $id_user = $this->input->post('id_user');
        $email = $this->input->post('email');
        $check = $this->db->query("select id from users where email='$email' and id!='$id_user'")->num_rows();
        if($check>0) {
            echo "false";
        }
        else {
            echo "true";
        }
    }

Sau khi hoàn thành các bước trên bạn vào link thêm thành viên và submit thử, nhập tên thành viên, email đã tồn tại.. . Sau khi test đủ các trò nhận thấy các vấn đề phức tạp trên hoàn toàn được giải quyết đơn giản băng plugin jquery validate form

- Qua bài viết này hi vọng các bạn thành thạo thêm thành viên, thêm user trong codeigniter, sử dụng thành tạo jquery validate form.