1

我正在尝试将引导切换合并到我的 AwesomeMVC 网格 ( http://demo.aspnetawesome.com/GridDemo ) 的列中,但即使在初始化引导切换之后,切换也不会正确呈现。这是因为 AwesomeMVC 网格在页面加载后被渲染。

我不想在初始化引导切换时实现超时,因为网格加载时间可能不同。

有没有人尝试过使用 AwesomeMVC 实现任何类似的引导插件?

这是我的代码示例。

看法

@(Html.Awe().Grid("UserList")
              .Url(Url.Action("GetUser", "User"))
              .Persistence(Persistence.Local)
              .Selectable(SelectionType.None)
              .Parent("pagesize", "pagesize")
              .Columns(
                  new Column { Name = "Name", Header = "FullName", Width = 72, SortRank = 1, Sort = Sort.Asc },
                  new Column { Name = "Active", Header = "Active", Width = 60,  ClientFormatFunc = "CustomActive", Group = true}
                  ))

Javascript

//Custom content for Active ClientFormatFunc
var CustomActive = function (GetUserList_Result) {
    return "<input type=\"checkbox\" class=\"checkbox-toggle\" data-toggle=\"toggle\" data-on=\"Yes\" data-off=\"No\" data-size=\"small\">";
}

$(function () {
    $(".checkbox-toggle").bootstrapToggle();
});
4

1 回答 1

0

aweload一个你可以连接的事件,当你渲染复选框时,我认为你需要设置它的选中状态,所以你应该得到这样的结果:

  @(Html.Awe().Grid("UserList")
          .Url(Url.Action("GetUser", "User"))
          .Persistence(Persistence.Local)
          .Parent("pagesize", "pagesize")
          .Columns(
              new Column { Name = "Name", Header = "FullName"},
              new Column { ClientFormatFunc = "CustomActive", Width = 75}))

    <script type="text/javascript">
        $(function () {
            $('#UserList').on('aweload', function () {
                $(this).find(".checkbox-toggle").bootstrapToggle();
            });
        });

        //Custom content for Active ClientFormatFunc
        var CustomActive = function (model) {
            var checked = model.Active ? 'checked = "checked"' : '';
            return '<input type="checkbox" ' + checked + ' class="checkbox-toggle" data-toggle="toggle" data-on="Yes" data-off="No" data-size="small">';
        };
    <script>

我也删除.Selectable(SelectionType.None)了,因为默认情况下就是这样,而且我看到您按布尔列(活动)分组,不确定这是否有意义,它只会将您的网格分成 2 组,不需要 Column.Name,它用于绑定到模型以进行排序/分组,最好始终有至少 1 列没有宽度(如果将宽度设置为所有列并且网格宽度不匹配,它们将作为百分比工作)

于 2015-02-26T07:19:34.713 回答