jQuery将.each（）函数放在.click（）函数中

Question

The .each() functions inside the .click() are not running. I do not know how to structure them to make it syntactically correct so jQuery will recognize and run them.

I tried tacking them on before the closing }); but I either didn't do it right or that isn't how it's done. I tried Googling but other than my topic title I was at a loss for what to search. I did try jquery function inside function but that turned out to be a lost cause.

EDIT: I have managed to get the first one to fire properly ( //POST specials ) however, the second one still isn't working. I even tried to put the extras POST inside the .ajax() of the specials and it didn't work.

$('.class').find('#button').click(function() {

        //all kinds of variables here

        var dataString = {//variables:variables}
        console.log(dataString);

        $.ajax({
            type: "POST",
            url: "classes/reserve.php",
            data: dataString,
            cache: false,
            success: function(html)
            {
                //POST specials
                $('#specialscheck input:checked').each(function() {
                    var reservation = $('#reservation').val();
                    var special = parseInt($(this).attr('id'));
                    dataString = {reservation:reservation, special:special};
                    console.log(dataString);
                    $.ajax({
                        type: "POST",
                        url: "classes/insert_specials.php",
                        data: dataString,
                        cache: false,
                        success: function(html)
                        {
                            //$('.unitinfolist').html(html);
                        }
                    }); 
                });

                //POST extras
                $('#extrascheck input:checked').each(function() {
                    var reservation = $('#reservation').val();
                    var extra = parseInt($(this).attr('id'));
                    dataString = {reservation:reservation, extra:extra};
                    console.log(dataString);
                    $.ajax({
                        type: "POST",
                        url: "classes/insert_extras.php",
                        data: dataString,
                        cache: false,
                        success: function(html)
                        {
                            //$('.unitinfolist').html(html);
                        }
                    }); 
                });
            }
        });
    });

Answer 1

You should move the .each up into the success function of the jquery post, or set its async: false , to follow this pattern.

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType,
  async:false
});