2

さて、リストボックスでビューモデルを使用しようとしています。リストボックスにアイテムを追加してフォームを投稿すると、それらのアイテムはビューモデルを介してアクションに引き継がれます。

ViewModel:

public virtual ICollection<Sku> Skus { get; set; }  //This is this items sku's
public virtual ICollection<Sku> AllSkus { get; set; } //This is all sku's

私のリストボックスは次のようになります。

@Html.ListBoxFor(m=>m.Skus, new MultiSelectList(Model.Skus, "Id", "Name"), new { id = "skuList", style="width: 200px; height: 100px" })

すべてのSKUでいっぱいのテーブルがあり、1つを選択すると、jqueryを使用してリストボックスに追加されます。(以下にすべてのコードを投稿します)

私の受信アクション(skusはnullです):

    [HttpPost]
    public ActionResult AddProductOffering(ProductOfferingModel model)
    {

        return View(model);
    }

アイテムはリストボックスに問題なく追加されていますが、投稿後もモデルはnullのままです。

明らかに、私はモデルではなくリストボックスを更新しているだけです。この方法で2つを結び付ける方法がわかりません。

どんな助けでも大歓迎です、ありがとう!

(更新)完全な.cshtmlファイル:

@using Web.ControlPanel.Helpers
@model Web.ControlPanel.ViewModels.Offering.ProductOfferingModel

@using (Html.BeginForm())
{

<h2>Product Offering</h2>
<br />

@Html.LabelFor(m => m.Name)
@Html.EditorFor(m => m.Name)

<br />
<br />

<label>Offerings Skus</label><br/>

@Html.ListBoxFor(m=>m.Skus, new MultiSelectList(Model.Skus, "Id", "Name"), new { id = "skuList", style="width: 200px; height: 100px" })

<br/><br/>

<button class="button" type="submit" value="Save">Save</button>

<br/><br/><br/>

<h3>All Skus</h3>

<p>
    Search: @Html.TextBox("skuFilter")
    <input type="submit" value="Search Skus" name="search" />
</p>

<table class="onepx" style="width: 80%">
    <tr>
        <td colspan="4" style="text-align: right;">
            @Html.Pager("List", Model.SkuPager, 3, (string)ViewBag.SkuFilter)
        </td>
    </tr>
    <thead>
        <tr style="font-weight: bold;">
            <td>Product</td>
            <td>Sku</td>
            <td>List Price</td>
            <td>MSRP</td>
            <td>Action</td>
        </tr>
    </thead>
    <tbody>

        @if (Model.Skus != null)
        {
            foreach (var sku in Model.AllSkus)
            {

                <tr>
                    <td>
                        @Html.DisplayFor(m => sku.Product.Name)
                    </td>
                    <td>
                        <label id="skuName@(sku.Id)">@sku.Name</label>
                    </td>
                    <td>$@Html.DisplayFor(m => sku.ListPrice)
                    </td>
                    <td>$@Html.DisplayFor(m => sku.Msrp)
                    </td>
                    <td>
                        <a href="#" class="AddSku" id="addSku@(sku.Id)">Add To Offering</a>
                    </td>
                </tr>

            }
        }
    </tbody>
    <tfoot>
    <tr>
        <td colspan="4" style="text-align: right;">
            @Html.Pager("List", Model.SkuPager, 3, (string)ViewBag.SkuFilter)
        </td>
    </tr>
</tfoot>
</table>
}

@section Scripts {
<script>
    $(document).ready(function() {

        //Array of skus
        var skus = new Array();

        $('.AddSku').click(function(e) {
            e.preventDefault();
            var id = e.target.id.replace("addSku", "");

            var exists = false;

            for (var i = 0; i < skus.length; i++) {
                if (skus[i] == id) {
                    exists = true;
                }
            }

            if (!exists) {
                var name = $("#skuName" + id).text();
                $('#skuList').append('<option value=' + id + '>' + name + '</option>');
                skus.push(id);
            }

        });

    });
</script>

}
4

1 に答える 1

2

MVCは、タイプ(またはオブジェクト)のインターフェースに技術的にバインドすることはできません---にICollection変更ICollection<T>してくださいList<T>。次に、リストボックスでリストがどのようにレンダリングされているかを確認する必要があります(選択)。配列表記、つまり。のようなものでレンダリングする必要がありますSku[0] ... Sku[n]。jQueryは、同じ配列表記でselectに追加する必要があります。詳細については、 PhilHaackのModelBinding toaListの記事を参照してください。

于 2013-02-15T02:21:28.630 に答える