Question

我有一个表单，我动态生成一些控件（列出一些类。在图像添加产品图稿部分）当我点击提交按钮时如何在post Action方法的参数中获取此值以便我可以使用这个值在集合中。

作为参考，我附上了图片，我可以选择多个艺术品oprion

[HttpPost]
   public ActionResult Add(Graphic graphicToAdd,Enumerable<GraphicArtwork> artworkOption)
{
// I want value in artworkOption 
}

public class GraphicArtwork
    {
        [Key]
        public int GraphicArtworkId { get; set; }
        public int GraphisId { get; set; }
        [Required(ErrorMessage = "The {0} is required.")]
        [DisplayName("Option Text")]
        [StringLength(500)]
        public string ArtOptionText { get; set; }
        public decimal Price { get; set; }
        [DisplayName("Active")]
        public bool IsActive { get; set; }
        public DateTime CreatedDate { get; set; }

        [NotMapped]
        public int TotalRecordCount { get; set; }
    }

这是我的观点：

<div class="editor-field PrintOptions">            
            <table data-bind="visible :customArtworks().length > 0">
                <thead>
                    <tr>
                        <td class="editor-label">Option</td>
                        <td class="editor-label">Price</td>
                        <td></td>
                    </tr>
                </thead>
                <tbody data-bind="foreach: customArtworks">
                    <tr>
                        <td>
                            <input placeholder="Enter Artwork Text" type="text" data-bind="value: ArtOptionText'}" />
                        </td>
                        <td>
                            <input placeholder="Enter Price" type="text" data-bind="value: Price" />
                        </td>
                        <td>
                            <a href="#" data-bind="click: $root.add"><img title="Add" src="~/Content/images/icon_add.png"></a>
                            <a href="#" data-bind="click: $root.remove,visible: $root.customArtworks().length > 1"><img title="Delete" style="margin-left:10px;" src="~/Content/images/icon_delete.png"></a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>

更多细节：我使用knockout.js生成我的动态控件

 // Ko Implemntation

        function GraphicArtwork(ArtOptionText, Price) {
            var self = this;
            self.ArtOptionText = ArtOptionText;
            self.Price = Price;

            self.formattedPrice = ko.computed(function () {
                var price = self.Price;
                return price ? "$" + price.toFixed(2) : "0.00";
            })

        }

        function GraphicArtworkViewModel() {
            var self = this;
            self.customArtworks = ko.observableArray([GraphicArtwork(null, null)]);

            self.add = function () {
                self.customArtworks.push(new GraphicArtwork(null, null));
            };

            self.remove = function (GraphicArtwork) {
                self.customArtworks.remove(GraphicArtwork);
            };

        }

        ko.applyBindings(new GraphicArtworkViewModel());

Answer 1

添加此绑定：

<td>
                            <input placeholder="Enter Artwork Text" type="text" data-bind="value: ArtOptionText,attr:{name: '['+$index()+'].ArtOptionText'}" />
                        </td>
                        <td>
                            <input placeholder="Enter Price" type="text" data-bind="value: Price,attr:{name: '['+$index()+'].Price'}" />
                        </td>

AND代码背后

public ActionResult Add(Graphic graphicToAdd,IEnumerable<GraphicArtwork> listOfGraphicArtwork)
{
 // listOfGraphicArtwork will hold all the required data 
}

如何获取客户端生成的类列表到MVC post action参数？

1 个答案: