Get an html page using AJAX

[gilgimech]

So, I've been trying to get this to work all day. I make a button for the WordPress TinyMCE. I followed this tutorial.

http://www.garyc40.com/2010/03/how-t...user-friendly/.

This works great, but I want to clean it up by loading the HTML from another page instead of having it in the javascript.

here's the code I'm using.

jQuery(function($){
// this is the code I want to load from another file 
var form = jQuery('<div id="mygallery-form">\
  <table id="mygallery-table" class="form-table">\
    <tr>\
      <th><label for="href">Href</label></th>\
      <td><input type="text" id="codepen-href" name="href" value=""/><br />\
      <small>the codepen href</small></td>\
    </tr>\
    <tr>\
      <th><label for="mygallery-columns">Username</label></th>\
      <td><input type="text" id="codepen-user" name="user" value=""/><br />\
      <small>the codepen username</small></td>\
    </tr>\
    <tr>\
      <th><label for="mygallery-columns">Type</label></th>\
      <td><input type="text" id="codepen-type" name="type" value=""/><br />\
      <small>the codepen type</small></td>\
    </tr>\
  </table>\
  <p class="submit">\
    <input type="button" id="mygallery-submit" class="button-primary" value="Insert Gallery" name="submit" />\
  </p>\
</div>');

var table = form.find('table');
form.appendTo('body').hide();

form.find('#mygallery-submit').click(function(){
// Do other Stuff
});
})();

Now, I've never really got a good grasp on AJAX. I've tried every example I've found, but none of them seem to load the file.

I've been spending way too much time just getting this to work, so any help would be appriciated.

[DanInMa]

give this a try.

jQuery(function($){
// this is the code I want to load from another file 
var form = jQuery.get('/url/of/otherpage.htm #mygallery-table');

form.appendTo('body').hide();

jQuery.('#mygallery-submit').click(function(){
// Do other Stuff
});
})();