SitePoint Sponsor

User Tag List

Results 1 to 5 of 5

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jan 2014
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jQuery class not trigger after ajax

    Hi there,

    I had searched everywhere but not able to find the solutions for my current problem. Appreciate if any could help me out. Thanks in advance.

    Using "class" to trigger jQuery. The code works on first html load but after sub-page reload thru ajax, the "class" no longer trigger. However, if using 'click', it still trigger. I want it to trigger whenever a "class" name is defined like first load.

    Test codes are as follow:

    HTML Head section
    Code:
    <script language="javascript" type="text/javascript">
    $(document).ready(function(){
    $('body').on('click','.clickMe',function(){
    	alert("Click Ok!");
    });	 
    });
    
    
    $(document).ready(function(){
    $('.alertMe').each( function(){
       alert('Alert Ok!');
    });
    });
    
    </script>

    in HTML Body section Div class

    Code:
    <div id="click1" class="clickMe">Click me to trigger</div>
    <div id="alert1" class="alertMe">Alert Me</div>


    ClickMe works even printing same div with same class after ajax called.

    However, alertMe will execute on first page load, after ajax call, any div class print will not trigger.

    Hope someone can help me out here. Thanks.

  2. #2
    SitePoint Member
    Join Date
    Jan 2014
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    * UPDATE *

    My current solution for after ajax call is to put the jQuery in a function. Therefore, whenever after ajax is called, will use js to call/trigger this function to update. Is this how it should be done? Or there are better ways? of using actual jQuery DOM or something?

  3. #3
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,191
    Mentioned
    191 Post(s)
    Tagged
    2 Thread(s)
    Hard to say. What does the ajax function look like / do ?

  4. #4
    SitePoint Member
    Join Date
    Jan 2014
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm using ajax to call a perl script to print the dynamic content where there will have html codes with "class" defined. Basically just this 2 lines of DIV codes will do

    Code:
    <div id="click1" class="clickMe">Click me to trigger</div>
    <div id="alert1" class="alertMe">Alert Me</div>
    clickMe still are able to trigger in dynamic content print out.

    alertMe not trigger. I need this to trigger so it can auto update the style defined which act like CSS.


    Any kind of ajax call should do as topic here is not about ajax function. It is just after ajax dynamic content printed with "class", the jQuery does not trigger as like usual CSS class does.

  5. #5
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,191
    Mentioned
    191 Post(s)
    Tagged
    2 Thread(s)
    If the ajax callback is altering the DOM in any way, especially the links that no longer work, the ajax code could have everything to do with the problem.


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •