Question

Is there a way to make this code smaller into 1 block?

$('#product INPUT:checked').each(function () {
         data.box1.push({
              id: $(this).attr("id")
         });
});


$('#product .dropSelect OPTION:selected').each(function () {           
      data.drops.push({
            value: $(this).val()
      });
});


$('#product .setSelect OPTION:selected').each(function () {           
      data.set.push({
           value: $(this).val()
     });
});

Answer 1

Well, you can combine the second and third blocks easily using a test:

$('#product OPTION:selected').each(function () {           
    if ($(this).parent().hasClass("dropSelect")) {
        data.drops.push({
            value: $(this).val()
        });
    } else if ($(this).parent().hasClass("setSelect")) {
        data.set.push({
            value: $(this).val()
        });
    } // end if
});

While this isn’t much shorter, it has the advantage of saving jQuery the trouble of selecting elements using classes, which is more intensive than selecting IDs or tags. By testing the existence of a class on a single element instead of on the entire document, you should improve your overall performance. (Granted it probably won’t be a noticeable improvement, but optimization is rarely a bad thing.)