1

KendoUI 版本：2013.3.1316.545 操作系统：Windows 8 .NET：4.5/C#

我在 RazorView 上有一个 multiSelect 和一个网格。我的目的是让用户在多选框中输入多个项目，当他们单击一个按钮时，在数据库中搜索这些项目并将它们显示在下面的网格中，方法是将多选中的选定项目添加到一个字符串中并将该字符串传递给我的控制器动作。

所有这些都是第一次正常工作。如果用户修改了多选中的项目，然后单击搜索按钮，我将重新创建查询字符串并从按钮单击事件处理程序中调用我的控制器操作。我使用以下代码重新加载数据。

    var dSource = $( grid ).data( 'kendoGrid' ).dataSource;
    dSource.transport.options.read.url = newUrl;
    dSource.read();

虽然我可以在调试器中看到 dSource.read() 函数已执行。但是在第一次调用之后，调用永远不会触发我的操作方法。如果我完全刷新页面并再次调用它，它就可以工作。我的假设是尽管 url 中的查询字符串已更改，但数据源已被缓存并且永远不会再次执行。我将如何使它工作？非常感谢任何帮助。

这是所有查看代码：

<div class="PCSectionPaddingTop5">
<form role="form">
    <div class="form-group">
        <label><span class="label label-danger">Ingredient(s)</span></label>
    </div>
    <div class="form-group">
        @(Html.Kendo().MultiSelect()
                    .Name( "IngredientMultiSelect" )
                    .DataTextField( "Name" )
                    .DataValueField( "PKGuid" )
                    .Placeholder( "Select Ingredients..." )
                    .Filter( Kendo.Mvc.UI.FilterType.Contains )
                    .AutoBind( true )
                    .DataSource( ds => ds
                         .Read( r => r.Action( "GetAllIngredients", "Ingredient" ).Type( HttpVerbs.Post ) )
                    ))
    </div>
    <div class="form-group">
        <button onclick="ReloadRec2IngrSearchGrid()" type="button" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-search"></i>&nbsp;Search by Ingredient(s)</button>
        <button onclick="ClearRec2IngrSearchGrid()" type="button" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-retweet"></i>&nbsp;Reset</button>
    </div>
    <div class="form-group">
        @(Html.Kendo()
                    .Grid<PowerChef.DAL.ViewModels.RecipeVM>()
                    .Name( "Recipe2IngrSearchKGrid" )
                    .Pageable()
                    .Scrollable()
                    .Sortable()
                    .Filterable()
                    .Resizable( resize => resize.Columns( true ) )
                    .Editable( ed => ed.Mode( GridEditMode.InLine ) )
                    .Columns( c =>
                    {
                        //c.Bound(x => x.PKId).Hidden(true);
                        c.Bound( x => x.PKGuid ).Hidden( true );
                        c.Bound( x => x.Name ).Title( "Name" );
                        c.Bound( x => x.Included ).Width( "20%" ).Sortable( false ).Filterable( false ).Title( "Include" )
                             .ClientTemplate( "<input type='checkbox' #= Included === true ? checked='checked' : '' # class='chkbx' />" );
                    }
                    )
                    .AutoBind( false )
                    .DataSource( ds => ds
                         .Ajax()
                         .ServerOperation( true )
                         .Read( r => r.Action( "GetRecipe2IngrSearchRecipes", "CustomerMenu", new { selectedIngrs = "" } ).Type( HttpVerbs.Post ) )
                         .Model( m =>
                         {
                             //m.Id(d => d.PKId);
                             //m.Field(d => d.PKId).DefaultValue(-1);
                             m.Id( d => d.PKGuid );
                             m.Field( d => d.PKGuid ).DefaultValue( new Guid() );
                         } )
                         .PageSize( 20 )
                    ))
    </div>
    <div class="form-group">
        <div class="pull-right">
            <button onclick="submitRec2IngrKGridSelection()" type="button" class="btn btn-info btn-xs"><i class="glyphicon glyphicon-download"></i>&nbsp;Finish Selection</button>
        </div>
    </div>
</form>

这是我的javascript方法：

function ReloadRec2IngrSearchGrid() {

try {
    if ( !_.isUndefined( $( "#IngredientMultiSelect" ) ) && !_.isNull( $( "#IngredientMultiSelect" ).data( "kendoMultiSelect" ) ) && !_.isEmpty( $( "#IngredientMultiSelect" ).data( "kendoMultiSelect" ).value() ) ) {
        var parmValues = $( "#IngredientMultiSelect" ).data( "kendoMultiSelect" ).value();
        var parmName = "ingrId";
        ReloadDataSourceForGrid( "#Recipe2IngrSearchKGrid", parmName, parmValues );
    }
    else {
        PcGfShowNotification( 'error', "Error", "Invalid Parameter!" );
    }
} catch ( e ) {
    PcGfShowNotification( 'error', "Error", PcGvMsgTechFailure );
}

}

更多 JavaScript：

function ReloadDataSourceForGrid( grid, parmName, parmValues ) {
try {
    var kGridUrl = $( grid ).data( 'kendoGrid' ).dataSource.transport.options.read.url;
    var newUrl = PCAddQueryStringValueArrayToURL( kGridUrl, parmName, parmValues );
    var dSource = $( grid ).data( 'kendoGrid' ).dataSource;
    dSource.transport.options.read.url = newUrl;
    dSource.read();
    //$( grid ).data( 'kendoGrid' ).dataSource.transport.options.read.url = newUrl;
    //$( grid ).data( 'kendoGrid' ).dataSource.read();
} catch ( e ) {
    throw e;
}

}

谢谢。巴布。

4

0 回答 0