may may - 1 month ago 8
Javascript Question

sending error message to view with codeigniter

I have a form that submit

email
and have a condition if the submitted email isn't verified (status = 1) then it fails to insert to the
user_driver
table. What I want to achieve is how can I show error message like "Please verify your email" when the user click on
add
button after filling the email field? I am using jquery to send input post to controller and my form is inside
modal
bootstrap. It hits
success
function even though the requirement is not met (
email_verified = 1
) and then
reload
the page. So, I am a bit confuse how to show the error message.

My view:



function add_driver()
{
user_email = $("#user_email").val();
$.ajax
({
url : site_url+'portal/add_driver',
type: "POST",
//dataType: "json",
data:{user_email: user_email},
success: function(data)
{
$("#add_driver_modal").modal("hide");
location.reload();
},
error: function (jqXHR, textStatus, errorThrown)
{
alert('Email already registered');
location.reload();
}
});
};

<div class="modal fade" id="add_driver_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">ADD DRIVER</h4>
</div>
<div class="modal-body" id='add'>
<div class="row" id="add_driver_form">

<input type="hidden" name="user_id" id="user_id" />

<div class="col-sm-4">
<input type="text" class="form-control input-lg" autocomplete="off" id="user_email" name="user_email" placeholder="Email" required>
</div>

</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-default" data-dismiss="modal">Close</button>
<button id="add" type="button" class="btn btn-primary btn-md" onclick=add_driver()>Add</button>
</div>
</div>
<div id="form_submit_result"></div>
</div>
</div>





My controller:

public function add_driver()
{
$user_email = $this->input->post('user_email');

$array = array(
'user_email' => $user_email,
'email_verified' => 1,
'phone_verified' => 1
);

$this->db->select('*');
$this->db->where($array);
$this->db->from('user');
$query = $this->db->get();
$result = $query->row_array();
$match_id = $result['user_id'];
$match_email = $result['user_email'];

if(!is_null($result))
{
$data_user_driver = array(
'user_id' => $match_id,
'user_email' => $match_email
);
$this->db->insert('user_driver',$data_user_driver);
}
}

Answer

You may add a p tag in your modal inside modal-body like

....
<div class="modal-body" id='add'>
 <p style="display:none;" id="error" class="alert alert-danger"></p>
...

and add a else block and send any message if no result found (in add_driver method) like

...
if(!is_null($result)){
        $data_user_driver = array(
            'user_id' => $match_id,
            'user_email' => $match_email
            );
        $this->db->insert('user_driver',$data_user_driver);
    } else {//if email not verified 
      echo 'err';
    }
....

Now check this result in your ajax success

....
success: function(data){
         if(data == 'err'){
           $('#error').show().text('Please verify your email');
           return false;
         }
         $('#error').hide();     
         $("#add_driver_modal").modal("hide");
         location.reload();
 },
 ....