Using HtmlAttributes to add a class to a Window object

[Adam]

I am trying to add a CSS class to a window object that is created when the popup is initialized for editing in a grid component but the class isn't being added to the window. Am I missing something here?

01.@(Html.Kendo().Grid<NotificationSystem.Web.Models.CategoryViewModel>()
02.                  .Name("categories")
03.                  .Columns(columns =>
04.                  {
05.                      columns.Command(command =>
06.                      {
07.                          command.Destroy().TemplateId("categories_delete");
08.                      }).Width(80);
09.                      columns.Bound(c => c.Name);
10.                      columns.Bound(c => c.Description);
11.                      columns.Bound(c => c.CreatedBy);
12.                      columns.Bound(c => c.Created);
13.                      columns.Command(command =>
14.                      {
15.                          command.Edit().TemplateId("categories_update");
16.                      }).Width(80);
17.                  })
18.                  .Scrollable()
19.                  .Sortable()
20.                  .Pageable(pageable => pageable
21.                      .Refresh(true)
22.                      .PageSizes(true)
23.                      .ButtonCount(5))
24.                  .NoRecords(true)
25.                  .Editable(editable =>
26.                  {
27.                      editable.Mode(GridEditMode.PopUp);
28.                      editable.TemplateName("CategoryEditor");
29.                      editable.Window(window =>
30.                      {
31.                          window.HtmlAttributes(new
32.                          {
33.                              @class = "k-window-lg"
34.                          });
35.                      });
36.                  })
37.                  .DataSource(dataSource => dataSource
38.                      .Ajax()
39.                      .PageSize(20)
40.                      .ServerOperation(false)
41.                      .Model(model => model.Id(m => m.Id))
42.                      .Create(create => create.Action("Create", "Categories"))
43.                      .Read(read => read.Action("Read", "Categories"))
44.                      .Update(update => update.Action("Update", "Categories"))
45.                      .Destroy(destroy => destroy.Action("Delete", "Categories"))
46.                  )
47.                  .Deferred()
48.                  )

[Georgi]

Hi Adam,

Generally speaking, the HtmlAttributes method is inherited from the WidgetBuilderBase class and it sets attributes to the generated html. However, in the context of the editor, no html is generated as the actual popup window is created on the client when the user presses the edit/create command. In other words, the configuration from the Editable.Window is serialized to a JS object which then is used when the window is created on the client. Therefore, the object passed to HtmlAttributes is ignored.

As a workaround I can suggest you to add the class within the Edit event handler of the grid.

e.g.

function onEdit(e) {
    e.container.addClass('k-window-lg');
}

Regards,
Georgi
Progress Telerik