CODEWITHSUNDEEP
jqueryajaxpopup
venkatachalam
venkatachalam

Reputation: 102439

jQuery popup in Ajax

I am using jQuery and Ajax. When clicking the hyperlink, the associated document to be loaded in the popup menu works fine. The problem comes when I use Ajax.

My code

//index.html
....
jQuery.ajax({
    type: 'POST',
    url: ' my.php',
    data: 'one=' + one,

    success: function(data){
        jQuery("#another").load("load.html");

        //Pop up code for the Load.html
        jQuery("a[rel='pop']").click(function (e) {
            e.preventDefault();
            var features =  "height=700,width=800,scrollTo,resizable=1,scrollbars=1,location=0";
            newwindow=window.open(this.href, 'Popup', features);
            return false;
        });
    }//Success
}); //Ajax

Strategy: After seeing the hyperlink, the associated content will need to be displayed in the popup.

Load.html

<a href="pdf/file1.pdf" id="pop" rel="pop"> click 1.</a>
<a href="pdf/file2.pdf" rel="pop">click2</a>

Since Load.html dynamically loads in index.html, all tags associate with PDF files' links, and the load.html file will not display the document in the popup. How do I change my code to do the above output?

Upvotes: 0

Views: 5093

Answers (1)

KyleFarris
KyleFarris

Reputation: 17538

I think the problem you are having is that you aren't waiting for the content of load.html to finish loading via ajax. You need to setup a callback for that call in order to use it's content correctly.

Do this:

//index.html
....
jQuery.ajax({
     type:'POST',
     url:' my.php',
     data:'one='+one,
     success: function(data){
         jQuery("#another").load("load.html", function() { 
             //pop up code for the Load.html
             jQuery("a[rel='pop']").click(function (e) {
                 e.preventDefault();
                 var features = "height=700,width=800,scrollTo,resizable=1,scrollbars=1,location=0";
                 newwindow=window.open(this.href, 'Popup', features);
                 return false;
             });//click
         }//load
     });//success
});//ajax

That should solve your problem as I understand it.

Upvotes: 2

Related Questions