У меня есть два dropdownlists, а именно ddlCountry и ddlState. Я использую метод jquery clone() для создания динамических элементов управления dropdownlist для dropdownlists ddlCountry и ddlState.Получить значение выбранных элементов в динамически создаваемом списке выпадающего списка в массив
Вот мой код:
<body>
<form id="form1" runat="server">
<asp:Panel ID="ddlPanel" runat="server">
<div>
<asp:Button ID="btnClone" Text="Clone" runat="server" />
</div>
<br />
<br />
<table>
<tr>
<td>Cateogry:
</td>
<td>
<div>
<asp:DropDownList ID="ddlCountryList" runat="server" class="ddlCountryClass"></asp:DropDownList>
</div>
</td>
<td>SubCategory:
</td>
<td>
<div>
<asp:DropDownList ID="ddlStateList" runat="server" class="ddlStateClass"></asp:DropDownList>
</div>
</td>
</tr>
<tr>
<td>
<div id="target">
</div>
</td>
<td>
<div id="target2">
</div>
</td>
</tr>
</table>
<asp:Button ID="btnGet" runat="server" Text="Get Values" OnClick="GetDropDownListValues" />
</asp:Panel>
</form>
<script type="text/javascript">
$(function() {
$("[id*=btnClone]").bind("click", function() {
var index = $("#target select").length + 1;
//Clone the DropDownList
var ddl = $("[id$=ddlCountryList]").clone(true);
//Set the ID and Name
ddl.attr("id", "ddlCountryList_" + index);
ddl.attr("name", "ddlCountryList_" + index);
ddl.append('<option selected="selected" value="0">Select Country</option>');
//[OPTIONAL] Copy the selected value
var selectedValue = $("[id$=ddlCountryList] option:selected").val();
ddl.find("option[value = '" + selectedValue + "']").attr("selected", "selected");
//Append to the DIV.
$("#target").append(ddl);
$("#target").append("<br /><br />");
return false;
});
});
$(function() {
$("[id*=btnClone]").bind("click", function() {
var index = $("#target2 select").length + 1;
var ddl = $("[id$=ddlStateList]").clone();
ddl.attr("id", "ddlStateList_" + index);
ddl.attr("name", "ddlStateList_" + index);
var selectedValue = $("[id$=ddlStateList] option:selected").val();
ddl.find("option[value = '" + selectedValue + "']").attr("selected", "selected");
$("#target2").append(ddl);
$("#target2").append("<br /><br />");
return false;
});
});
// Make Ajax call to fetch the state values.
$(function() {
$('#ddlStateList').attr('disabled', 'disabled');
$('#ddlStateList').attr('disabled', 'disabled');
$('#ddlStateList').append('<option selected="selected" value="0">Select State</option>');
$('#ddlCountryList').change(function() {
var $countryDropdown = $(this); // "this" is the event source
var country = $countryDropdown.val();
// Figure out the index of the country dropdown
var index = $countryDropdown.attr('id').split("_")[1] || "";
if (index) {
index = "_" + index;
}
var $stateDropdown = $("#ddlStateList" + index);
$stateDropdown.removeAttr("disabled");
$.ajax({
type: "POST",
url: "Default.aspx/BindStates",
data: "{'country':'" + country + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
var j = jQuery.parseJSON(msg.d);
var options;
for (var i = 0; i < j.length; i++) {
options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>'
}
$stateDropdown.html(options)
},
error: function (data) {
alert('Something Went Wrong')
}
});
});
});
</script>
Я хочу, чтобы сохранить выбранное значение каждого в DropDownLists стран (не ddlstate), таких как ddlCountry, ddlcountry_1, ddlcountry_2 и так далее .. .. в массиве.
Как я могу это достичь?
Если вы можете сделать jsfiddle с минимальным кодом, чтобы продемонстрировать ваши потребности, это было бы полезно. –
На самом деле, dropdownlists являются элементами управления asp.net. поэтому я не уверен, что они будут работать на jsfiddle или нет. Я попытался скопировать эту скрипку там, но это не сработало. Но здесь он будет создавать dropdownlists на основе нажатия кнопки с добавлением id на один и сделать ajax-вызовы из страны ddl, чтобы она была объявлена (мы можем забыть эту часть). Я мог бы, конечно, пройти через него, но есть еще один раскрывающийся список типа состояния. Итак, как я могу хранить значения типа граф в массиве? – Ninja
Попробуйте сделать 'ClientIDMode =" Static "'. И тогда '$ ("# ddlCountryList option: selected"). Val()' даст вам выбранные значения. Это помогает? –