Telerik Rad Grid на движке представления Razor ASP.NET MVC - DetailView изначально не заполняется - PullRequest
0 голосов
/ 16 мая 2011

ОК ... Я потратил слишком много времени на эту проблему, поэтому передаю ее экспертам -> ВАМ.

Моя ОЧЕНЬ простая страница ASP.NET MVC (v3 с Razor View Engine) использует элемент управления Telerik Rad Grid для отображения списков некоторых типов, а затем у меня есть соответствующие коды, отображаемые в окне DetailsView сетки.

Делать население легко. У меня есть ViewModel для моего типа TypeCodeList и отправляю его в строго типизированное представление для заполнения сетки. Это работает ОТЛИЧНО ... и сетка выглядит великолепно - спасибо Telerik. Однако я добавил DetailsView, чтобы затем заполнить дочерние TypeCodes таким же образом. Плохо то, что когда моя сетка заполняется, я выбираю треугольник слева, чтобы развернуть дерево и увидеть дочерние записи, там ничего нет. НО, если я выберу кнопку «Обновить» в нижней части сетки, ТО затем я смогу нажать треугольник и отобразятся дочерние записи.

Итак (в итоге), дочерние записи не отображаются при начальной загрузке. Только когда я выбираю AJAX-обновление сетки, я получаю детей. В противном случае он работает как требуется.

Я пытался узнать, смогу ли я программно запустить обновление через javascrip при загрузке страницы. ИЛИ если я смогу заполнить объект самостоятельно, когда выбрано, не выполняя обновление сначала - это было бы предпочтительнее.

Ниже мой код:

Соответствующий код контроллера (я забрал методы обновления, удаления, вставки, регистрации и доступа к данным)

[HandleErrorWithElmah]
public partial class HostController : Controller
{

    /// <summary>
    /// Index - Home for HostController
    /// </summary>
    /// <returns></returns>
    public ActionResult Index()
    {
        return View();
    }

    #region Type List Section

    /// <summary>
    /// Gets the list of TypeLists - yea...say that again
    /// </summary>
    [GridAction]
    public ActionResult TypeCodeList()
    {

        var model = GetActiveTypeLists();

        // Get all of the type lists and send them to the view
        return View(model);

    }


    /// <summary>
    /// The ajaxified Select
    /// </summary>
    /// <returns></returns>
    [AcceptVerbs(HttpVerbs.Post)]
    [GridAction]
    public ActionResult _TypeCodeList()
    {

        var model = GetActiveTypeLists();
        return Json(new GridModel(model));


    }

    /// <summary>
    /// Simply a wrapper to get all of the current type list values.
    /// </summary>
    /// <returns></returns>
    private IEnumerable<TypeCodeListViewModel> GetActiveTypeLists()
    {

        var model = from p in entityRepository.Find<TypeList>(p => p.IsActive == true)
                    select new TypeCodeListViewModel
                    {
                        TypeListId = p.TypeListId,
                        Name = p.Name,
                        Description = p.Description,
                        IsActive = p.IsActive
                    };


        return model;

    }

    #endregion

    #region Type Code Section

    [AcceptVerbs(HttpVerbs.Post)]
    [GridAction]
    public ActionResult _TypeCodeForTypeListAjax(int typeListId)
    {
        var model = GetActiveTypeCodes(typeListId);
        return Json(new GridModel(model));
    }


    /// <summary>
    /// Simply a wrapper to get all of the current type Code values.
    /// </summary>
    /// <returns></returns>
    private IEnumerable<TypeCodeViewModel> GetAllActiveTypeCodes()
    {

        var model = from p in entityRepository.Find<OurLeaguePlay.Models.TypeCode>(p => p.IsActive == true).OrderBy(ord => ord.CodeName)
                    select new TypeCodeViewModel
                    {
                        TypeCodeId = p.TypeCodeId,
                        TypeListId = p.TypeListId,
                        CodeName = p.CodeName,
                        CodeValue = p.CodeValue,
                        Description = p.Description,
                        IsActive = p.IsActive
                    };


        return model;

    }


    /// <summary>
    /// Simply a wrapper to get all of the current type Code values.
    /// </summary>
    /// <returns></returns>
    private IEnumerable<TypeCodeViewModel> GetActiveTypeCodes(int typeListId)
    {

        var model = from p in entityRepository.Find<OurLeaguePlay.Models.TypeCode>(p => p.IsActive == true && 
                                                                                        p.TypeListId == typeListId).OrderBy(ord => ord.CodeName)
                    select new TypeCodeViewModel
                    {
                        TypeCodeId = p.TypeCodeId,
                        TypeListId = p.TypeListId,
                        CodeName = p.CodeName,
                        CodeValue = p.CodeValue,
                        Description = p.Description,
                        IsActive = p.IsActive
                    };


        return model;

    }


    #endregion

}

Вот мой код просмотра: (Я удалил все свои неудачные попытки JavaScript, чтобы попытаться принудительно загрузить страницу при загрузке.)

    @model IEnumerable<TypeCodeListViewModel>
@using Telerik.Web.Mvc.UI
@using Telerik.Web.Mvc
@using OurLeaguePlay.ViewModels
@{Html.Telerik().Grid<TypeCodeListViewModel>(Model)
        .Name("TypeLists")
        .DetailView(details => details.ClientTemplate(
            Html.Telerik().Grid<TypeCodeViewModel>()
                .Name("TypeCode_<#= TypeListId #>")
                .DataKeys(keys => keys.Add(k => k.TypeCodeId))
                .Columns(columns =>
                {
                    columns.Bound(o => o.CodeName).Width(40);
                    columns.Bound(o => o.CodeValue).ReadOnly(true).Width(40);
                    columns.Bound(o => o.Description).Width(100);
                })
                .DataBinding(dataBinding =>
                    {
                        dataBinding.Ajax().Select("_TypeCodeForTypeListAjax", "Host", new { typeListId = "<#= TypeListId #>" })
                                          .Enabled(true);
                    }
                    )
                .Pageable()
                .Sortable()
                .NoRecordsTemplate("No Type Codes exist for the selected Type List")
                .ToHtmlString()
            )
        )
        .DataKeys(keys => keys.Add(k => k.TypeListId))
        .Columns(columns =>
        {
            columns.Bound(o => o.Name).Width(100);
            columns.Bound(o => o.Description).Width(150);
            columns.Command(commands =>
            {
                commands.Edit().ButtonType(GridButtonType.Image);
                commands.Delete().ButtonType(GridButtonType.Image);
            }
                           ).Width(30);
        })
        .DataBinding(dataBinding =>
        {
            dataBinding.Ajax().Select("_TypeCodeList", "Host")
                              .Update("UpdateTypeList", "Host")
                              .Insert("InsertTypeList", "Host")
                              .Delete("DeleteTypeList", "Host")
                              .Enabled(true);
            dataBinding.Server().Select("TypeCodeList", "Host", new { ajax = ViewData["ajax"] });
        }
        )
        .Editable(editable => editable.Enabled(true).Mode(GridEditMode.InLine))
        .Pageable(page => page.PageSize(10))
        .Sortable()
        .Selectable()
        .Scrollable(scroll => scroll.Enabled(false))
        .NoRecordsTemplate("No Type Lists can be retrieved from the database")
        .ToolBar(commands => commands.Insert())
        .Render();
}

Наконец ... вот классы ViewModel:

public class TypeCodeListViewModel 
{

    [ScaffoldColumn(false)]
    public int TypeListId { get; set; }

    [Required(ErrorMessage = "Required")]
    [StringLength(25, ErrorMessage = "Max Length is 25")]
    public string Name { get; set; }

    [Required(ErrorMessage = "Required")]
    [StringLength(25, ErrorMessage="Max Length is 25")]
    public string Description { get; set; }

    [ScaffoldColumn(false)]
    public bool IsActive { get; set; }


}

public class TypeCodeViewModel
{

    [ScaffoldColumn(false)]
    public int TypeCodeId { get; set; }

    [ScaffoldColumn(false)]
    public int TypeListId { get; set; }

    [Required(ErrorMessage = "Required")]
    [StringLength(25, ErrorMessage = "Max Length is 25")]
    [DisplayName("Name")]
    public string CodeName { get; set; }

    [Required(ErrorMessage = "Required")]
    [StringLength(25, ErrorMessage = "Max Length is 25")]
    [DisplayName("Value")]
    public string CodeValue { get; set; }

    [StringLength(500, ErrorMessage = "Max Length is 500")]
    public string Description { get; set; }

    [ScaffoldColumn(false)]
    public bool IsActive { get; set; }

}

1 Ответ

0 голосов
/ 23 мая 2011

Ну ... я думаю, что я понял это сам ... это было так просто, как просто позволить сетке связывать себя и не вводить данные в нее через не-ajax метод, который вызывается при первоначальном отображении стр.

The

Public ActionResult TypeCodeList()

Функция должна быть просто обновлена ​​до следующего:

Public ActionResult TypeCodeList()
{
    return View();
}

без декоратора [GridAction].

Если вы не форсируете значения в сетке, она свяжется с помощью метода Ajax, а затем дочерние сетки заполнятся при расширении.

...