如何交换 2 @Html.DropDownListFor 和 Jquery/JS
How to swap 2 @Html.DropDownListFor with Jquery/JS
我在 SO 中找到了一些示例。但是 none 其中对我有用。我想互相交换 2 @Html.DropDownListFor
的值。除了要显示的默认值外,两个 DropDownList 都包含相同的一组值。下面是我的代码。
<div class="currency_swap">
<p>
<label>From</label>
<div class="swap_dropdown">
@Html.DropDownListFor(m => m.SourceCurrencyname, new SelectList(ViewBag.CurrencyNames, "Currency_Code", "Currency_Code"), "---- All ----")
</div>
</p>
<div><input type="button" id="swap_up" value="▲" class="swap" /></div>
<p>
<label>To</label>
<div class="swap_dropdown">@Html.DropDownListFor(m => m.TargetCurrencyname, new SelectList(ViewBag.CurrencyNames, "Currency_Code", "Currency_Code"), "Agency Currency")</div>
</p>
</div>
<script type="text/javascript">
$(".swap").click(function () {
var row = $(this).closest(".currency_swap");
var start = row.find("swap_dropdown:first select");
var end = row.find("swap_dropdown:last select");
var temp = start.val();
start.val(end.val());
end.val(temp);
});
</script>
start
和 end
变量设置不正确。选择器可能类似于以下内容。
var start = row.find(".swap_dropdown select:first");
var end = row.find(".swap_dropdown select:last");
其余代码有效,请参阅 js-fiddle here.
我在 SO 中找到了一些示例。但是 none 其中对我有用。我想互相交换 2 @Html.DropDownListFor
的值。除了要显示的默认值外,两个 DropDownList 都包含相同的一组值。下面是我的代码。
<div class="currency_swap">
<p>
<label>From</label>
<div class="swap_dropdown">
@Html.DropDownListFor(m => m.SourceCurrencyname, new SelectList(ViewBag.CurrencyNames, "Currency_Code", "Currency_Code"), "---- All ----")
</div>
</p>
<div><input type="button" id="swap_up" value="▲" class="swap" /></div>
<p>
<label>To</label>
<div class="swap_dropdown">@Html.DropDownListFor(m => m.TargetCurrencyname, new SelectList(ViewBag.CurrencyNames, "Currency_Code", "Currency_Code"), "Agency Currency")</div>
</p>
</div>
<script type="text/javascript">
$(".swap").click(function () {
var row = $(this).closest(".currency_swap");
var start = row.find("swap_dropdown:first select");
var end = row.find("swap_dropdown:last select");
var temp = start.val();
start.val(end.val());
end.val(temp);
});
</script>
start
和 end
变量设置不正确。选择器可能类似于以下内容。
var start = row.find(".swap_dropdown select:first");
var end = row.find(".swap_dropdown select:last");
其余代码有效,请参阅 js-fiddle here.