[英]Store mutiple options in dropdown for a selected value in MVC
我正在使用MVC,並使用ViewData處理值。 我在控制器中有代碼
IList<SelectListItem> sizeList = new List<SelectListItem>();
foreach (var item in sizeInfo)
{
SelectListItem listItem = new SelectListItem();
listItem.Value = item._price.ToString();
listItem.Text = item._sizeOption;
sizeList.Add(listItem);
}
ViewData["SizeList"] = sizeList;
productInstance.SizeCount = true;
但是如何與文本和值(即列表項的價格和大小選項)一起存儲基於下拉菜單中用戶選擇的其他值。
我的下拉菜單將此ViewData提取為
@Html.Raw(@Html.DropDownList("SizeList", ViewData["SizeList"] as SelectList, new { @id = "ddsize1" }))
如何根據用戶對特定下拉列表的選擇,添加除文本和值以外的其他屬性?
控制器:
您可以再列出一個列表,其中包含價格和所需的屬性。 將該列表放在視圖的隱藏字段中。
IList<SelectListItem> CustomList = new List<SelectListItem>();
foreach (var item in sizeInfo)
{
SelectListItem listItem = new SelectListItem();
listItem.Value = item.yourattribue.ToString();
listItem.Text = item._sizeOption;
sizeList.Add(listItem);
}
ViewData["CustomList"] = CustomList;
鑒於:
@using (Html.BeginForm())
{
<div id="divPrice1"style="display:none">
<table>
<tr>
<td class="divSizehPrice" style="text-align:right">@Html.Raw(@Model.dtcurrentCurrency.Rows[0]["HTMLENTITY"])</td>
<td class="divSizehPrice" style="width:24%; text-align:left; color:Red;"><div id="PriceDiv1"></div></td>
<td class="divSearchRRPPrice" style="text-align:right"><div id="divOffer">RRP @Html.Raw(@Model.dtcurrentCurrency.Rows[0]["HTMLENTITY"])</div></td>
<td class="divSearchRRPPrice" style="width:70%; text-align:left"><div id="PriceDiv2"></div></td>
</tr>
</table>
</div>
<table style="width:100%">
<tr>
@if (@Model.SizeCount == true)
{
<td><label>Size: </label></td>
<td>
<span style="display:none;">
@Html.DropDownList("CustomList", ViewData["customList"] as SelectList, new { @id = "ddPrice" })
</span>
@Html.Raw(@Html.DropDownList("SizeList", ViewData["SizeList"] as SelectList, new { @id = "ddsize1" }))
</td>
}
else
{
if (@Model.dtProduct.Rows[0]["Size"] != null)
{
if (@Model.dtProduct.Rows[0]["Size"].ToString().Length > 0)
{
<td colspan=2><p><label>Size:</label>@Model.dtProduct.Rows[0] ["Size"]</p></td>
}
}
}
</tr>
</table>
<br />
<a href="@Url.Action("Currency", "Product")">Change currency</a>
<br />
@Html.Hidden("ProductId", @Model.dtProduct.Rows[0]["ProductId"])
@Html.Hidden("ProductPriceId", @Model.dtProduct.Rows[0]["ProductPriceId"])
@Html.Hidden("ProductPrice", @APrice)
@Html.Hidden("tempPrice", null, new { @id = "tempPrice" })
@Html.Hidden("ddlSize",null, new { @id="ddlSizeId" })
<input type="submit" value="Add to Shopping Cart" data-theme="f" />
}
javascript / jquery:
<script type="text/javascript">
$('#ddsize1').change(function () {
var selectedValue = $('option:selected', $(this)).val();
var selectedText = $('#ddsize1 option:selected').text();
document.getElementById('ddlSizeId').value = selectedText;
var offerPrice = @Model.offerPrice;
if( offerPrice == 0)
{
var price = selectedValue * @Model.dtcurrentCurrency.Rows[0]["EXCHANGERATE"];
$("#priceTable1").hide();
document.getElementById('tempPrice').value=price.toFixed(2);
document.getElementById('PriceDiv1').innerHTML = price.toFixed(2);
$("#divPrice1").show();
$("#divOffer").hide();
// return false;
}
else{
var el = document.getElementById("ddPrice");
for(var i=0; i<el.options.length; i++)
{
var txtPrice = el.options[i].text;
var priceMatch = selectedValue * 1;
var MatchPrice = priceMatch.toFixed(2);
if ( txtPrice == MatchPrice ) {
$("#priceTable1").hide();
var txtOfferPrice = el.options[i].value * @Model.dtcurrentCurrency.Rows[0]["EXCHANGERATE"];
var txtOriginalPrice = el.options[i].text * @Model.dtcurrentCurrency.Rows[0]["EXCHANGERATE"];
document.getElementById('tempPrice').value = txtOfferPrice.toFixed(2);
document.getElementById('PriceDiv1').innerHTML = txtOfferPrice.toFixed(2);
document.getElementById('PriceDiv2').innerHTML = txtOriginalPrice.toFixed(2);
$("#divPrice1").show();
}
}
}
});
</script>
在型號中:
public string tempPrice {get;set;}
現在,您可以在控制器中訪問您的屬性。 我希望它將幫助您解決所有問題。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.