Code igniter show div else show a different div in a view - php

Question

I want to set a divs in conditions IN my View but I don't know how to I do it.If the request from controller comes true to him then success div appear otherwise failure div. At the time I am just printing true and false in alert boxes.
Here is my View:
<div class = "success">operation done successfully </div>
<div class = "failiour">operation done successfully </div>
//these are the two divs on which i want to apply a condition
<form>
</form>
<script type="text/javascript">
$('#btn').click(function() { // $("#form").serialize()
var item_name = $('#item_name').val();
var cat_id = $('#selsear').val();
if (!item_name || item_name == 'Name') {
alert('Please enter Category Name');
return false;
}
var form_data = {
item_name: $('#item_name').val(),
cat_id: $('#selsear').val(),
};
$.ajax({
url: "<?php echo site_url('itemsController/additems'); ?>",
type: 'POST',
data: form_data,
dataType: 'json',
success: function(msg) {
if(msg.res == 1)
{
alert(true);
}
else{
alert(false);
}
}
});
return false;
});
</script>
my controller
function additems(){
//getting parameters from view
$data = array(
'item_name' => $this->input->post('item_name'),
'cat_id' => $this->input->post('cat_id')
);
//$is_ajax = $this->input->post('ajax'); //or use this line
//$this->input->is_ajax_request();
$result = array();
$this->load->model('itemsModel');
$query = $this->itemsModel->addItemstoDB($data);
if ($query){ //&& any other condition
$result['res'] = 1;//process successful - replace 1 with any message
}
else
{
$result['res'] = 0;//process failed - replace 0 with any message
}
echo json_encode($result);//at the end of the function.
}
}

Answer 1

Set display none through css in your both success and failure div and then do this :
$.ajax({
url: "",
type: 'POST',
data: form_data,
dataType: 'json',
success: function(msg) {
if(msg.res == 1)
{
$(".success").fadeIn(500).delay(2000).fadeOut(500);
}
else
{
$(".failiour").fadeIn(500).delay(2000).fadeOut(500);
}
}
});

Answer 2

first hide your divs
<div class = "success" style="display:none;">operation done successfully </div>
<div class = "failiour" style="display:none;">operation done successfully </div>
then if you are get reuests multiple times
$.ajax({
url: "",
type: 'POST',
data: form_data,
dataType: 'json',
success: function(msg) {
if(msg.res == 1)
{
$(".success").show();
$(".failiour").hide();
}
else
{
$(".failiour").show();
$(".success").hide();
}
}
});

Answer 3

In your script,
//supposing you are getting the result in response varible
if(response == true) // simply write: if(response)
{
document.getElementById('success').style.display='block';
document.getElementById('failure').style.display='none';
}
else
{
document.getElementById('success').style.display='none';
document.getElementById('failure').style.display='block';
}
//Add IDs to divs and add style block/none according to your requirement
<div id="success" style="display:block;"></div>
<div id="failure" style="display:none;"></div>