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 5 of 5
  1. #1
    Regular Coder
    Join Date
    Jun 2009
    Posts
    141
    Thanks
    3
    Thanked 20 Times in 20 Posts

    jquery .append() with <script> string

    I am wanting to append a div with an html string. However I also need to include jquery for that div to use where it is appended to. The append function is readying the jquery instead of just using it as a string.

    In php you cancel out such events with a back space. Is there a way to do the same??

    Some example code

    PHP Code:
    <script>    
    $(
    "#addNow_{$row['id_item']}").click(function () {
    $(
    "#holder_{$row['id_item']}").append("$data");
    });
    </script> 
    $data that works includes
    PHP Code:
    <div id="holder_{$row['id_item']}\"><!-- Product group holder --><div id=\"iten_content\">TEST</div></div> 
    However when attempting to include the below as part of $data it fails, and I believe the cause it is taking the jquery string literally as oppose to as a string.

    PHP Code:
    $("#delete_{$row['id_item']}\").click(function () {
    $(\"#holder_{$row['id_item']}\").remove();
    }); 
    Any help much appreciated!

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,629
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    I’m not quite sure what you are trying to achieve but I’m pretty sure your approach is wrong. Why would you append jQuery code to an element? You should always strive for maximum separation of content and function and have your scripts in external files. Can you tell us a little more about the context in which you want to use this?

  • #3
    Regular Coder
    Join Date
    Jun 2009
    Posts
    141
    Thanks
    3
    Thanked 20 Times in 20 Posts
    I have an order that loads up with an overseeing div for every item, each item has some jquery so that the buttons for each of the menus (you can see in the pic) function correctly. All works correctly from page load where the default items are pulled from the DB.



    However I also have a box that pulls products of a certain criteria that can be added to the order. This button then injects through append() the exact same row data from above and thus the product is added to the page without any reloads/ajax required. When passing the html layout of the item through append it works correctly, however it simply wont push through jquery, and as stated above every item row has its own 3 lines of jquery to 1) Make the UI menu start, hence it not being styled in the photo & 2) make the functions of those menu buttons work.

    I know that the problem relates to passing through jquery in the append() method. Unfortunatley I do not understand how one can escape the jquery until its appended into the parent div. Hope that’s a little clearer. So the question is, is it possible to append jquery as a string??
    Regards

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,629
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    First of all, if you are appending the same rows then it’s probably best to clone() a row, make the necessary modifications, and then append it. You can clone it with any events that are attached. Also, instead of using click() which won’t work for elements added dynamically, you should look into on().

  • #5
    Regular Coder
    Join Date
    Jun 2009
    Posts
    141
    Thanks
    3
    Thanked 20 Times in 20 Posts
    Quote Originally Posted by VIPStephan View Post
    First of all, if you are appending the same rows then it’s probably best to clone() a row, make the necessary modifications, and then append it. You can clone it with any events that are attached. Also, instead of using click() which won’t work for elements added dynamically, you should look into on().
    Great thanks, and sorry I am using on() not click(), thanks for the advice. From this I am getting that your suggestion would be to clone the script portion as apposed to injecting it. I will give it a go, and report back. Cheers


  •  

    Posting Permissions

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