This is a migrated thread and some comments may be shown as answers.

Grid First row not displayed the same way

1 Answer 51 Views
Grid
This is a migrated thread and some comments may be shown as answers.
RingRing
Top achievements
Rank 1
RingRing asked on 07 Nov 2013, 12:21 PM
Page code : 

01.<h2>Groups</h2>
02.<br />
03. 
04.<fieldset>
05.    <table style="border: none; width:97%">
06.        <tr>
07.            <td style="text-align:left">
08.                <input type="button" id="btnNewGroup" value="Create New Group" onclick="window.location = 'CreateGroup';" style="width:150px" />
09.            </td>
10.        </tr>
11.    </table>
12.</fieldset>
13. 
14.<%= Html.Kendo().Grid(Model).Name("grid").HtmlAttributes(new { style = "width: 90%" })
15.    .DataSource(data => data
16.            .Server()
17.            .Model(model => model.Id(g => g.GroupID))
18.            .Destroy(delete => delete.Action("DeleteGroup", "Group"))
19.            )
20.    .Columns(columns =>
21.    {
22.        columns.Bound(o => o.Name).Width(400);
23.        columns.Bound(o => o.IsActive).Width(100);
24.        columns.Bound(o => o.ContactCount).Width(100);
25.        columns.Command(com =>
26.            {
27.                com.Custom("EditGroup").Text("Edit").Action("UpdateGroup", "Group").SendDataKeys(true).HtmlAttributes(new { style="width:80px" });
28.                com.Destroy().Text("Delete").HtmlAttributes(new { style = "width:80px" });
29.            });          
30.    })
31.    .Sortable()
32.    .Editable(editing => editing.DisplayDeleteConfirmation(true))
33.    .Scrollable()
34.%>
My first row shows the 2 buttons separeted by a carriage return, but other rows are displayed with the buttons next to each other.

All my Kendo grids are displayed like that. Does anyone has got an idea why ? 
Thanks.

The result of the page can be shown in the attached file.

EDIT : This happens with ALL web browsers tested : IE10, Chrome, Mozille Firefox 22.0.

1 Answer, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 11 Nov 2013, 09:39 AM
Hi Geoffroy,

Please refer to the end of this page:

http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/server-editing

When browsers encounter invalid nesting of HTML elements, they close the first occurrence of the given element, which in this case causes a line break.

Please move the Grid outside the outer <form>, or use Ajax editing.

Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
RingRing
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Share this question
or