gimana caranya biar ajax ngeluarin pesan ketika ajax selesai

ini code controllernya :

 	function register(){
		$this->load->view('form_register');

		$this->form_validation->set_rules('namaLengkap', 'Nama Lengkap', 'required');
		$this->form_validation->set_rules('username', 'Username', 'required');
		$this->form_validation->set_rules('password', 'Password', 'required');
		$this->form_validation->set_rules('confirmPassword', 'Confirm Password', 'required|matches[password]');

		if($this->input->is_ajax_request())
		{
			if($this->form_validation->run() === FALSE){
				$error = validation_errors();
				echo json_encode(array('error' => $error));
			}else{
				$data = array(
					'nama_lengkap' => $this->input->post('namaLengkap'),
					'username' => $this->input->post('username'),
					'password' => md5($this->input->post('password')),
				);

				$this->model_operator->regis('operator',$data);
				echo json_encode(array('result' => TRUE));
			}
		}
	}

ini tampilan form register nya :

 <!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Gentelella Alela! | </title>

    <!-- Bootstrap -->
    <link href="<?php echo base_url('assets');?>/vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome -->
    <link href="<?php echo base_url('assets');?>/vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <!-- NProgress -->
    <link href="<?php echo base_url('assets');?>/vendors/nprogress/nprogress.css" rel="stylesheet">
    <!-- Animate.css -->
    <link href="<?php echo base_url('assets');?>/vendors/animate.css/animate.min.css" rel="stylesheet">

    <!-- Custom Theme Style -->
    <link href="<?php echo base_url('assets');?>/build/css/custom.min.css" rel="stylesheet">
  </head>

  <body class="login">
    <div>
      <a class="hiddenanchor" id="signup"></a>
      <a class="hiddenanchor" id="signin"></a>

      <div class="login_wrapper">
        <div class="animate form login_form">
          <section class="login_content">

            <form action="javascript:;" method="post" id="form-register">

              <h1>Register Form</h1>

              <div class="alert alert-success alert-dismissible fade in" role="alert" id="login-alert-success" style="display:none;">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span>
                </button>
                <strong>Success!</strong> <span id="alert-text-success"> </span>
              </div>

              <div class="alert alert-danger alert-dismissible fade in" role="alert" id="login-alert-danger" style="display:none;">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span>
                </button>
                <strong>Oops!</strong> <span id="alert-text-danger"></span>
              </div>

              <div>
                <input type="text" class="form-control" placeholder="Nama Lengkap" name="namaLengkap"/>
              </div>
              <div>
                <input type="text" class="form-control" placeholder="Username" name="username"/>
              </div>
              <div>
                <input type="password" class="form-control" placeholder="Confirm Password" name="confirmPassword"  />
              </div>
              <div>
                <input type="password" class="form-control" placeholder="Password" name="password"  />
              </div>
              <input type="hidden" name="auth" value="psGnhL2k17">
              <div>
                <button type="submit" class="btn btn-default submit" name="submit" id="register">Register</a>

              </div>

              <div class="clearfix"></div>

              <div class="separator">


                <div class="clearfix"></div>
                <br />

              </div>
            </form>
          </section>
        </div>

      </div>
    </div>

    <script type="text/javascript">
      var base_url = "<?php echo base_url();?>";
    </script>

    <!-- jQuery -->
    <script src="<?php echo base_url('assets');?>/vendors/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap -->
    <script src="<?php echo base_url('assets');?>/vendors/bootstrap/dist/js/bootstrap.min.js"></script>

    <script src="<?php echo base_url('assets');?>/js/auth_register.js"></script>

  </body>
</html>

ini kode javascriptnya :

 var Register = function(){

    var triggerAction = function(){
        $('#form-register input').keypress(function(e){
                if(e.which == 13){
                    auth_register();
                }
        });

        $('#register').click(function(event){
            auth_register();
        });
    }

    var auth_register = function(){
        $.ajax({
            url: base_url + "auth/register",
            type: "POST",
            data: $('#form-register').serialize(),
            dataType: "JSON",
            success:function(data){
                var obj = jQuery.parseJSON( data );
                if(obj.result === TRUE){
                    $('#alert-text-success').text("User Berhasil Di Tambahkan");
                    $('#login-alert-success').show();
                }else{
                    $('#alert-text-danger').text("User Gagal Di Tambahkan");
                    $('#login-alert-danger').show();
                }
            },
        });
    }

    return {
        //main function to initiate the module
        init: function () {

            triggerAction();
        }
    };
}();

jQuery(document).ready(function() {
    Register.init();
});

jadi ketika error atau success si ajax ngeluarin pesan nya di alert .... ini sudah di tes di browser dan respon nya 200 tetapi tidak menampilkan pesan ... dan gimana caranya untuk menampilkan pesan nya di alert ??

avatar zahidin
@zahidin

3 Kontribusi 0 Poin

Diperbarui 6 tahun yang lalu

1 Jawaban:

kalau ga salah yah gan ada parameter afterSend dan beforeSend pada ajax


$.ajax({
            url: base_url + "auth/register",
            type: "POST",
            data: $('#form-register').serialize(),
            dataType: "JSON",
            success:function(data){
                var obj = jQuery.parseJSON( data );
                if(obj.result === TRUE){
                    $('#alert-text-success').text("User Berhasil Di Tambahkan");
                    $('#login-alert-success').show();
                }else{
                    $('#alert-text-danger').text("User Gagal Di Tambahkan");
                    $('#login-alert-danger').show();
                }
            },
            afterSend : function(){
            //aksi yang di inginkan
            },
// atau bisa gunakan method then pada jquery
        }).then(function(){
           //aksi yang di inginkan
        });

avatar sukmaw
@sukmaw

340 Kontribusi 75 Poin

Dipost 6 tahun yang lalu

Login untuk ikut Jawaban