Hi,
Currently we're using RadGrid in conjunction with the Scheduler as an "Event Picker" so the user can drag and drop onto the schedule.
The problem I'm facing is with the length of these events in the RadGrid. We're using Bootstrap for our responsive design framework.
Here is our RadGrid
<
div
class
=
"col-sm-7 col-md-5 col-lg-4 hidden-print"
id
=
"event-types-list-container"
>
<
div
id
=
"event-types-list"
>
<
telerik:RadGrid
runat
=
"server"
ID
=
"EventTypesRadGrid"
GridLines
=
"None"
AutoGenerateColumns
=
"False"
AllowAutomaticInserts
=
"True"
AllowAutomaticUpdates
=
"true"
ShowFooter
=
"false"
AllowScroll
=
"true"
AllowSorting
=
"false"
onitemdatabound
=
"EventTypesRadGrid_ItemDataBound"
>
<
clientsettings
allowrowsdragdrop
=
"True"
>
<
Selecting
AllowRowSelect
=
"True"
/>
<
ClientEvents
OnRowDropping
=
"Sch_AppointmentDropped"
/>
</
clientsettings
>
<
mastertableview
datakeynames
=
"ScheduleEventTypeID"
insertitemdisplay
=
"Bottom"
editmode
=
"InPlace"
ClientDataKeyNames
=
"ScheduleEventTypeID"
>
<
SortExpressions
>
<
telerik:GridSortExpression
FieldName
=
"Name"
SortOrder
=
"Ascending"
/>
</
SortExpressions
>
<
Columns
>
<
telerik:GridTemplateColumn
DataField
=
"Subject"
HeaderText
=
"Event Types"
>
<
ItemTemplate
>
<
asp:Label
runat
=
"server"
ID
=
"NameLabel"
Text='<%# Bind("Name") %>' CssClass="schedule-appointment-title events-container-appointment"></
asp:Label
>
</
ItemTemplate
>
<
ItemStyle
CssClass
=
"draggable"
/>
</
telerik:GridTemplateColumn
>
</
Columns
>
</
mastertableview
>
</
telerik:RadGrid
>
</
div
>
</
div
>
See RadGrid-1.jpg attachment.
The problem is the RadGrid is adding an inline style to itself of 390px (the width of the longest "event"). I've tried to override the styles with inline width: 170px for testing but to no success.
Is there a way to make the RadGrid obey the width of its parent and wrap the text of the "events" / rows