jQuery placing .each() functions inside a .click() function

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);
                        }
                    }); 
                });
            }
        });
    });

In a general sense you can put an .each() inside any function including a click handler. Are you sure $('.checkboxes1 input:checked') is using the correct selector? If no elements match that selector the .each() wouldn't do anything. If those elements are created by your initial Ajax call they won't exist yet when the .each() statement occurs. You could test how many elements match with console.log($('.checkboxes2 input:checked').length). Perhaps you could show some of your html? (Or provide a demo for us at jsfiddle.net.) — nnnnnn
– nnnnnn, Commented Nov 9, 2013 at 21:07

Christian Phillips · Accepted Answer · 2013-11-09 20:56:03Z

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
});

answered Nov 9, 2013 at 20:56

Christian Phillips

18.8k8 gold badges55 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Burning Hippo Over a year ago

I tried what you said and it halfway worked. I have edited my question to reflect my changes.

Christian Phillips Over a year ago

Remember to set the async:false too

Collectives™ on Stack Overflow

jQuery placing .each() functions inside a .click() function

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related