jQuery Forum

If you are using content pulled in via AJAX you'll want to look at on() (versions 1.7+)

Thanks Jay. I've been testing out the on() which has been interesting.

What I've discovered is this. I have two AJAX ways of loading pages into my main content div. One way is by using a jQuery ajax function (get()) and the other way is using my home grown ajax loader.

The jQuery one is used to load content 'screens' when called from the main menu. Some of those 'screens' also contain links which provide shortcuts to screens which might normally be loaded via the main menu.

I have observed that when I load a page using the jQuery get() method, the tool tips work nicely and any code in script tags in that content is executed and available, but when I have loaded a page using my ajax loader, even though the script is returned in the request and is sent with everything else to #contentMAIN.innerHTML, the scripts do not run.

This makes me think that jQuery must be doing something special to it, to make it run-able?

If I put the following at the bottom of the retrieved content

1. <script type="text/javascript">
         alert('events attached');
   </script>
   

it only runs when the page is loaded via the jQuery method not mine.

My home grown ajax loader is below, but how can this be the problem?

1. function ajaxLoader(url,id)
   {
       // declare vars
       var request ;
       var el ;
       var helpURL ;
       var append ;
       var myRand ;
       var modurl ;
   
       var params = '';
       if (((url.indexOf('create.quotation') > -1) || (url.indexOf('create.invoice') > -1) || (url.indexOf('enter.sales.receipt') > -1)) && (url.indexOf('frompage=1') > -1))
       {
           var formElements = document.formSearch.elements;
           //var pn = document.getElementById('pagenum').value;
          
           //if (pn=='')
           //    pn = 1;
              
           for (var i = 0; i < formElements.length; i++)
           {
               var elem        = formElements[i];
               var elemID        = formElements[i].id;
               var elemType    = formElements[i].type;
               var elemValue    = formElements[i].value;
          
               if (elemType=='checkbox')
               {
                   if (elem.checked)
                   {
                       if (params=='') params = elemID + "=1";
                       else params = params + "&" + elemID + "=1";
                   }
               }
               else
               {
                   if (params=='') params = elemID + "=" + elemValue;
                   else params = params + "&" + elemID + "=" + elemValue;
               }
           } // end for loop
          
           params = params + "&filter=1";   
       }
      
       if (document.getElementById)
       {
           request = getXMLHttpRequest();
       }
      
       if (request)
       {
           request.onreadystatechange = function()
           {
               if (request.readyState == 4 && request.status == 200)
               {
                   el = document.getElementById(id);
                  
                   // Check whether we've received a session timeout notification.
                   if (request.responseText=='session-timeout') {
                       // timeout received, so redirect to login.
                       window.location="index.php"
                   }
                  
                   el.innerHTML = request.responseText;
                  
                   // reset scroll to top.
                   document.getElementById('main').scrollTop=0;
                   document.getElementById('helpCont').scrollTop=0;
                  
                   // load synchronized help in Right side
                   // only run once per page load!
                   if (id != 'help')
                   { // it was not a help page load
                       helpURL = url.replace( "main", "help" );
   
                       if (url.indexOf('main/') > -1)
                           ajaxLoader(helpURL,'help');
                      
                       if (url.indexOf('frompage=1') > -1)
                       {
                           if (url.indexOf('quotation.list') > -1)
                           {
                               showQuotations('1');
                           }
                           else if (url.indexOf('invoice.list') > -1)
                           {
                               showInvoices('1');
                           }
                           else if (url.indexOf('sales.receipt.list') > -1)
                           {
                               showSalesReceipts('1');
                           }
                       }
                   }
               }
           };
      
       // determine whether url is already followed with '?'. If so change '?rand'
       // to '&rand'.
       append = (url.indexOf('?') > -1) ? '&' : '?'; 
       // get server text
       myRand = parseInt(Math.random()*999999999999999, 10);
       if (((url.indexOf('create.quotation') > -1) || (url.indexOf('create.invoice') > -1) || (url.indexOf('enter.sales.receipt') > -1)) && (url.indexOf('frompage=1') > -1))
       {
           modurl = url+append+"rand="+myRand+"&"+params;
       }
       else
       {
           modurl = url+append+"rand="+myRand;
       }
       //alert(modurl);
       request.open("GET", modurl, true);
       request.send(null);
       }
   }
   

I did try using "on" and it did work but only when using the jQuery loader. When not using the jQuery loader, even an alert won't run and I guess that's why that doesn't either.

Thanks again.Jay.



Peter
A Linux Admin

Willing to help maintain Linux servers remotely for a tiny consideration into my Paypal account :-)

If your first example, which is not jQuery at all, doesn't run then there is something else going on. I don't see anything obvious in your loader.