Jump to content

Clone Loosing Click Event


neilfurry
Go to solution Solved by neilfurry,

Recommended Posts

hi mate its me again asking questions on jquery clone.

 

As solved before, i have a form that contains rows that is being cloned. (works perfect).

Make a Copy of that form to the right side (Works great)

 

here is my problem, when i make a copy of that form to the right the click event is lost on the New Row button to the form on the right. can you help me with this?

Here is a working jsfiddle:

 

https://jsfiddle.net/mphur5eq/5/

Edited by neilfurry
Link to comment
Share on other sites

Cloning elements will not also clone event handlers.

 

1. Change your New button (preferably Copy too) to use a class instead of an ID. Remember: IDs must be unique so if you create a clone then you'll be duplicating the ID too and that's not good.

2. When DOM events happen in Javascript they happen to the original element as well as all parent elements. With .on you can apply an event handler to a parent that only fires for specific children that match a selector, whether they exist now or in the future. Use that to tie your New action to all buttons in the entire document that match that CSS class you picked.

Edited by requinix
Link to comment
Share on other sites

Hi Thank you for the response.

 

COPY button will be used only once. so the only change i made is in the New Row button which will be used multiple times so i make use class instead of id on it.

 

https://jsfiddle.net/mphur5eq/9/

 

however when i tested, when i clicked on the New Row button on the form on the right the left rows increases instead of the right row where the button is clicked

 

can you provide an edit to the jsfiddle.

 

thank you

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.