Knockoutjs DropDownList с ViewBag

У меня есть SelectList, который хранится в моем ViewBag, и я хочу использовать Knockout js.Knockoutjs DropDownList с ViewBag

Это мой взгляд до сих пор при использовании моего списка ViewBag без каких-либо Js

@model IEnumerable<Site.Models.TicketsOrdered> 
<head> 
<title>Order</title> 
<link rel="stylesheet" href="~/Content/TableSheet.css"> 
@using GeogSocSite.Models 
</head> 
<body> 
<h1>Choose Your Tickets</h1> 
<table align="center" cellspacing="2" border="1" data-bind='visible: gifts().length > 0'> 
    <thead> 
    <tr> 
     <th align="center">Description</th> 
     <th align="center">Price</th> 
     <th align="center">Add</th> 
    </tr> 
    </thead> 
    <tbody> 
      @foreach (Site.Models.Ticket t in ViewBag.listTickets) 
      { 
      <tr> 
       <td align="center">@t.Description</td> 
       <td align="center">@t.Price</td> 
       <td align="center">@Html.DropDownList("Quantity", (IList<SelectListItem>)ViewBag.Quantities) </td> 

      </tr> 
      } 
    </tbody> 
</table> 
<div id="proceed"> 
    @Html.ActionLink("Proceed", "Order", "Order") 
</div> 
<div> 
    @Html.ActionLink("Back to List", "Index","Events") 
</div> 

</body>

Я хочу, чтобы иметь возможность сохранить значения, выбранные из DropDownList при нажатии кнопки продолжения нажата

У меня есть посмотрел документацию на нокаут js и посмотрел примеры, но многие ссылаются на каскадные выпадающие списки или выпадающие списки, которые только что созданы в представлении, как в примере, который я нашел здесь

@model IEnumerable<Site.Models.TicketsOrdered> 
<head> 
<title>Order</title> 
<link rel="stylesheet" href="~/Content/TableSheet.css"> 
@using GeogSocSite.Models 
</head> 
<body> 
<h1>Choose Your Tickets</h1> 
    <tr> 
    <td class="label">Drop-down list:</td> 
    <td><select data-bind="options: optionValues, value: selectedOptionValue"></select></td> 
</tr> 
    <tr> 
     <td class="label">Selected option:</td> 
     <td data-bind="text: selectedOptionValue"></td> 
    </tr> 
<div id="proceed"> 
    @Html.ActionLink("Proceed", "Order", "Order") 
</div> 
<div> 
    @Html.ActionLink("Back to List", "Index","Events") 
</div> 

</body> 
<script type="text/javascript"> 
var viewModel = { 
optionValues : ["Alpha", "Beta", "Gamma"], 
selectedOptionValue : ko.observable("Gamma"), 

}; 
ko.applyBindings(viewModel); 
</script>

Если кто-то может помочь мне тренироваться, как использовать Knockoutjs и список ViewBag.quantities, чтобы выбранные количества могли быть сохранены, когда вы нажимаете кнопку «ОК», это было бы здорово, поскольку я полностью застрял!

источник

2016-01-06 CatherineG

Вам просто нужно пройти data-bind к Html Helper он принимает htmlAttributes, так:

@Html.DropDownList("Quantity", (IList<SelectListItem>)ViewBag.Quantities,"", new {data_bind=" value: selectedOptionValue"});

Ваш код будет так:

<h1>Choose Your Tickets</h1> 
    <tr> 
    <td class="label">Drop-down list:</td> 
    <td>@Html.DropDownList("Quantity", (IList<SelectListItem>)ViewBag.Quantities,"", new {data_bind=" value: selectedOptionValue"});</td> 
</tr> 
    <tr> 
     <td class="label">Selected option:</td> 
     <td data-bind="text: selectedOptionValue"></td> 
    </tr> 
<div id="proceed"> 
    <a data-bind="attr:{href: "@Url.Action("Order","Order")/"+ selectedOptionValue()}">Proceed</a> 
    <!-- Or with querystring !--> 
    <!-- <a data-bind="attr:{href: "@Url.Action("Order","Order")?quantity="+ selectedOptionValue()}">Proceed</a>!-->  
</div> 
<div> 
    @Html.ActionLink("Back to List", "Index","Events") 
</div> 

</body> 
<script type="text/javascript"> 
    (function(){ 
     var viewModel = { 
      selectedOptionValue : ko.observable(), 
     }; 
     ko.applyBindings(viewModel); 
    })(); 
</script>

источник

2016-01-06 21:55:19

спасибо за вашу помощь, то, мне нужно будет добавить скрипт нокаута, если я использую Html Helper, чтобы сохранить выбранное количество после нажатия кнопки «Продолжить»? Благодарю. Я знаю, что я не могу использовать форму для отправки данных, потому что будет отправлено несколько количеств. – CatherineG

@CatherineG обновляю свой ответ, не забывайте отмечать как corect. –

Knockoutjs DropDownList с ViewBag

ответ

Смежные вопросы