Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder dniwebdesign's Avatar
    Join Date
    Dec 2003
    Location
    Carrot River, Saskatchewan
    Posts
    841
    Thanks
    15
    Thanked 9 Times in 9 Posts

    Question jquery, $.get, and javascript on original page

    I have a page, which brings in some table rows via a jQuery $.get function, which works slick. The ajax php builds the rows and I append them to the original table. However, in the html I bring in I want to perform javascript on but it seems as though the javascript on the main page cannot find it. For example...
    On the original page I got something along the lines of: (I just alert it for demonstration purposes).
    Code:
    $('a').click(function() {
    		client = $(this).attr('id');
    		action = $(this).attr('rel');
                    alert(client." ".action);
    });
    On my html I bring in via the $.get I have:
    PHP Code:
     <td align="center" style="border-bottom: 1px solid #B7CBCF;">
                                              <?php echo "<a href='#' rel='suspend' id='".$row["id"]."' onclick='if (event.stopPropagation) {
                            event.stopPropagation();
                            }
                            event.cancelBubble = true;return true;'>Suspend</a> 
                            | 
                            <a href='#' rel='edit' id='"
    .$row["id"]."' onclick='if (event.stopPropagation) {
                            event.stopPropagation();
                            }
                            event.cancelBubble = true;return true;'>Edit</a>
                            | 
                            <a href='#' rel='edit' id='"
    .$row["id"]."' onclick='if (event.stopPropagation) {
                            event.stopPropagation();
                            }
                            event.cancelBubble = true;return true;'>Delete</a>
                            
                            
                            
                            
                            "
    ?></td>
    That is just one cell of the row that has the action links I need. However when I click on the link, the javascript does not fire. If I put this in the original page, it works fine but not when it comes via the ajax. How can I get this working?
    Dawson Irvine
    CEO - DNI Web Design
    http://www.dniwebdesign.com

  • #2
    Regular Coder dniwebdesign's Avatar
    Join Date
    Dec 2003
    Location
    Carrot River, Saskatchewan
    Posts
    841
    Thanks
    15
    Thanked 9 Times in 9 Posts
    No one?
    Dawson Irvine
    CEO - DNI Web Design
    http://www.dniwebdesign.com

  • #3
    Senior Coder
    Join Date
    Jan 2005
    Location
    Memphis, TN
    Posts
    1,785
    Thanks
    8
    Thanked 131 Times in 129 Posts
    "...but it seems as though the javascript on the main page cannot find it."
    That should point you in the right direction. Yo are defining a function and assigning it to an object that doesn't exist when the script loads.

    Try making it a function then firing that function from the .get part like so:


    Code:
    function clickyclicky() {
    	$('a').click(function() {
    		client = $(this).attr('id');
    		action = $(this).attr('rel');
                    alert(client." ".action);
    });
    }

    PHP Code:
     <td align="center" style="border-bottom: 1px solid #B7CBCF;">
                                              <?php echo "<a href='#' rel='suspend' id='".$row["id"]."' onclick='if (event.stopPropagation) {
                            event.stopPropagation();
                            }
                            event.cancelBubble = true;return true;'>Suspend</a> 
                            | 
                            <a href='#' rel='edit' id='"
    .$row["id"]."' onclick='if (event.stopPropagation) {
                            event.stopPropagation();
                            }
                            event.cancelBubble = true;return true;'>Edit</a>
                            | 
                            <a href='#' rel='edit' id='"
    .$row["id"]."' onclick='if (event.stopPropagation) {
                            event.stopPropagation();
                            }
                            event.cancelBubble = true;return true;'>Delete</a>
                            
                            <script type='text/javascript'>clickyclicky();</script>
                            
                            
                            "
    ?></td>
    Stop making things so hard on yourself.
    i is tugbucket :: help raise tugburg :: Whitehaven Kiwanis

  • #4
    bdl
    bdl is offline
    Regular Coder
    Join Date
    Apr 2007
    Location
    Camarillo, CA US
    Posts
    590
    Thanks
    4
    Thanked 83 Times in 82 Posts
    I'm curious to see what the markup result of your PHP code is; are you sure the vars are being interpreted and the id values are there?


  •  

    Posting Permissions

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