如何使用jQuery,AJAX和CodeIgniter

时间:2016-01-02 08:26:32

标签: php jquery mysql ajax codeigniter

我想验证我的表单输入数据库,因此当用户在表单输入中输入并包含电子邮件已在使用或存在时,它将显示警告并且无法显示提交。我使用CodeIgniter框架和jQuery。

我已尝试使用以下代码检查名称是否存在,这可行。但是,当我将其应用于电子邮件的另一个案例时,它不起作用并显示消息"您提交的URI不允许使用字符。"

解决这个问题的正确方法是什么?

查看(kasir_halaman.php):

<div id="addModal" class="modal fade" role="modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h3 class="modal-title"><span class="glyphicon glyphicon-plus"></span> Tambah Kasir</h3>
                </div>
                <div class="modal-body">
                    <form action="<?php echo site_url('admin/kasir/addpetugas'); ?>" method="post" enctype="multipart/form-data">
                        <div class="form-group">
                            <label>Nama</label>
                            <input type="text" id="nama" name="nama" class="form-control" maxlength="100" required>
                        </div>
                        <div class="form-group">
                            <label>E-mail</label>
                            <input type="email" id="email" name="email" class="form-control" maxlength="150" required>
                        </div>
                        <div class="form-group">
                            <label>Kategori</label>
                            <select class="form-control" name="kategoripetugas" required>
                                <option value=""> -- Pilih Kategori -- </option>
                                <option value="1">Admin</option>
                                <option value="2">Kasir</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Password</label>
                            <input type="password" name="password" class="form-control" maxlength="30">
                        </div>
                        <div class="form-group">
                            <label>Ulangi Password</label>
                            <input type="password" name="confirmpassword" class="form-control" maxlength="30">
                        </div>
                        <button type="submit" class="btn btn-primary" style="width:100%;">Tambah</button>
                    </form>
                </div>
            </div>
        </div>
    </div>

Controller(kasir.php):

public function cekData($table, $field, $data)
{
    $match = $this->Crud->read($table, array($field=>$data), null, null);
    if($match->num_rows() > 0){
        $report = 2;
    }else{
        $report = 1;
    }
    echo $report;
}

public function register_email_exists()
{
    if (array_key_exists('email',$_POST)) {
        if ($this->Crud->email_exists($this->input->post('email')) == TRUE ) {
            echo false;
        } else {
            echo true;
        }
    }
}

模型(Crud.php):

function email_exists($email)
{
    $this->db->where('email', $email);
    $query = $this->db->get('petugas');
    if( $query->num_rows() > 0 ){ return TRUE; } else { return FALSE; }
}

jQuery AJAX(petugas.js):

$(document).ready(function(){
var check1=0; var id;
$("#nama").bind("keyup change", function(){
    var nama = $(this).val();
    $.ajax({
        url:'kasir/cekData/petugas/nama/'+nama,
        data:{send:true},
        success:function(data){
            if(data==1){
                $("#report1").text("");
                check1=1;
            }else{
                $("#report1").text("*nama petugas sudah terpakai");
                check1=0;
            }
        }
    });
});

var check2=0;
$("#email").bind("keyup change", function(){
    //var email = $(this).val();
    $.ajax({
        url:'kasir/register_email_exists',
        data:{send:true},
        success:function(data){
            if(data==1){
                $("#report2").text("");
                check2=1;
            }else{
                $("#report2").text("*email sudah terpakai");
                check2=0;
            }
        }
    });
});

var check4=0;
$("#confirmpassword").bind("keyup change", function(){
    var password = $("#password").val();
    var confirmpassword = $(this).val();

    if (password == confirmpassword){
        $("#report4").text("");
        check4=1;
    }else{
        $("#report4").text("*Password tidak sama");
        check4=0;
    }
});

$("#submit").click(function(event){
    if(check1==0){
        event.preventDefault();
    }
    if(check4==0){
        event.preventDefault();
    }
});

});

1 个答案:

答案 0 :(得分:0)

使用ajax post方法,从POST请求

获取php端的数据

您可以在此处查看有关jquery ajax的更多信息:http://api.jquery.com/jquery.post/

关于php发布在这里:http://php.net/manual/en/reserved.variables.post.php

//JS
$("#email").bind("keyup change", function(){

  var email = $(this).val();

  $.ajax({
    url:'kasir/register_email_exists',
    type: "POST",// <---- ADD this to mention that your ajax is post
    data:{ send:true, email:email },// <-- ADD email here as pram to be submitted
    success:function(data){
        if(data==1){
            $("#report2").text("");
            check2=1;
        }else{
            $("#report2").text("*email sudah terpakai");
            check2=0;
        }
    }
  });

});

// PHP
// At php side take your data  from $_POST
$send = $_POST['send'];
$email = $_POST['email'];
...