Untitled

$('#availVLANS').click(function()  {
  $(this).attr("disabled","disabled");
  $.ajax({
    url:"<?php echo site_url('controller/methodABC/');?>",
    type:'POST',
    dataType:'json',
    success: function(returnDataFromController) {
    var htmlstring;
    var submitFormHTML;
    htmlstring = "<br><br><B>To reassign the port to a new vlan, click on a VlanId below and then click on the OK button</B><br><table class='table table-bordered table-striped'>";
    htmlstring = htmlstring + "<th>VlanId</th><th>Name</th>";
    for(i = 0; i < returnDataFromController.length; i++) {
        //alert(returnDataFromController[i].VlanId);
        htmlstring = htmlstring +  "<tr><td><a href=>"+returnDataFromController[i].VlanId+"</a></td><td>"+ returnDataFromController[i].Name+"</td></tr>";

    }
    submitFormHTML = "<form method='post' accept-charset='utf-8' action='" + BASEPATH + "index.php/switches/changeportvlan/"+ $('#ip').val() +"/" + $('#hardwaremodel').val() +"/" + $('#port').val() + "'><input type='text' name='newVlanID' id='newVlanID' style='width:5em;height:1.5em'/>&nbsp;&nbsp;<button type='submit' class='btn' name='saveVlan' id='saveVlan' style='width:10em;height:2em'>Reassign Vlan</button></form>";
    //alert(submitFormHTML);
    $('#clientajaxcontainer').html(htmlstring);
    $('#newvlanform').html(submitFormHTML);

  }
});
$(this).removeAttr("disabled");
  });

╔════════════════════╗
║  #progress-overlay ║
║ ╔════════════════╗ ║
║ ║ #progress-indicator
║ ╚════════════════╝ ║
╚════════════════════╝

<html>
<head>
....
</head>
<body>
<div id="progress-overlay">
    <div id="progress-indicator">
        <img src="images/myprogress.gif" /> Please Wait...
    </div>
</div><!--progress-overlay-->
<div id="website-wrapper">
.... web site, layout, content, etc...
</div>
</body>
</html>

#progress-overlay{
position: absolute;
width: 100%;
height: 100%;
background: #000;
opacity: 0.2;
}

#progress-indicator{
position: relative;
margin: 0 auto;
top: 40%;
width: 200px;
height: 50px;
}

$(document).ready(function(){
    $('#progress-overlay').hide();
    });
function showProgressIndicator()
{
    $('#progress-overlay').show();
}

jQuery.ajaxSetup({
  beforeSend: function() {
     $('#loader').show();
  },
  complete: function(){
     $('#loader').hide();
  }
});

$(document).ready(function(){
    $("#the_button").click(function(){
        var url = "the_controller/the_method"
        var data = {the: "data"}
        //before the POST takes place, fade-in the message
        $("#the_message").fadeIn();
        $.post(url, data, function(r){
            if(r.success){
                //when the post is finished, and it was successful, fade-out the message.
                $("#the_message").fadeOut();
            }
            else console.log("something bad happened");
        }, 'json');
    });
});

<!-- HIDE IT BY DEFAULT -->
<div id='the_message' style='display:none;'>
    Please wait.
</div>

class The_controller extends CI_Controller{
    function the_method(){
        $p = $this->input->post();
        the_task($p);
        if(the_task_success) return json_encode(array("success" => true));
        else return json_encode(array("success" => false));
    }
}