문제

도로 정보를 나열하고 드롭 다운리스트에서 양보를 선택하여 도로를 필터링 할 수있는 도구 모음 템플릿을 원하는 그리드가 있습니다.

다음과 같은

내 코드 :

cshtml

<div id="datagrid">
    @(Html.Kendo().Grid<SustIMS.Models.RoadModel>()
        .Name("datagrid_Roads")
        .Columns(columns =>
        {
            columns.Bound(r => r.RoadCode).Title(ViewBag.lblCode).Width(140);
            columns.Bound(r => r.RoadType).Title(ViewBag.RoadType).Width(140);
            columns.Bound(r => r.RoadMediumDescription).Title(ViewBag.lblDescription);
            columns.Bound(r => r.ConcessionCode).Title("CCode").Hidden();
            columns.Bound(r => r.ConcessionMediumDescription).Hidden().Title(ViewBag.Concession);
        })
        .ToolBar(toolbar =>
        {
            toolbar.Template(@<text>
                <div class="toolbar">
                        <label class="category-label" for="category">Concessão:</label>
                            @(Html.Kendo().DropDownList()
                                .Name("concessions")
                                .OptionLabel("All")
                                .DataTextField("ConcessionMediumDescription")
                                .DataValueField("CCode")
                                .AutoBind(false)
                                .Events(e => e.Change("concessionChange"))
                                .DataSource(ds =>
                                {
                                    ds.Read("ConcessionFiltering", "MasterData");
                                })
                            ) 
                            </div>
            </text>);
        })
        .HtmlAttributes(new { style = "height: 534px;" })
        ...
        )
    )
</div>

<script type="text/javascript">

    function concessionChange() {
        var value = this.value(),
                grid = $("#datagrid_Roads").data("kendoGrid");

        if (value) {
            grid.dataSource.filter({ field: "ConcessionMediumDescription", operator: "eq", value: value });
        } else {
            grid.dataSource.filter({});
        }
    }
.

컨트롤러

public ActionResult ConcessionFiltering()
{
    ConcessionModel cm = new ConcessionModel();
    var aux = cm.getConcessions();
    return Json(aux.concessions.Select(c => c.concession.mediumDescription).Distinct(), JsonRequestBehavior.AllowGet);
}
.

이것은 현재 결과입니다 :

zzz

목록은 현재 가지고있는 양보 수의 "정의되지 않은"16 번 단어로 채워집니다.정의되지 않은 옵션 중 하나를 선택하면 양보의 실제 이름이 표시되며 그리드를 새로 고칩니다.

목록이 양보 이름을 표시하고 그 중 하나를 선택할 때 양보로 그리드를 필터링하기를 원합니다.내가 누락 된 것은 무엇입니까?

도움이 되었습니까?

해결책

를 변경하십시오
return Json(aux.concessions.Select(c => c.concession.mediumDescription).Distinct(), hJsonRequestBehavior.AllowGet);
.

~

return Json(aux.concessions.Select(c => new ConcessionModel { Description = c.concession.mediumDescription }).Distinct(), JsonRequestBehavior.AllowGet);
.

다른 팁

첫째, Controller 메소드에서 반환하는 JSON을 두 번 확인하십시오.ConcessionMediumDescriptions가 데이터가 없을 수있는 것처럼 보입니다.

두 번째로 "ConcessionMediumDescription"데이터 객체 목록을 반환하는 컨트롤러에서 표시됩니다.

나는 그것이이 것처럼 보입니다 ...

{ConcessionMediumDescription: {
  CCode: 'mycode',
  ...
  }
}
.

타이틀 필드를이 JSON의 일부로 반환하고 드롭 다운의 텍스트 필드에 사용할 수 있습니다.이것은 그 컨트롤러에서 돌아 오는 것에서 짐작하는 것입니다.


이상적인 JSON은 이렇게 엿볼 것입니다 ...

[{
  {{id: 'id1'},{text: 'text1'}},
  {{id: 'id2'},{text: 'text2'}}
}]
.

로 드롭 다운을 해제하십시오.

.DataTextField("text")
.DataValueField("id")
.

이런 식으로 JSON 리턴 라인을해야합니다.

return Json(aux.concessions.Select(c => new { Value = c.concession.DATAVALUE, Text = c.concession.DATATEXT }), JsonRequestBehavior.AllowGet);
.

DataValue 및 DataText

를 변경합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top