我有一个复制/克隆选择下拉列表并使用Choosen Jquery插件和多选插件的按钮。第一个元素显示完美,但是当我单击按钮并复制我无法从选择列表中选择的元素时。所以只有表单字段的第一个实例才有效,而不是之后添加的其他实例。
如果我有不同的ID,它将起作用,但同样的ID会发生。任何帮助如何解决这个问题都是适当的。
cmake_minimum_required(VERSION 3.3)
project(TB2)
set(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -std=c++11 ")
set(CMAKE_C_FLAGS "-std=c99 -static-libgcc -w -lpthread -lws2_32 -fopenmp -lwsock32")
set(SOURCE_FILES main.c r2nat_to_local.h mongoose.c mongoose.h sqlite3.c sqlite3.h TUtility.c TUtility.h cJSON.c cJSON.h url_parser.c url_parser.h)
add_executable(TB2 ${SOURCE_FILES})
target_link_libraries(TB2 sqlite3)
add_definitions(-DUNICODE -D_UNICODE -DMG_ENABLE_THREADS -DDEBUG -DDEBUG -DHAVE_MD5 -DRA100)
html
<script>
$(document).ready(function(){
$("#example").multiselect();
});
$(document).ready(function() {
var max_fields = 20; //maximum input boxes allowed
$(".add_field_button").click(function(e){ //on add input button click
e.preventDefault();
var add_button = $(this);
var fieldset = add_button.closest('fieldset');
var wrapper = add_button.closest('.sf-viewport');
var form = add_button.closest('form');
var x = parseInt(fieldset.attr('data-count'));
//var cur_height = 0;
var fieldset_clone;
var fieldset_content;
var viewport_height = 0;
var fieldset_cont = add_button.closest('.sf-step');
if(x < max_fields){ //max input box allowed
//text box increment
fieldset.attr('data-count',x+1);
console.log($(this).siblings().length);
var cur_height = (fieldset_cont.height() * 1 - 99) / ($(this).siblings().length-1);
viewport_height = wrapper.height()*1 + cur_height;
fieldset_cont.height( fieldset_cont.height()*1 + cur_height );
wrapper.height(viewport_height);
fieldset_clone = add_button
.closest('fieldset')
.find('.fieldset-content')
.eq(0)
.clone();
fieldset_clone
.find('[name]')
.each(function(){
$(this).val($(this).prop('defaultValue'));
});
fieldset_content = $('<div>')
.addClass('lol')
.append(fieldset_clone.children());
add_button.before(fieldset_content);
// add remove button
add_remove_btn(fieldset_content);
}
});
function add_remove_btn(item){
item.prepend(
'<a class="btn pull-right om-remove btn-danger" href="#">'+
' <div class="small" style="position:relative; z-index:999;">Slett tidsforbruk</div>'+
'</a>'
);
}
//user click on remove text
$(document).on("click",".om-remove", function(e){
e.preventDefault();
var x = parseInt($(this)
.closest('lol')
.attr('data-count')
);
$(this)
.closest('lol')
.attr('data-count',x-1);
$(this)
.closest('.lol')
.slideUp(function(){
$(this).remove()
})
var height = $(this).closest('lol').height();
var add_button = $(this);
var viewport_height = 0;
var fieldset_cont = add_button.closest('.sf-step');
var wrapper = add_button.closest('.sf-viewport');
var cur_height = (fieldset_cont.height() * 1 - 99) / ($(this).parent().siblings().length-1);
viewport_height = wrapper.height()*1 - cur_height;
fieldset_cont.height( fieldset_cont.height()*1 - cur_height );
wrapper.height(viewport_height);
});
});
</script>
答案 0 :(得分:0)
你说明了我的暗示。两个对象具有相同的ID。尝试更改新对象/选择的ID。您可以删除其ID,然后使用.uniqueId()
创建一个新ID答案 1 :(得分:0)
您好我做了一个简单的演示,看起来像您的要求让我知道吗? Here is my Fiddle 如果对于不同的id,你的多选择正在工作,那么你可以这样做,首先克隆你的多选,然后改变那个id属性,并基于新的id调用multiselect()方法。
我这样做了:
$(document).ready(function () {
$('#example-getting-started').multiselect();
});
$('.copymultiselect').on("click",function(){
var t=new Date().getTime();
var copied=$('.common:first').clone();
var abc=copied.attr('id','x_'+t);
$('.multiselect_list').append(abc);
$('#x_'+t).multiselect();
});
&#13;
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="multiselect_list">
<select id="example-getting-started" multiple="multiple" class="common">
<option value="cheese">Cheese</option>
<option value="tomatoes">Tomatoes</option>
<option value="mozarella">Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>
<button class="copymultiselect">copy</button>
</div>
&#13;
请问是对的吗?