Javascript 如何使用Multiselect小部件过滤KendoUI网格？
我正在MVC应用程序中使用KendoUI。我使用一些输入框和multiselect小部件过滤我的网格。multiselect小部件将所选元素作为数组传递。我的问题是如何使用multiselect过滤网格 目前，所有输入共享一个全局条件“和”，以便它们在返回数据时可以一起工作，但是multiselect需要一个子条件“或”才能工作 我试图做的是迭代传入的数组对象并分别返回它们。我需要对它们应用“或”的多选条件。我可以看到数组对象被单独返回到控制台，但是tehy没有被包括在网格的整体过滤中，这使得它是冗余的 有人能谈谈我如何解决这个问题吗？我在下面包含了我的代码，它显示了multiselect小部件在我的javascript代码中的位置以及我采取的方法Javascript 如何使用Multiselect小部件过滤KendoUI网格？,javascript,arrays,kendo-ui,Javascript,Arrays,Kendo Ui,我正在MVC应用程序中使用KendoUI。我使用一些输入框和multiselect小部件过滤我的网格。multiselect小部件将所选元素作为数组传递。我的问题是如何使用multiselect过滤网格 目前，所有输入共享一个全局条件“和”，以便它们在返回数据时可以一起工作，但是multiselect需要一个子条件“或”才能工作 我试图做的是迭代传入的数组对象并分别返回它们。我需要对它们应用“或”的多选条件。我可以看到数组对象被单独返回到控制台，但是tehy没有被包括在网格的整体过滤中，这使得它
@(Html.Kendo().Grid<MyProject.ViewModels.FixtureSearchViewModel>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(c => c.fixture_idx).Hidden();
columns.Bound(c => c.fixture_date)
.Title("Date")
.ClientTemplate("#=fixture_date ? kendo.toString(kendo.parseDate(fixture_date), 'dd/MM/yyyy') : '' #");
columns.Bound(c => c.owner_company)
.Title("Owner");
columns.Bound(c => c.vessel_name)
.Title("Name");
columns.Bound(c => c.vessel_type)
.Title("Type");
columns.Bound(c => c.charterer_company)
.Title("Charterer");
columns.Bound(c => c.fixture_type)
.Title("Type");
columns.Bound(c => c.workscopecode)
.Title("Duties");
columns.Bound(c => c.fixture_start)
.Title("Start")
.ClientTemplate("#=fixture_start ? kendo.toString(kendo.parseDate(fixture_start), 'dd/MM/yyyy') : '' #");
columns.Bound(c => c.on_hire_location)
.Title("Location");
columns.Bound(c => c.fixture_end)
.Title("End")
.ClientTemplate("#=fixture_end ? kendo.toString(kendo.parseDate(fixture_end), 'dd/MM/yyyy') : '' #");
columns.Bound(c => c.off_hire_location)
.Title("Location");
columns.Bound(c => c.initial_rate)
.Title("Rate")
.ClientTemplate(" #=initial_rate_currency# #=initial_rate#");
})
.Pageable()
.Sortable(sortable =>
{
sortable.SortMode(GridSortMode.MultipleColumn);
}).ToolBar(toolbar =>
{
toolbar.Template(@<text>
<table class="table">
<tr>
<td>Charterer</td>
<td>
@(Html.Kendo().DropDownList()
.Name("charterer_company")
.Filter("contains")
.OptionLabel("Choose Charterer")
.DataTextField("CompanyName")
.DataValueField("CompanyName")
.DataSource(e => e.Read("GetChartererCompanies", "FormAssets"))
)
</td>
</tr>
<tr>
<td>Start(After)</td>
<td>
@(Html.Kendo().DatePicker()
.Name("fixture_start"))
</td>
</tr>
<tr>
<td>End(Before)</td>
<td>
@(Html.Kendo().DatePicker()
.Name("fixture_end"))
</td>
</tr>
<tr>
<td>Vessel Types</td>
<td>
@(Html.Kendo().DropDownList()
.Name("vessel_type")
.Filter("contains")
.DataTextField("Text")
.DataValueField("Value")
.BindTo(new List<SelectListItem>() {
new SelectListItem() {
Text = "AHTS",
Value = "AHTS",
},
new SelectListItem() {
Text = "PSV",
Value = "PSV"
},
new SelectListItem() {
Text = "Special",
Value = "Special"
},
new SelectListItem() {
Text = "Standby",
Value = "Standby"
},
new SelectListItem() {
Text = "Tug",
Value = "Tug"
}
}))
</td>
</tr>
<tr>
<td>Duties</td>
<td>
@(Html.Kendo().MultiSelect()
.Name("workscopecode")
.DataTextField("WorkScopeName")
.DataValueField("WorkScopeName")
.Placeholder("Select Duties")
.AutoBind(false)
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetDuties", "FormAssets");
})
.ServerFiltering(true);
})
)
</td>
</tr>
<tr>
<td>Onhire Location</td>
<td></td>
</tr>
<tr>
<td>Fixture Type</td>
<td></td>
</tr>
</table>
<button id="search-button" type="button">Search</button>
</text>);
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(10)
.Model(model => model.Id(p => p.fixture_idx))
.Read(read => read.Action("readFixtures", "Search"))
))
var sub_filter = { logic: "or", filters: [] }
更新 问题是
sub_filterfiltersdataSource.filter（）方法中传递
仔细检查过滤器
对象结构。支持所需的行为：
更新
问题是sub_filter
从未添加到filters
数组中，该数组在dataSource.filter（）方法中传递
仔细检查过滤器
对象结构。支持所需的行为：
好的，为了让它工作，我对过滤器本身的格式化有一个小错误。为了纠正这一点，我做了以下更改，现在允许对数组进行迭代，并将其作为单个项传递给搜索过滤器
if (search_duties) {
var sub_filter = {
logic: "or",
filters: []
}
$.each(search_duties, function (i, v) {
sub_filter.filters.push(
{
field: "workscopecode",
operator: "eq",
value: v
})
})
filters.push(sub_filter);
}
请注意，支架的拆卸改变了这一点：
$.each(search_duties, function (i, v) {
sub_filter.filters.push[
{
field: "workscopecode",
operator: "eq",
value: v
}
]
console.log(v)
})
对此，请改为：
$.each(search_duties, function (i, v) {
sub_filter.filters.push(
{
field: "workscopecode",
operator: "eq",
value: v
})
})
由于[]已在var filters中定义：[]我不需要在实际的筛选器中重新设置它，否则输出将看起来像[[…filters…]]，这会导致它什么也不做。好的，因此要使其工作，我对筛选器本身的格式设置有一个小错误。为了纠正这一点，我做了以下更改，现在允许对数组进行迭代，并将其作为单个项传递给搜索过滤器
if (search_duties) {
var sub_filter = {
logic: "or",
filters: []
}
$.each(search_duties, function (i, v) {
sub_filter.filters.push(
{
field: "workscopecode",
operator: "eq",
value: v
})
})
filters.push(sub_filter);
}
请注意，支架的拆卸改变了这一点：
$.each(search_duties, function (i, v) {
sub_filter.filters.push[
{
field: "workscopecode",
operator: "eq",
value: v
}
]
console.log(v)
})
对此，请改为：
$.each(search_duties, function (i, v) {
sub_filter.filters.push(
{
field: "workscopecode",
operator: "eq",
value: v
})
})
因为[]已经在var filters中定义：[]我不需要在实际的过滤器中关闭它，否则输出将看起来像[[…filters…]]，这导致它什么也不做