Dropdown - add records without refresh form

If the state is add, create a button on the div for adding a new record :

Code:

   <?php if($state == 'add')  { ?>
       $(document).ready(function() {
           $('#div_id').append('<a class="btn" id="button" data-toggle="modal" data-target=".bs-example-modal-lg"><i class="icon-plus-sign"></i> New </a>');
       });
   <?php } ?>

Bootstrap normal model :

Code:

<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
   <div class="modal-dialog modal-lg">
       <div class="modal-content">
           <div class="modal-header">
               <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
               <h4 id="myLargeModalLabel" class="modal-title">Add new Record</h4>
           </div>
           <div class="modal-body">
               
               <form class="sky-form" id="sky-inchidere" method="post" accept-charset="utf-8" action="">
                       <dl class="dl-horizontal">

                           <dt>Name<span class="color-red">*</span></dt>
                           <dd>
                               <section>
                                   <label class="input">
                                       <i class="icon-append fa fa-inbox"></i>
                                       <input type="text" value="" name="denumire" required>
                                       <b class="tooltip tooltip-bottom-right">Add Name</b>
                                   </label>
                               </section>
                           </dd>

                       </dl>
                   <hr>
                   <button type="submit" class="btn-u" style="float:right; margin-top:-5px;">Submit</button>
               </form>
           </div>
       </div>
   </div>
</div>

ajax :

Code:

<script type="text/javascript">
$(document).ready(function(){

   $("#sky-inchidere").submit(function(e){
       e.preventDefault();

       var tdata= $("#sky-inchidere").serializeArray();

       $.ajax({
           type: "POST",
           url: 'http://localhost/new/test/add',
           data: tdata,

           success:function(tdata)
           {
               alert('SUCCESS!!');
           },
           error: function (XHR, status, response) {
              alert('fail');
           }

       });
   });
});
</script>

controller ( I have added here the model just for test )

Code:

    public function add()    {
        $tdata = array(
          'denumire' =>  $this->input->post('denumire'),
        );
        $this->db->insert('clienti',$tdata);

    }

Website : www.my-web-projects.com