[英]Search form and search result in same viewpage in asp.net mvc
I'm trying to create a module that has search form and search result together like following picture 我正在尝试创建一个具有搜索表单和搜索结果的模块,如下图所示
In that module I have 4 dropdownlist and one text field 在该模块中,我有4个下拉列表和一个文本字段
this is What I did upto now 这是我到目前为止所做的
This is Model Class 这是模特班
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
}
This is my cshtml view page 这是我的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>
This is controller class 这是控制器类
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);
}
But once I do debug this getting following error 但是一旦我调试了此错误
The model item passed into the dictionary is of type 'System.Collections.Generic.List`1[Project_Name.Models.ProductCollection]', but this dictionary requires a model item of type 'Project_Name.Models.ProductCollectionVM'. 传递到字典中的模型项的类型为'System.Collections.Generic.List`1 [Project_Name.Models.ProductCollection]',但此字典需要类型为'Project_Name.Models.ProductCollectionVM'的模型项。
Is this correct approach in my controller class , Or is there any other better way to do this in same view 这是我的控制器类中的正确方法,还是在同一视图中还有其他更好的方法来做到这一点?
Your view declares the model as @model albaraka.Models.ProductCollectionVM
, but when you submit, you return the view as IEnumerable<ProductCollection>
hence the error. 您的视图将模型声明为@model albaraka.Models.ProductCollectionVM
,但是在提交时,您将视图作为IEnumerable<ProductCollection>
返回,因此出现错误。
In the POST method, you need to initialize a new instance of ProductCollectionVM
and return it 在POST方法中,您需要初始化ProductCollectionVM
的新实例并返回它
public ActionResult Product_Search(.....)
{
// filter your collection
var incomplete_products = ....
ProductCollectionVM model = new ProductCollectionVM()
{
List_ProductCollection = incomplete_products;
};
return View(model)
}
However, you will get better performance by using ajax to submit the form values and return either a partial view of the table or JSON containing the table values and update the DOM in the success callback. 但是,通过使用ajax提交表单值并返回表的部分视图或包含表值的JSON并更新成功回调中的DOM,您将获得更好的性能。 Refer this DotNetFiddle for a simplified example 有关简化示例,请参考此DotNetFiddle
In your Controller
you return this class: 在您的Controller
您将返回此类:
select new ProductCollection
But on your View
you use: 但是在您的View
您使用:
@model albaraka.Models.ProductCollectionVM
You should change class in your Controller
to ProductCollectionVM
您应该将Controller
类更改为ProductCollectionVM
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.