在我的mvc应用程序中，我有一个包含局部视图和ajax.beginform的产品页面。我用ajax开始表单过滤产品。我的问题是，当我去查看其他页面然后返回产品页面时，我丢失了过滤后的页面内容。
如何保留已过滤的内容？
谢谢。
public ActionResult Products(ProductViewModel model, string id)
{
int gender=0;
if (!string.IsNullOrEmpty(id))
{
if (id.ToLower()=="kadin")
{
gender = 2;
}
else if (id.ToLower()=="erkek")
{
gender = 1;
}
else if (id.ToLower() == "cocuk")
{
gender = 3;
}
}
List<Products> list = new List<Domain.Products>();
if (model.CatList==null)
{
list = _service.GetAll();
}
else
{
list = _service.GetAll().Where(c => model.CatList.Contains(c.CategoryId.ToString())).ToList();
}
if (model.prop!=null)
{
var proplist = _ppService.GetAll().ToList();
var proplistt=proplist.Where(x => model.prop.Contains(x.PropertyValueId.ToString())).Select(x => x.ProductId).ToList();
list = list.Where(p => proplistt.Contains(p.ProductId)).ToList();
}
ProductViewModel vm = new ProductViewModel();
vm.CategoryList = _CategoryService.GetAll().ToList();
vm.PropertyValuesList = _PropertyValuesService.GetAll().ToList();
if (!string.IsNullOrEmpty(id))
{
list = list.Where(x => x.Gender == gender).ToList();
}
vm.PropertyInProducts = _ppService.GetAll().ToList();
vm.PropertyInProducts = _ppService.GetAll().ToList();
if (Request.IsAjaxRequest())
{
if (!string.IsNullOrEmpty(model.Order))
{
if (model.Order=="01")
{
vm.ProductList = list.Where(x => (x.IsActive == true && x.IsReserved != true) && ((string.IsNullOrEmpty(model.ProductCode)) || ((!string.IsNullOrEmpty(x.ProductCode)) && x.ProductCode.ToLower().Contains(model.ProductCode.ToLower())))).OrderByDescending(x => x.ProductId).Skip(model.skip).Take(30).ToList();
}
else if (model.Order=="02")
{
vm.ProductList = list.Where(x => (x.IsActive == true && x.IsReserved != true) && ((string.IsNullOrEmpty(model.ProductCode)) || ((!string.IsNullOrEmpty(x.ProductCode)) && x.ProductCode.ToLower().Contains(model.ProductCode.ToLower())))).OrderBy(x => x.ProductId).Skip(model.skip).Take(30).ToList();
}
else if (model.Order=="03")
{
vm.ProductList = list.Where(x => (x.IsActive == true && x.IsReserved != true) && ((string.IsNullOrEmpty(model.ProductCode)) || ((!string.IsNullOrEmpty(x.ProductCode)) && x.ProductCode.ToLower().Contains(model.ProductCode.ToLower())))).OrderBy(x => x.ProductCode).Skip(model.skip).Take(30).ToList();
}
else if (model.Order=="04")
{
vm.ProductList = list.Where(x => (x.IsActive == true && x.IsReserved != true) && ((string.IsNullOrEmpty(model.ProductCode)) || ((!string.IsNullOrEmpty(x.ProductCode)) && x.ProductCode.ToLower().Contains(model.ProductCode.ToLower())))).OrderByDescending(x => x.ProductCode).Skip(model.skip).Take(30).ToList();
}
else
{
vm.ProductList = list.Where(x => (x.IsActive == true && x.IsReserved != true) && ((string.IsNullOrEmpty(model.ProductCode)) || ((!string.IsNullOrEmpty(x.ProductCode)) && x.ProductCode.ToLower().Contains(model.ProductCode.ToLower())))).OrderByDescending(x => x.ProductId).Skip(model.skip).Take(30).ToList();
}
}
else
{
vm.ProductList = list.Where(x => (x.IsActive==true && x.IsReserved!=true)&& ((string.IsNullOrEmpty(model.ProductCode)) || ((!string.IsNullOrEmpty(x.ProductCode)) && x.ProductCode.ToLower().Contains(model.ProductCode.ToLower())))).OrderByDescending(x => x.ProductId).Skip(model.skip).Take(30).ToList();
}
return PartialView("_ProductList",vm);
}
else
{
vm.ProductList = list.Where(x => x.IsActive == true && x.IsReserved != true).OrderByDescending(x => x.ProductId).Take(30).ToList();
return View(vm);
}
}
@using (Ajax.BeginForm("Products", "Home", FormMethod.Post, new AjaxOptions { OnSuccess = "load", LoadingElementDuration = 50000 }))
{
if (lang == "tr-TR")
{
<!--cinsiyet-->
<div class="FiltreBox">
<span class="boxTitle">CİNSİYET</span>
<ul class="genderChk">
<li>
<label>
<input type="checkbox" data-html="Kadın" name="id" value="kadin" />
<span class="Text">Kadın <span></span></span>
</label>
</li>
<li>
<label>
<input type="checkbox" data-html="Erkek" name="id" value="erkek" />
<span class="Text">Erkek <span></span></span>
</label>
</li>
<li>
<label>
<input type="checkbox" data-html="Çocuk" name="id" value="cocuk" />
<span class="Text">Çocuk <span></span></span>
</label>
</li>
</ul>
</div>
<!--cinsiyet-->
}
else if (lang == "en-gb")
{
<!--cinsiyet-->
<div class="FiltreBox">
<span class="boxTitle">GENDER</span>
<ul class="genderChk">
<li>
<label>
<input type="checkbox" data-html="Women" class="myCheckbox" name="id" value="kadin" />
<span class="Text">Women <span></span></span>
</label>
</li>
<li>
<label>
<input type="checkbox" data-html="Men" class="myCheckbox" name="id" value="erkek" />
<span class="Text">Men <span></span></span>
</label>
</li>
<li>
<label>
<input type="checkbox" data-html="Kids" class="myCheckbox" name="id" value="cocuk" />
<span class="Text">Kid <span></span></span>
</label>
</li>
</ul>
</div>
<!--cinsiyet-->
}
if (lang == "tr-TR")
{
<div class="FiltreBox">
<span class="boxTitle">KATEGORİ</span>
<ul class="categoryChk">
@foreach (var item in Model.CategoryList)
{
<li>
<label>
<input type="checkbox" data-html="@item.CategoryName" name="CatList[]" value="@item.CategoryId" />
<span class="Text">@item.CategoryName</span>
</label>
</li>
}
</ul>
</div>
}
else
{
<div class="FiltreBox">
<span class="boxTitle">CATEGORY</span>
<ul class="categoryChk">
@foreach (var item in Model.CategoryList)
{
<li>
<label>
<input type="checkbox" data-html="@item.Description" name="CatList[]" value="@item.CategoryId" />
<span class="Text">@item.Description</span>
</label>
</li>
}
</ul>
</div>
}
<!--Kategori-->
<!--detaylar-->
if (lang == "tr-TR")
{
<div class="FiltreBox">
<span class="boxTitle">DETAYLAR</span>
<ul class="propCheck">
@foreach (var item in Model.PropertyValuesList.Where(x => x.PropertyId == 14))
{
<li>
<label>
<input type="checkbox" data-html="@item.PropertyValue" name="prop[]" value="@item.PropertyValueId" />
<span class="Text">@item.PropertyValue</span>
</label>
</li>
}
</ul>
</div>
}
else if (lang == "en-gb")
{
<div class="FiltreBox">
<span class="boxTitle">DETAILS</span>
<ul class="propCheck">
@foreach (var item in Model.PropertyValuesList.Where(x => x.PropertyId == 14))
{
<li>
<label>
<input type="checkbox" data-html="@item.PropertyValueEn" name="prop[]" value="@item.PropertyValueId" />
<span class="Text">@item.PropertyValueEn</span>
</label>
</li>
}
</ul>
</div>
}
<!--detaylar-->
<!--gage-->
if (lang == "tr-TR")
{
<div class="FiltreBox">
<span class="boxTitle">GAGE</span>
<ul>
@foreach (var item in Model.PropertyValuesList.Where(x => x.PropertyId == 13))
{
<li>
<label>
<input type="checkbox" data-html="@item.PropertyValue" name="prop[]" value="@item.PropertyValueId" />
<span class="Text">@item.PropertyValue</span>
</label>
</li>
}
</ul>
</div>
}
else if(lang=="en-gb")
{
<div class="FiltreBox">
<span class="boxTitle">GAGE</span>
<ul>
@foreach (var item in Model.PropertyValuesList.Where(x => x.PropertyId == 13))
{
<li>
<label>
<input type="checkbox" data-html="@item.PropertyValueEn" name="prop[]" value="@item.PropertyValueId" />
<span class="Text">@item.PropertyValueEn</span>
</label>
</li>
}
</ul>
</div>
}
<!--gage-->
<!--kompozisyon-->
if (lang == "tr-TR")
{
<div class="FiltreBox">
<span class="boxTitle">KOMPOZİSYON</span>
<ul class="propCheck">
@foreach (var item in Model.PropertyValuesList.Where(x => x.PropertyId == 10))
{
<li>
<label>
<input type="checkbox" data-html="@item.PropertyValue" name="prop[]" value="@item.PropertyValueId" />
<span class="Text">@item.PropertyValue</span>
</label>
</li>
}
</ul>
</div>
}
else if(lang=="en-gb")
{
<div class="FiltreBox">
<span class="boxTitle">COMPOSITION</span>
<ul class="propCheck">
@foreach (var item in Model.PropertyValuesList.Where(x => x.PropertyId == 10))
{
<li>
<label>
<input type="checkbox" data-html="@item.PropertyValueEn" name="prop[]" value="@item.PropertyValueId" />
<span class="Text">@item.PropertyValueEn</span>
</label>
</li>
}
</ul>
</div>
}
<!--kompozisyon-->
<input type="submit" style="display:none" name="name" id="search" value="Ara" />
}
</div>
<!--Left-->
<!--right-->
<div class="RightColums">
@if (lang == "tr-TR")
{
<h1>Tüm Ürünler</h1>
<!--sıralama-->
<div class="Shorting">
<span class="Title">SIRALA : </span>
<select>
<option value="00">Seçin</option>
<option value="01">Tarihe Göre Yeni</option>
<option value="02">Tarihe Göre Eski</option>
<option value="03">Ürün Kodu Yeni</option>
<option value="04">Ürün Kodu Eski</option>
</select>
</div>
<div class="Search">
<input type="text" placeholder="Ara" id="searchh" />
<a href="javascript:;" id="searchbtn">Ara</a>
</div>
}
else if (lang == "en-gb")
{
<h1>All Products</h1>
<!--sıralama-->
<div class="Shorting">
<span class="Title">Order : </span>
<select id="orderSelect">
<option value="00">Select</option>
<option value="01">Order By Date Asc</option>
<option value="02">Order By Date Desc</option>
<option value="03">Order By Product Code Asc</option>
<option value="04">Order By Product Code Desc</option>
</select>
</div>
<div class="Search">
<input type="text" placeholder="Search" id="searchh" />
<a href="javascript:;" id="searchbtn">Search</a>
</div>
}
<!--sıralama-->
<!--Ürünler-->
<div id="productsList">
@Html.Partial("_ProductList", Model)
</div>
<div id="dataBefore"></div>
<!--Ürünler-->
<!--more-->
<div class="MoreCapsule">
<span class="Line"></span>
@if (Model.ProductList.Count() >= 9)
{
if (lang == "tr-TR")
{
<a href="javascript:;" id="loadMore">DİĞER ÜRÜNLER</a>
}
else if (lang == "en-gb")
{
<a href="javascript:;" id="loadMore">OTHER PRODUCTS</a>
}
}
</div>
<!--more-->
</div>
<!--/right-->
<div class="clear"></div>
</div>
@section PageBottomScripts{
<script type="text/javascript" src="~/Content/js/jquery.selectBox.min.js"></script>
<script type="text/javascript">
$(window).ready(function () {
var loadCount = 1;
$.ugurKonfeksiyonApp.productListPageLoad();
$(document).on("click", ".removefb", function () {
var did = $(this).closest("li").data("id");
if (did!=null) {
$('.categoryChk li label span input:checkbox').each(function (index, value) {
var cb = $(this);
var text = $(this).data("html");
var idd = $(this).val();
if (did == idd) {
cb.click();
}
});
}
else {
var lId = $(this).closest("li").attr("id");
$('.propCheck li label span input:checkbox').each(function (index, value) {
var cb = $(this);
var text = $(this).data("html");
var idd = $(this).val();
if (lId == idd) {
cb.click();
}
});
}
});
$('.categoryChk li label span input:checkbox').each(function (index, value) {
var text = $(this).data("html");
var idd = $(this).val();
$(this).click(function () {
loadCount = 1;
$("#search").submit();
if ($(this).is(":checked")) {
$("#filterboxx .selected").append('<li data-id="' + idd + '"><a class="removefb" href="#" >x</a>' + text + '</li>');
}
else {
$("#filterboxx .selected li").each(function (index, value) {
if ($(this).data("id") == idd) {
$(this).hide();
}
})
}
});
});
$('.propCheck li label span input:checkbox').each(function (index, value) {
var text = $(this).data("html");
var idd = $(this).val();
$(this).click(function () {
loadCount = 1;
$("#search").submit();
if ($(this).is(":checked")) {
$("#filterboxx .selected").append('<li id="' + idd + '" ><a href="#" class="removefb">x</a>' + text + '</li>');
}
else {
$("#filterboxx .selected li").each(function (index, value) {
if ($(this).attr("id") == idd) {
$(this).hide();
}
})
}
});
});
//Every checkboxes in the page
$('.genderChk li label span input:checkbox').click(function () {
$('.genderChk li label span input:checkbox').not(this).prop('checked', false);
$('.genderChk li label span input:checkbox').not(this).closest('span').removeClass("selected");
$("#search").submit();
});
$('.genderChk li label span input:checkbox').each(function () {
var gender = $(this);
var gndr = gender.val();
var text = $(this).data("html");
if (gndr == '@g') {
gender.closest("span").addClass("selected");
gender.attr('checked', true);
$("#filterboxx .selected").append('<li id="' + gndr + '" ><a href="#" class="removefb">x</a>' + text + '</li>');
}
});
$(function () {
//var loading = $("#loading");
$("#loadMore").on("click", function (e) {
e.preventDefault();
//$(document).on({
// ajaxStart: function () {
// loading.show();
// },
// ajaxStop: function () {
// loading.hide();
// }
//});
var CatArray = [];
var prop = [];
$('.categoryChk li label span input:checkbox').each(function () {
if ($(this).is(':checked')) {
CatArray = $(this).val();
}
});
$('.propCheck li label span input:checkbox').each(function () {
if ($(this).is(':checked')) {
prop = $(this).val();
}
});
var ProductViewModel = {
skip: loadCount * 30,
id: '@g',
CatList: CatArray,
prop: prop,
Order: $("#orderSelect").val()
}
var url ='@Url.Action("Products","Home")';
$.ajax({
url: url,
data: ProductViewModel,
cache: false,
type: "POST",
success: function (data) {
if (data.length !== 0) {
//$(data).insertBefore("#dataBefore").fadeIn(100);
$("#productsList").append(data);
}
var ajaxModelCount = data.ModelCount - (loadCount * 30);
if (ajaxModelCount <= 0) {
$("#loadMore").hide().fadeOut(2000);
}
$.ugurKonfeksiyonApp.boxStretch();
},
error: function (xhr, status, error) {
console.log(xhr.responseText);
//alert("message : \n" +
// "An error occurred, for more info check the js console" +
// "\n status : \n" + status + " \n error : \n" + error);
}
});
loadCount = loadCount + 1;
});
});
$("#orderSelect").on("change", function () {
var CatArray = [];
var prop = [];
$('.categoryChk li label span input:checkbox').each(function () {
if ($(this).is(':checked')) {
CatArray = $(this).val();
}
});
$('.propCheck li label span input:checkbox').each(function () {
if ($(this).is(':checked')) {
prop = $(this).val();
}
});
var ProductViewModel = {
skip: loadCount * 30,
id: '@g',
CatList: CatArray,
prop: prop,
Order:$(this).val()
}
var url = '@Url.Action("Products","Home")';
$.ajax({
url: url,
data: ProductViewModel,
cache: false,
type: "POST",
success: function (data) {
if (data.length !== 0) {
//$(data).insertBefore("#dataBefore").fadeIn(100);
$("#productsList").html(data);
}
var ajaxModelCount = data.ModelCount - (loadCount * 9);
if (ajaxModelCount <= 0) {
$("#loadMore").hide().fadeOut(2000);
}
$.ugurKonfeksiyonApp.boxStretch();
},
error: function (xhr, status, error) {
console.log(xhr.responseText);
//alert("message : \n" +
// "An error occurred, for more info check the js console" +
// "\n status : \n" + status + " \n error : \n" + error);
}
});
});
});
</script>
<script>
function load(result) {
$("#productsList").html(result);
}
</script>
}