<script type="text/javascript">
$(document).ready(function(e) {
$("#department").on('submit' ,(function(e) {
e .preventDefault();
$("#message").empty();
$('#loading').show();
$ .ajax({
url : "control.php" , //Url to which the request issend
type : "POST" , //Type of request to be send,called as method
data : new FormData(this), //Data sent to server, a set of key/value pairs(i.e.form fields and values)
contentType : false, //The content type used when sending data to the server.
cache : false , //To unable request pages to be cached
processData : false, //To send DOMDocument or non processed data file it is set to false
beforeSend : function(){
            $('#loading').show();
        },
success: function(data) //A function to be called if request succeeds
{
$('#loading').hide();
document.getElementById('inputHere').innerHTML = data;
$('#myModal').modal('show');
document.getElementById('cname').value = "";
document.getElementById('ccode').value = "";
}
});
}));
});
</script>
                  <div class="x_content">
                    <form id="department" action ="" method ="post">
                            <div class="row">
                            <div class="col-md-3">
                            <div class="form-group">
                                <label for="cname" >Course Title</label>
                                <input type="text" name="cname" id="cname" placeholder="Course Title" class="form-control">
                            </div>
                            </div>
                            <div class="col-md-3">
                            <div class="form-group">
                                <label for="ccode" >Course Code</label>
                                <input type="text" name="ccode" id="ccode" placeholder="Course Code" class="form-control">
                            </div>
                            </div>
                            <div class="col-md-3">
                            <div class="form-group">
                                <label for="fname" >Under Department</label>
                                <select class="form-control" name="department">
                                    <option value="">Select Department</option>
                                    <?php
                                    $fetch = $conn->query("SELECT * FROM department ORDER BY name ASC");
                                    $result = $fetch->fetchAll(PDO::FETCH_OBJ);
                                    $count = $fetch->rowCount();
                                    if ($count > 0) {
                                    foreach ($result as $key) {
                                        $ident = $key->id;
                                        $name = $key->name;
                                    ?>
                                    <option value="<?php echo $ident ?>"><?php echo $name ?></option>
                                    <?php
                                    }
                                    }

                                    ?>
                                </select>
                            </div>
                            </div>
                            </div>
                            <button class="btn btn-success submit" type="submit" name="addcourse">Submit</button>
                            <span id="loading" style="display:none;"><img src="../img/loading.gif"></span>

                            </form>
                            </div>

<div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <div class="modal-body text-center">
        <div id="inputHere">

        </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>
        </div>
      </div>
    </div>
  </div>
</div>
