Question

I am trying to post data from my form to a jquery dialog that loads external content.

I am serializing the form data which works (appears in the url) but the dialog won’t open:

      $("#wavajax button").click(function() {
  $.post({url: 'player/index.php', data: $("#wavajax").serialize(), 
         success: function (data) {

                     $("#recordingdialog").load("player/index.php", [], function(){
               $("#recordingdialog").dialog("open");

                 }
  });
  return false;
});

What am I doing wrong, am I going about it the right way???

Answer 1

I think this is what you’re after:

$("#wavajax button").click(function() {
  $.post('player/index.php', $("#wavajax").serialize(), function (data) {
       $("#recordingdialog").html(data).dialog("open");
  });
  return false;
});

You’re already getting the HTML content back from the POST (or at least I would think this is the case), so just put that response in the #recordingdialog using .html() and then make the dialog call. If you’re not previously creating a dialog with options, then just .dialog() will suffice, .dialog('open') is intended for when you created the dialog earlier with various options and want to now open it, like this:

$("#recordingdialog").dialog({
  //other options, width, height, etc...
  autoOpen: false
});

You can find a full list of these options here