Why the validation error messages don't display - php

Question

I was about to update my existing data in sql.
I am updating the data using ajax with validation error
ajax validation works on my account creation and change password
below are my ajax code
$('#form-battery-update').submit(function(e) {
e.preventDefault();
var me = $(this);
// perform ajax
$.ajax({
// url: me.attr('action'),
url: '<?php echo base_url(); ?>msasset/update_battery_form_validation',
type: 'post',
data: me.serialize(),
dataType: 'json',
success: function(response) {
if (response.success == true) {
// if success we would show message
// and also remove the error class
$('#the-message').append('<div class="alert alert-success">' +
'<span class="glyphicon glyphicon-ok"></span>' +
' UPS Battery has been created' +
'</div>');
$('.form-group').removeClass('has-error')
.removeClass('has-success');
$('.text-danger').remove();
// reset the form
me[0].reset();
// close the message after seconds
$('.alert-success').delay(500).show(10, function() {
$(this).delay(3000).hide(10, function() {
$(this).remove();
});
})
}
else {
$.each(response.messages, function(key, value) {
var element = $('#' + key);
element.closest('div.form-group')
.removeClass('has-error')
.addClass(value.length > 0 ? 'has-error' : 'has-success')
.find('.text-danger')
.remove();
element.after(value);
});
}
}
});
});
below are my code from my views folder
<div class="card-body p-0">
<?php echo form_open("msasset/update_battery_form_validation", array("id" => "form-battery-update", "class" => "form-horizontal")) ?>
<div class="row">
<div class="col-lg-5 d-none d-lg-block bg-register-image"></div>
<div class="col-lg-7">
<div class="p-5">
<div class="text-center">
<h1 class="h4 text-gray-900 mb-4"><?php echo $title; ?></h1>
<div id="the-message"></div>
</div>
<?php
if(isset($fetch_single_battery))
{
foreach($fetch_single_battery->result() as $row)
{
?>
<div class="form-group">
<label>Battery SerialNumber</label> </br>
<p class="form-control"> <?php echo $row->SerialNumber; ?></p>
</div>
<div class="form-group">
<label>PO Number</label> </br>
<input type="text" name="PONumber" value="<?php echo $row->PONumber; ?>" class="form-control"/>
</div>
<div class="form-group">
</div>
<div class="form-group">
<label>Ticket</label>
<input type="text" name="ticketid" value="<?php echo $row->TicketNumber; ?>" class="form-control" />
<span class="text-danger"><?php echo form_error("ticketid"); ?></span>
</div>
<div class="form-group">
</div>
<div class="form-group">
<label>Data Port</label>
<select class="form-control" name="select_port">
<option class="form-control" selected><?php echo $row->DataPort; ?></option>
<?php foreach ($GetPortLocation as $Port) { ?>
<option value="<?php echo $Port['DataPort']; ?>"><?php echo $Port['DataPort']; ?></option>
<?php } ?>
</select>
<span class="text-danger"><?php echo form_error("select_port"); ?></span>
<span class="text-danger"></span>
</div>
<div class="form-group">
<label>UPS Asset Tag</label>
<input type="text" name="ups_asset_tag" value="<?php echo $row->UPS_AssetTag; ?>" class="form-control" />
<span class="text-danger"></span>
</div>
<div class="form-group">
<label>Date Installed</label>
<input type="date" name="date_installed" value="<?php echo $row->DateInstalled; ?>" class="form-control" />
<span class="text-danger"></span>
</div>
<div class="form-group">
<label>Status</label>
<select class="form-control" name="select_status">
<option class="form-control" selected><?php echo $row->Status; ?></option>
<?php foreach($get_AssetStatus as $AssetStatus){?>
<option value="<?php echo $AssetStatus['AssetStatus']; ?>"><?php echo $AssetStatus['AssetStatus']; ?></option>
<?php } ?>
</select>
</div>
<div class="form-group">
<input type="hidden" name="hidden_id" value="<?php echo $row->ID; ?>" />
<input type="submit" name="update" id="update" value="Update" class="btn btn-info" />
<input type="submit" name="insert" id="insert" value="Update" class="btn btn-primary">
</div>
<?php
}
}
?>
</form>
</div>
</div>
</div>
</div>
below codes from my controller
function update_battery_form_validation()
{
$data = array('success' => false, 'messages' => array());
$this->load->library('form_validation');
$this->form_validation->set_rules('PONumber','po number','required');
// $this->form_validation->set_rules('ticketid','ticket id','required');
if($this->form_validation->run() == TRUE)
{
$this->load->model('assets_model');
$data = array(
'PONumber' => $this->input->post('PONumber'),
'TicketNumber' => $this->input->post('ticketid'),
'DataPort' => $this->input->post('select_port'),
'UPS_AssetTag' => $this->input->post('ups_asset_tag'),
'DateInstalled' => $this->input->post('date_installed'),
'Status' => $this->input->post('select_status'),
'PerformedBy' => $this->session->userdata('user_name')
);
if($this->input->post('update'))
{
$this->assets_model->update_battery($data,$this->input->post('hidden_id'));
$this->session->set_flashdata('batteries_updated','New battery has been updated successfully');
redirect('msasset/ups_batteries');
}
}
else
{
// echo validation_errors();
foreach ($_POST as $key => $value)
{
$data['messages'][$key] = form_error($key);
}
}
echo json_encode($data);
}
I was expecting that every time there is an empty fields it should give me an a this fields required messages and also if all the fields fill with data it also does not load the page or save the data