Form Cloning Unique id
-
01-07-2021 - |
Question
I want to clone a form and not have modification of that form effect the original form. How to I give each instance of the form a unique ID so that the elements are not duplicated?
$(document).ready(function() {
// shows / hides results based on selection
$(".categories-select").live("change", function() {
if ($(this).val() == 'dinner') {
$('.dinner').removeClass('hide');
// toggles dinner results, sub menus
$(this).parent('.controls').find('.restaurant-submenu-select').removeClass('hide');
}
});
// Duplicates category select menu
$(".add-activity").click(function() {
$(".activity-category")
.clone()
.removeClass('activity-category')
.appendTo("#we-want-to")
.find('.restaurant-submenu-select')
.addClass('hide');
});
$(".add-activity-alternate").click(function() {
$(".activity-category-alternate")
.clone()
.removeClass('activity-category-alternate')
.appendTo("#we-want-to")
.find('.restaurant-submenu-select, .results-table')
.addClass('hide');
});
});
Thank You!
Solution
When you clone add also a dynamic id
var id = 0;
(function() {
yourClone.attr('id', 'something-' + id);
id++
});
In your code something like that:
$(document).ready(function() {
var id = 0;
// shows / hides results based on selection
$(".categories-select").live("change", function() {
if ($(this).val() == 'dinner') {
$('.dinner').removeClass('hide');
// toggles dinner results, sub menus
$(this).parent('.controls').find('.restaurant-submenu-select').removeClass('hide');
}
});
// Duplicates category select menu
$(".add-activity").click(function() {
$(".activity-category")
.clone()
.removeClass('activity-category')
.appendTo("#we-want-to")
.find('.restaurant-submenu-select')
.addClass('hide')
.attr('id', 'something' + id);
id++
});
$(".add-activity-alternate").click(function() {
$(".activity-category-alternate")
.clone()
.removeClass('activity-category-alternate')
.appendTo("#we-want-to")
.find('.restaurant-submenu-select, .results-table')
.addClass('hide')
.attr('id', 'something' + id);
id++
});
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow