在 asp.net mvc 中的同一视图页面中搜索表单和搜索结果答案

【问题标题】：Search form and search result in same viewpage in asp.net mvc在 asp.net mvc 中的同一视图页面中搜索表单和搜索结果
【发布时间】：2015-09-11 07:59:53
【问题描述】：

我正在尝试创建一个具有搜索表单和搜索结果的模块，如下图所示

在该模块中，我有 4 个下拉列表和一个文本字段

这就是我到现在为止所做的

这是模型类

public class ProductCollectionVM
{
    public IEnumerable<ProductCollection> List_ProductCollection { get; set; }
    public ProductCollection Form_ProductCollection { get; set; }
}

public class ProductCollection
{
    public string Product_ID { get; set; }        
    public string ProductType_ID { get; set; }
    public string ProductCategory_ID { get; set; }
    // more properties
}

这是我的cshtml查看页面

@model albaraka.Models.ProductCollectionVM
....
@using (Html.BeginForm("Product_Search", "Home", FormMethod.Get))
{
    ....
    @Html.LabelFor(x => x.Form_ProductCollection.ProductType_ID, htmlAttributes: new { @class = "control-label col-md-2" })
    @Html.DropDownListFor(x => x.Form_ProductCollection.ProductType_ID, (SelectList)ViewBag.Product_TypeListEn, "Select Product Type", new { @class = "form-control" })
    @Html.ValidationMessageFor(x => x.Form_ProductCollection.ProductType_ID, "", new { @class = "text-danger" }) @Html.ValidationMessageFor(x => x.Form_ProductCollection.Product_TypeAr, "", new { @class = "text-danger" })

    @Html.LabelFor(x => x.Form_ProductCollection.ProductCategory_ID, htmlAttributes: new { @class = "control-label col-md-2" })
    @Html.DropDownListFor(x => x.Form_ProductCollection.ProductCategory_ID, (SelectList)ViewBag.Product_CategoryListEn, "Select Product Category", new { @class = "form-control" })
    @Html.ValidationMessageFor(x => x.Form_ProductCollection.ProductCategory_ID, "", new { @class = "text-danger" })

   // .... more controls

   <input type="submit" value="Search Products" class="btn btn-default" />
}

<table class="table">
    <tr>
        <th>@Html.DisplayNameFor(y => y.Form_ProductCollection.Product_ID</th>
        <th>@Html.DisplayNameFor(y => y.Form_ProductCollection.ProductType_ID)</th>
        // more table headings
    </tr>
    @foreach (var item in Model.List_ProductCollection)
    {
        <tr>
            <td>@Html.DisplayFor(modelItem => item.Product_ID)</td>
            <td>@Html.DisplayFor(modelItem => item.ProductType_ID)</td>
            // .....
        </tr>
    }
</table>

这是控制器类

public ActionResult Product_Search([Bind(Prefix = "Form_ProductCollection")]ProductCollection _Productcollection , ProductCollection PC)
{
    Product_Type_DropDownListEn();          
    Product_Category_DropDownListEn();
    Country_DropDownList();
    Subsidary_DropDownListEn();
    var incomplete_products = (from P in db.AB_Product
                               join S in db.AB_Subsidary on P.Subsidary_ID equals S.SubsidaryID
                               where P.Status != "Active"
                               select new ProductCollection
                               {
                                   Product_ID = P.ProductID,
                                   ProductType_ID = P.ProductTypeID,
                                   ProductCategory_ID = P.ProductCategoryID,
                                   Product_Name_En = P.ProductTitleEn,
                                   Susidary_ID = P.Subsidary_ID,
                                   Country_ID = S.Country,
                                   CreatedDate = P.CreatedDate,
                                   Status = P.Status
                               }).ToList();

    if (!string.IsNullOrWhiteSpace(PC.ProductType_ID))
        incomplete_products = incomplete_products.Where(p => p.ProductType_ID.StartsWith(PC.ProductType_ID)).ToList();
    // .... more filtering
    return View(incomplete_products);
}

但是一旦我调试这个得到以下错误

传入字典的模型项是类型 'System.Collections.Generic.List`1[Project_Name.Models.ProductCollection]', 但是这本字典需要一个类型的模型项 'Project_Name.Models.ProductCollectionVM'。

在我的控制器类中这是正确的方法吗，或者在同一个视图中是否有其他更好的方法来做到这一点

【问题讨论】：

你的视图有@model ProductCollectionVM，所以在你的控制器中你需要返回一个ProductCollectionVM的实例（不是IEnumerable<ProductCollection>）
如何返回 ProductCollectionVM 的实例？
初始化它，然后将 List_ProductCollection 设置为 incomplete_products 并返回它（但你真的应该使用 ajax 来获得更好的性能）
ProductCollectionVM model = new ProductCollectionVM ();这是怎么初始化的？
试试这个DotNetFiddle。显然不完整，但我相信你会明白的

标签： c# asp.net asp.net-mvc asp.net-mvc-4 search

【解决方案1】：

您的视图将模型声明为@model albaraka.Models.ProductCollectionVM，但是当您提交时，您将视图返回为IEnumerable<ProductCollection>，因此出现错误。

在POST方法中，需要初始化一个ProductCollectionVM的新实例并返回

public ActionResult Product_Search(.....)
{
  // filter your collection
  var incomplete_products = ....
  ProductCollectionVM model = new ProductCollectionVM()
  {
    List_ProductCollection = incomplete_products;
  };
  return View(model)
}

但是，通过使用 ajax 提交表单值并返回表的部分视图或包含表值的 JSON 并在成功回调中更新 DOM，您将获得更好的性能。请参阅此 DotNetFiddle 以获取简化示例

【讨论】：

【解决方案2】：

在你的Controller 你返回这个类：

select new ProductCollection

但是在你的View 上你使用：

@model albaraka.Models.ProductCollectionVM

您应该将Controller 中的课程更改为ProductCollectionVM

【讨论】：