load several fragments at once with jquery .load()

Question

i am loading some fragments with jquery with following code

var box = $(this).closest(".product-contain").children(".title:first");
box.load(url + " .maintitle", data);
var box = $(this).closest(".product-contain").children(".detail:first");
box.load(url + " .alldetail", data);

(i don't want to load whole .product-contain at once, because part of it is being edited by user at the same moment)

but it does 2 requests to server for same content.

can i somehow do it with one request?

thanks!

Answer 1

You can do one $.get() and load the content where it goes yourself, like this:

 var pc = $(this).closest(".product-contain");
 $.get(url, data, function(html) {
   var resp = $(html);
   pc.children(".title:first").html(resp.find(".maintitle"));
   pc.children(".detail:first").html(resp.find(".alldetail"));
 });

This may look a little weird, but .html() with a jQuery object is a shortcut for .empty().append().