Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
850
Wrong header positions in Chrome
posted

I've built a grid to display a list of notes. Everything looks fine when running in IE or Firexfox, but when using Chrome, the headers are in the wrong position. It looks like they are incorrectly aligned.

IE and Firefox

Chrome

 

Code:

@( Html.Infragistics().Grid(Model)
.ID("grdNotes")
.AutoGenerateColumns(false)
.UpdateUrl(Url.Action("EditListNotes"))
.PrimaryKey("Id")
.AutoCommit(false)
.Columns(column =>
{
	column.For(x => x.Id).DataType("string").HeaderText("Id").Width("50px");
	column.For(x => x.CustomerId).DataType("string").HeaderText("Customer Number").Width("60px");
	column.For(x => x.InvoiceId).DataType("string").HeaderText("Invoice Number").Width("60px");
	column.For(x => x.OrderId).DataType("string").HeaderText("Order/Project Number").Width("60px");
    column.For(x => x.AttachmentCount).DataType("int").HeaderText("Attachment Count").Width("50");
	column.For(x => x.DateLastEdit).DataType("date").HeaderText("Date Modified").Width("80px").Format(ViewBag.Culture.DateTimeFormat.ShortDatePattern);
	column.For(x => x.DateCreated).DataType("date").HeaderText("Date Created").Width("80px").Format(ViewBag.Culture.DateTimeFormat.ShortDatePattern);
	column.For(x => x.CreatedBy).DataType("string").HeaderText("Created By").Width("60px");
	column.For(x => x.Category).DataType("string").HeaderText("Category").Width("60px");
	column.For(x => x.Type).DataType("string").HeaderText("Type").Width("60px");
    column.For(x => x.Text).DataType("string").HeaderText("Text");
})
.Features(features =>
{
	features.Selection().Mode(SelectionMode.Row).MultipleSelection(false);
	features.Sorting();
	features.Resizing();
	features.Filtering().Mode(FilterMode.Simple);
	features.Hiding().ColumnSettings(settings =>
	{
		settings.ColumnSetting().ColumnKey("Id").Hidden(true);
		settings.ColumnSetting().ColumnKey("CustomerId").Hidden(true);
		settings.ColumnSetting().ColumnKey("InvoiceId").Hidden(true);
		settings.ColumnSetting().ColumnKey("OrderId").Hidden(true);
        settings.ColumnSetting().ColumnKey("AttachmentCount").Hidden(true);
		settings.ColumnSetting().ColumnKey("DateLastEdit").Hidden(true);
		settings.ColumnSetting().ColumnKey("DateCreated").Hidden(true);
	});
	//features.GroupBy();
	features.Updating().EnableAddRow(false).EnableDeleteRow(true).EditMode(GridEditMode.Row).StartEditTriggers(GridStartEditTriggers.DblClick).AddRowLabel("Add Note")
		.ColumnSettings(settings =>
	{
		settings.ColumnSetting().ColumnKey("Id").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("CustomerId").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("InvoiceId").ReadOnly(true);
        settings.ColumnSetting().ColumnKey("OrderId").ReadOnly(true);
        settings.ColumnSetting().ColumnKey("AttachmentCount").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("CreatedBy").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("DateLastEdit").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("DateCreated").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("Category").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("Type").ReadOnly(true);
		settings.ColumnSetting().ColumnKey("Text").ReadOnly(false);
	});
})
.Width("100%")
.DataBind()
.Render())

Im using jquery 12.1 with the igLoader framework.

Any ideas on how I can get this to play nicely with Chrome?

Parents Reply Children
No Data