[英]javascript datatable filter not filtering
我正在嘗試按element.data過濾表。 我有一個下拉列表供用戶選擇值,並在完成后選擇提交按鈕。 該表將獲取初始數據,但是當我選擇一個值並單擊“提交”時,我將獲取所有值。 過濾器根本不工作。
Javascript過濾器
$('#Product').on('change', function () {
var count = 0;
var value = this.value;
$('#results-tbody tr').each(function () {
var element = $(this);
element.data('filters', element.data('filters').replace(/dropdown/g, ''));
if (value !== 'All' && element.data("product").indexOf(value) === -1) {
element.data('filters', element.data('filters') + 'dropdown');
}
count = count + hideOrShow(element);
});
setResultsCount(count);
});
$('#Changes').on('change', function () {
var count = 0;
var value = this.value;
$('#results-tbody tr').each(function () {
var element = $(this);
element.data('filters', element.data('filters').replace(/dropdown/g, ''));
if (value !== 'All' && element.data("oc").indexOf(value) === -1) {
element.data('filters', element.data('filters') + 'dropdown');
}
count = count + hideOrShow(element);
});
setResultsCount(count);
});
報告表頁面
var productList = new SelectList(
new List<SelectListItem>
{
new SelectListItem {Text = "Flexitouch", Value = "Flexitouch"},
new SelectListItem {Text = "ACTitouch", Value = "ACTitouch"},
new SelectListItem {Text = "Entre", Value = "Entre"},
}, "Text", "Value");
var showList = new SelectList(
new List<SelectListItem>
{
new SelectListItem {Text = "Changes Only", Value = "Changes Only"},
new SelectListItem {Text = "Referrals Only", Value = "Referral Only"},
}, "Text", "Value");
<div class="layout clinics">
@using (Html.BeginForm("AccountSummaryReport", "Reports",
FormMethod.Post))
{
@Html.ValidationSummary(false)
<div style="border-bottom:1px solid #bbb">
<h1>Account Summary Report</h1>
</div>
<!--<div class="filter-btns top">
<h4 class="filter-heading">Quick Search By</h4>
<input type="button" name="all" class="button1 filter-button active" value="All" />
<input type="button" name="flexitouch" class="button1 filter-button" value="Flexitouch" />
<input type="button" name="actitouch" class="button1 filter-button" value="ACTitouch" />
<input type="button" name="entre" class="button1 filter-button" value="Entre" />
</div>-->
<fieldset class="form-wrapper form-side-labels form-labels-125 search-box-center">
<div class="form-field form-full">
<!-- New Dropdown ! -->
<div class="editor-label">
<label>@Html.DisplayNameFor(model => model.Product)</label>
</div>
<div class="editor-field">
@Html.DropDownListFor(model => model.Product, productList, "All", new { @class = "css-class clinic-dropdown" })
</div>
</div>
<div class="form-field form-full">
<div class="editor-label">
<label>@Html.DisplayNameFor(model => model.Changes)</label>
</div>
<div class="editor-field">
@Html.DropDownListFor(model => model.Changes,showList, "All", new { @class = "css-class clinic-dropdown" })
</div>
</div>
<div class="form-field">
<input name="SearchButton" type="submit" value="Search" />
</div>
</fieldset>
<table class="table results-table">
<tr>
<th><i id="count"> (@ViewBag.Count found) </i></th>
</tr>
<tbody id="results-tbody">
@foreach (var item in Model.SearchResults)
{
<tr class="table__row-link" data-patientname"="@item.PatientLastName , @item.PatientLastName"
data-product="@item.Product" data-referral="@item.d_Order_Date" data-oc="@item.d_Order_Complete_Date"
data-approved="@item.ApprovedDate" data-inactive="@item.d_Inactive_Date" data-training="@item.LastTrainedDate" data-links="@item.Links" data-filters="none">
<td>
<a href="@Url.Action("Details", "Patient", new { patientID = item.PT_RecID })">
<strong>@Html.DisplayFor(modelItem => item.PatientLastName, item.PatientFirstName) (@Html.DisplayFor(modelItem => item.PT_RecID))</strong>
<br />
<strong>Product: </strong>@Html.DisplayFor(modelItem => item.Product)
<br />
<strong>Referral: </strong>@Html.DisplayFor(modelItem => item.d_Order_Date)
<br />
<strong>OC: </strong> @Html.DisplayFor(modelItem => item.d_Order_Complete_Date)
<br />
<strong>Shipped: </strong> @Html.DisplayFor(modelItem => item.d_Ship_Date)
<br />
<strong>Approved: </strong> @Html.DisplayFor(modelItem => item.ApprovedDate)
<br />
<strong>Inactive: </strong> @Html.DisplayFor(modelItem => item.d_Inactive_Date)
<br />
<strong>Training: </strong> @Html.DisplayFor(modelItem => item.LastTrainedDate)
<br />
<strong>Links: </strong> @Html.DisplayFor(modelItem => item.Links)
<br />
</a>
</td>
</tr>
}
</tbody>
</table>
模型
public class AccountSummaryReportModel
{
public string Product { get; set; }
public string Clinic_RecID { get; set; }
public IEnumerable<v_Report_AccountSummary> SearchResults { get; set; }
public string SearchButton { get; set; }
public IEnumerable<SelectListItem> Changes { get; set; }
[DisplayFormat(DataFormatString = "{0:MM/dd/yyyy}", ApplyFormatInEditMode = true)]
[DisplayName("Start")]
//[DataType(DataType.Date)]
public DateTime Start { get; set; }
}
您具有事件偵聽器“ $('#Product')。on('change'....”,但是我看不到帶有id =“ Product”的控件。我懷疑這是您的問題。我需要將該ID分配給您要在更改時觸發的控件。
我相信您的$('#Changes')事件監聽器也有同樣的問題。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.