jquery AJAX Post不工作​​的Codeigniter

Question

I am currently learning jquery AJAX, i am trying to change my standar php post to AJAX but not working, it's still prosses with php, not AJAX. Not even in the console show anything. Can anyone check my code ? I am using Codeigniter. And you can asume the php part is working fine ..

HTML :

<form action="<?=base_url()?>operator_pt/unggah/unggah_semua" id="unggahsemua" method="POST" name="unggahsemua" role="form">

  <?php  foreach($data as $rod)
  $tahun = $rod->id_smt;
  $jurusan = $rod->id_sms;
    ?>
    <div id="form-tahun" class="form-group">
     <input type="hidden" class="form-control" id="tahun" name="tahun" value="<?php echo $tahun;?>">
     </div>
     <div id="form-jurusan" class="form-group">
     <input type="hidden" class="form-control" id="jurusan" name="jurusan" value="<?php echo $jurusan;?>">       
        </div>
         Sedang Mengunggah :

        <div id="statmhs"> </div>
        <div id="statidmhs"> </div>
        <div id="statdsnpt"> </div>

<i class="fa fa-circle-o-notch fa-spin" style="font-size:24px"></i>   

JS :

$(document).ready(function() {

    $('#unggahsemua').submit(function(event) {

        $('.form-group').removeClass('has-error'); 
        $('.help-block').remove();

        var formData = {
             'tahun'              : $('input[name=tahun]').val(),
            'jurusan'             : $('input[name=jurusan]').val(),
        };

        // process the form
        $.ajax({
            type        : 'POST',
            url         : '<?=base_url()?>operator_pt/unggah/unggah_semua', // the url where we want to POST
            data        : formData, 
            dataType    : 'json', 
            encode      : true
        })

            .done(function(data) {


                console.log(data); 

                $('#statmhs').append('<div class="help-block">' + data.infounggahmhs + '</div>');
                $('#statidmhs').append('<div class="help-block">' + data.infounggahidmhs + '</div>');
                $('#statdsnpt').append('<div class="help-block">' + data.infounggahdsnpt + '</div>');


            .fail(function(data) {


                console.log(data);
            });


        event.preventDefault();
    });

});

Answer 1

You have errors in your Javascript code..

You missed the closing brackets before the .fail method. Also you had an extra comma after the last entry of your formData object

Try changing to this:

$(document).ready(function () {   
    $('#unggahsemua').submit(function (event) {
        $('.form-group').removeClass('has-error');
        $('.help-block').remove();

        var formData = {
            'tahun': $('input[name=tahun]').val(),
            'jurusan': $('input[name=jurusan]').val()
        };

        // process the form
        $.ajax({
            type: 'POST',
            url: '<?=base_url()?>operator_pt/unggah/unggah_semua', // the url where we want to POST
            data: formData,
            dataType: 'json',
            encode: true
        })    
        .done(function (data) {
            console.log(data);

            $('#statmhs').append('<div class="help-block">' + data.infounggahmhs + '</div>');
            $('#statidmhs').append('<div class="help-block">' + data.infounggahidmhs + '</div>');
            $('#statdsnpt').append('<div class="help-block">' + data.infounggahdsnpt + '</div>');
        })
        .fail(function (data) {
            console.log(data);
        });
        event.preventDefault();
    });
});