I am unable to center the text in the group headers of my RadGrid. When I inspect the page I see that the header row is comprised of two <td> tags instead of one. The second <td> holds the desired text and is center-aligned, but because of the extra cell the text appears pushed over towards the right.
Here's the relevant code:
<
p
><
telerik:RadGrid
runat
=
"server"
ID
=
"RadGridUsers"
<br> AutoGenerateColumns="False" <
br
> ShowGroupPanel="False"<
br
> GroupingSettings-GroupContinuesFormatString=""<
br
> OnNeedDataSource="RadGridNeedDataSource"<
br
> AllowPaging="True" <
br
> OnColumnCreated="RadGridColumnCreated"<
br
> OnItemCreated="RadGridItemCreated"<
br
> EnableViewState="True"><
br
> <
ClientSettings
><
br
> <
Scrolling
UseStaticHeaders
=
"True"
ScrollHeight
=
"100px"
/><
br
> </
ClientSettings
><
br
> <
MasterTableView
AllowAutomaticUpdates
=
"False"
AllowPaging
=
"True"
PageSize
=
"20"
PagerStyle-AlwaysVisible
=
"True"
AllowSorting
=
"True"
AllowFilteringByColumn
=
"True"
Width
=
"100%"
><
br
> <
GroupByExpressions
><
br
> <
telerik:GridGroupByExpression
><
br
> <
GroupByFields
><
br
> <
telerik:GridGroupByField
FieldName
=
"Department"
SortOrder
=
"Ascending"
/><
br
> </
GroupByFields
><
br
> <
SelectFields
><
br
> <
telerik:GridGroupByField
FieldName
=
"Department"
/><
br
> </
SelectFields
><
br
> </
telerik:GridGroupByExpression
><
br
> </
GroupByExpressions
><
br
> <
GroupHeaderItemStyle
BackColor
=
"#99bbff"
ForeColor
=
"DarkBlue"
HorizontalAlign
=
"Center"
Font-Bold
=
"True"
/><
br
> <
GroupHeaderTemplate
><
br
> <
asp:Label
runat
=
"server"
ID
=
"Label5"
Text='<%# Eval("Department")%>'/><
br
> </
GroupHeaderTemplate
><
br
> <
SortExpressions
><
br
> <
telerik:GridSortExpression
FieldName
=
"LastName"
SortOrder
=
"Ascending"
/><
br
> </
SortExpressions
></
p
>
In the ColumnCreated event I'm hiding the group splitter:
<p>
Protected
Sub
RadGridColumnCreated(
ByVal
sender
As
Object
,
ByVal
e
As
GridColumnCreatedEventArgs)<br>
If
(
TypeOf
(e.Column)
Is
GridGroupSplitterColumn)
Then
e.Column.Visible =
False
<br>
End
Sub
</p>
In the ItemCreated event I'm removing the grouping controls:
<p>
Protected
Sub
RadGridItemCreated(
ByVal
sender
As
Object
,
ByVal
e
As
GridItemEventArgs)<br>
If
(
TypeOf
(e.Item)
Is
GridFilteringItem)
Then
<br>
Dim
item
As
GridFilteringItem = e.Item<br>
If
(
TypeOf
(e.Item)
Is
GridGroupHeaderItem)
Then
<br> e.Item.Cells(0).Controls.Clear()<br> e.Item.Cells(0).Width = 0<br>
End
If
<br>
End
Sub
</p>
The output looks something like this:
<tr class="rgGroupHeader">
<td style="width:0;"></td>
<td style="text-align:center;">Foobar</td>
</tr>
...followed by the rows of data.
Hi,
I have two roles in my application. user and manager. User has to fill 5 columns in a grid and submit request. For manager, when he enters, grid has to display all values entered by user and also has to be additional column (6th column) to enter his comments across each row of grid and approve/reject.
In short, one column of grid has to be in edit/update mode and other columns has to be in read-mode.
Please throw some light on this how to proceed.
Am using C# for coding.
Thanks,
Hari
Hi,
I am using RadTooltip to show some additional info inside a RadGrid cell. The tooltip is showing fine when the page loads. I have a scenario where on some user action, the grid data will change. So I am doing this using a service. The service will load the grid (ascx) in code behind and send back the html code. The html code contains the tool tip with some differences in it. Not sure why it is behaving like this ? The telerik classes not getting applied.
On Load
<div style="position: absolute; z-index: 8000; visibility: hidden; left: 227px; top: 542px; display: none;" unselectable="on" class="RadToolTip RadToolTip_Default rtVisibleCallout rosterPopup rtShadow rtRoundedCorner" id="RadToolTipWrapper_ctl00_PlaceHolderMain_ctl00_ctl00_TelerikRosterGridView_ctl00_ctl05_RadToolTipLastName"><div class="rtRelativeWrapper"><span style="visibility: visible;" class="rtCallout rtCalloutTopLeft"> </span><div class="rtContent"><div><div><p>Tooltip content</p></div></div></div></div></div>
Code behind
<div style="display:none;position:absolute;" id="ctl00_TelerikRosterGridView_ctl00_ctl07_RadToolTipLastName" class="rosterPopup"><div><p>Tooltip content</p></div><input id="ctl00_TelerikRosterGridView_ctl00_ctl07_RadToolTipLastName_ClientState" name="ctl00_TelerikRosterGridView_ctl00_ctl07_RadToolTipLastName_ClientState" type="hidden"></div>
Thanks
Kumaran
Hi,
i am new at developping in ASP.net using Kendo UI.
I have two grid and i want to load one of them depending on the choice of the dropdown list.
i mean, if the user choose Externe in the dropdown list, the grid with the externalentrepriseviewmodel should be loaded. Else the grid with the internalentrepriseviewmodel should be loaded.
Don't know how to do it. Please help me.
here is my view code:
001.
@model DGBFIP.SDP.ViewModel.Areas.Repository.Entreprise.EntrepriseViewModel
002.
@
using
DGBFIP.SDP.ViewModel.Areas.Repository.Entreprise
003.
@{
004.
005.
Layout =
"~/Views/Shared/_Layout.cshtml"
;
006.
}
007.
008.
009.
@Html.HiddenFor(model => model.Id)
010.
@Html.HiddenFor(model => model.CurrentUserId)
011.
012.
@Html.LabelFor(model => model.type)
013.
@Html.Kendo().DropDownListFor(model => model.type).DataTextField(
"Text"
).DataValueField(
"Value"
).DataSource(source =>
014.
{
015.
source.Read(read =>
016.
{
017.
read.Action(
"GetType"
,
"Enterprise"
,
new
{ area =
"Repository"
});
018.
});
019.
020.
}).HtmlAttributes(
new
{ style =
"width: 75%"
}).OptionLabel(
"Choisissez le type d'entreprise"
)
021.
022.
@(Html.Kendo().Grid<ExternalEntrepriseViewModel>()
023.
.Name(
"grid"
)
024.
.AutoBind(
false
)
025.
.Columns(columns =>
026.
{
027.
columns.Bound(c => c.Id).Visible(
false
).Hidden(
true
);
028.
columns.Bound(c => c.CurrentUserId).Visible(
false
).Hidden(
true
);
029.
columns.Bound(c => c.type);
030.
columns.Bound(c => c.Name);
031.
columns.Bound(c => c.telephone);
032.
columns.Bound(c => c.fax);
033.
columns.Bound(c => c.email);
034.
columns.Bound(c => c.continent);
035.
columns.Bound(c => c.pays);
036.
columns.Bound(c => c.address);
037.
columns.Command(command => { command.Edit().Text(
"Modifier"
).UpdateText(
"Enregistrer"
).CancelText(
"Annuler"
); command.Destroy().Text(
"Supprimer"
); }).Width(250);
038.
})
039.
040.
.ToolBar(toolbar => toolbar.Create().Text(
"Ajouter une entreprise externe"
)) @*Ajout du bouton ajouter un type de financement*@
041.
042.
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName(
"_entrepriseexterne"
).Window(x => x.Title(
"Editer ....."
)))
043.
.Scrollable()
044.
.Sortable()
045.
.Filterable(x => x.Mode(GridFilterMode.Row))
046.
.Pageable(pageable => pageable
047.
.Refresh(
true
)
048.
.PageSizes(
true
)
049.
.ButtonCount(5))
050.
.DataSource(dataSource => dataSource
051.
.Ajax()
052.
.Model(model => model.Id(p => p.Id))
053.
.Read(read => read.Action(
"GetAll"
,
"Enterprise"
,
new
{ area =
"Repository"
}).Data(
"AdditionalData"
))
054.
.Create(create => create.Action(
"Create"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
055.
.Destroy(delete => delete.Action(
"Destroy"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
056.
.Update(update => update.Action(
"Update"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
057.
058.
.PageSize(20)
059.
)
060.
)
061.
062.
@(Html.Kendo().Grid<InternalEntrepriseViewModel>()
063.
.Name(
"grid2"
)
064.
.AutoBind(
false
)
065.
.Columns(columns =>
066.
{
067.
columns.Bound(c => c.Id).Visible(
false
).Hidden(
true
);
068.
columns.Bound(c => c.CurrentUserId).Visible(
false
).Hidden(
true
);
069.
columns.Bound(c => c.type);
070.
columns.Bound(c => c.Name);
071.
columns.Bound(c => c.telephone);
072.
columns.Bound(c => c.fax);
073.
columns.Bound(c => c.email);
074.
columns.Bound(c => c.province);
075.
columns.Bound(c => c.address);
076.
columns.Bound(c => c.rccm);
077.
columns.Bound(c => c.statistic);
078.
columns.Command(command => { command.Edit().Text(
"Modifier"
).UpdateText(
"Enregistrer"
).CancelText(
"Annuler"
); command.Destroy().Text(
"Supprimer"
); }).Width(250);
079.
080.
})
081.
082.
.ToolBar(toolbar => toolbar.Create().Text(
"Ajouter une entreprise locale"
)) @*Ajout du bouton ajouter un type de financement*@
083.
084.
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName(
"_entrepriselocale"
).Window(x => x.Title(
"Editer ....."
)))
085.
.Scrollable()
086.
.Sortable()
087.
.Filterable(x => x.Mode(GridFilterMode.Row))
088.
.Pageable(pageable => pageable
089.
.Refresh(
true
)
090.
.PageSizes(
true
)
091.
.ButtonCount(5))
092.
.DataSource(dataSource => dataSource
093.
.Ajax()
094.
.Model(model => model.Id(p => p.Id))
095.
.Read(read => read.Action(
"GetAll"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
096.
.Create(create => create.Action(
"Create"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
097.
.Destroy(delete => delete.Action(
"Destroy"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
098.
.Update(update => update.Action(
"Update"
,
"Enterprise"
,
new
{ area =
"Repository"
}))
099.
100.
.PageSize(20)
101.
)
102.
)
103.
<style>
104.
#grid {
105.
display: none;
106.
}
107.
#grid2 {
108.
display: none;
109.
}
110.
</style>
Hi,
Will editor supports Google fonts "Roboto" and "Playfair Display" ? We already add this fonts to editor font name collections
I have downloaded and add this font to my machine, but still when i select this font in editor font dropdown the selected text not changed.
Is there any way to embed this fonts to Radeditor instead of installing in client machine.
Thanks.
I am looking for controls that will enable me to easily draw diagrams that are like SQL relationships. Basically with each object having a title (table name), and having multiple properties under it (like table columns). And then I want to link the properties in one object to a property in another object (like SQL links). similar to the attached image.
Do the Telerik controls support this type of view?
I'm using a RadButton and trying to get the button background to transparent. I am using an image on the button. In Chrome it displays as expected but in IE 11 it does not display properly. I am using Telerik version 2014.1.225.40.
.rbClearButton
{
background-color
:
transparent
!important
;
border
:
none
!important
;
color
:
#000
!important
;
/* optional, depending on the background */
}
RadButton rb =
new
RadButton();
rb.Icon.PrimaryIconUrl =
"~/Styles/images/alarm_red.png"
;
rb.ToolTip =
"Alarm"
;
rb.CssClass =
"rbClearButton"
;
//rb.BackColor = Color.Yellow;