I am working on a real-time chat area in my site where I have a listbox that has chat messages show up as they come in. My issue is that I want all new message to show up at the bottom of the page, and to have the scroll position kept at the bottom of the page.
I found javascript to set the scroll-position to the bottom of the listbox on pageload, but some of the messages may contain large images that, on slow 3G/4G phones, take a bit to load in. When they finish loading in, they increase the length of the listbox's content, this making the scrollbar not be pinned to the bottom of the list.
I tried to alleviate this issue by using jQuery to scroll to the bottom of the listbox after all images are loaded, but for many users this results in the listbox's scroll position jerking around.
Is there an easier way to just *reverse* the scrolling direction of the listbox, or some alternative I am missing?
<
telerik:RadScheduler
runat
=
"server"
ID
=
"RadScheduler1"
AllowEdit
=
"False"
AllowInsert
=
"False"
AllowDelete
=
"False"
Height
=
"100%"
DayStartTime
=
"07:00:00"
DayEndTime
=
"23:00:00"
EnableDescriptionField
=
"True"
ShowAllDayRow
=
"False"
OnClientAppointmentClick
=
"OnClientApointmentClick"
OverflowBehavior
=
"Expand"
MonthView-AdaptiveRowHeight
=
"True"
>
<
MonthView
AdaptiveRowHeight
=
"false"
MinimumRowHeight
=
"5"
VisibleAppointmentsPerDay
=
"50"
/>
<
TimelineView
UserSelectable
=
"false"
/>
<
ResourceTypes
>
<
telerik:ResourceType
KeyField
=
"GroupID"
Name
=
"Group"
TextField
=
"GroupCssClass"
ForeignKeyField
=
"GroupID"
DataSourceID
=
"ldsGroups"
AllowMultipleValues
=
"true"
/>
</
ResourceTypes
>
<
WebServiceSettings
>
<
ODataSettings
InitialContainerName
=
""
></
ODataSettings
>
</
WebServiceSettings
>
<
AppointmentTemplate
>
<
div
class
=
"rsAptSubject"
>
<
div
style
=
"padding-right: 20px;"
><%# Eval("Subject") %></
div
>
<
div
style
=
"position:absolute;top:0;right:0;padding: 1px;"
>
<
span
style
=
"cursor: pointer; cursor: hand;"
>
<
asp:ImageButton
runat
=
"server"
ID
=
"Button1"
ImageUrl
=
"/images/icons/outlook.png"
AlternateText
=
"Export to iCalendar"
CommandName
=
"Export"
OnClientClick
=
"Export(this, event); return false;"
/>
</
span
>
</
div
>
</
div
>
</
AppointmentTemplate
>
<
TimeSlotContextMenuSettings
EnableDefault
=
"false"
/>
<
AppointmentContextMenuSettings
EnableDefault
=
"false"
/>
</
telerik:RadScheduler
>
.rsApt,.rsAptIn, .rsAptContent, .RadScheduler .rsMonthView .rsAptOut, .RadScheduler .rsMonthView .rsAptMid
{
min-height
:
30px
!important
;
height
:
auto
!important
;
}
.RadScheduler .rsMonthView .rsWrap
{
min-height
:
34px
!important
;
height
:
auto
!important
;
}
I have allowed the Row Selection for the RadGrid
<Selecting AllowRowSelect="true" />
and it works fine except that I don't want to select the row if the expand/collapse column is clicked.
Meaning I want to only see the details table of the certain item without selecting it. How to achieve that?
Thank you
Hi
On one particular page I am having a problem with filters in a RadGrid. I have another page with a similar setup that works fine.
I am finding that when a user enters a filter value the post back happens as expected but the filter value MasterTableView.FilterExpression is empty. Oddly the grid still seems to do a client side filter but there is no server filter value entered.
Any suggestions as to what could cause this? I've been looking for the various differences in the pages and am stumped on it!
Regards
Jon
<
telerik:RadGantt
runat
=
"server"
ID
=
"GanttChart"
CssClass
=
"GanttChart"
OnDataBound
=
"GanttChart_DataBound"
Skin
=
"Silk"
ListWidth
=
"30%"
Height
=
"650px"
Width
=
"1038px"
SelectedView
=
"WeekView"
AutoGenerateColumns
=
"false"
WorkWeekStart
=
"Monday"
WorkWeekEnd
=
"Friday"
>
<
Columns
>
<
telerik:GanttBoundColumn
DataField
=
"Title"
HeaderText
=
"Attivita"
DataType
=
"String"
UniqueName
=
"Title"
Width
=
"150px"
AllowEdit
=
"false"
></
telerik:GanttBoundColumn
>
<
telerik:GanttBoundColumn
DataField
=
"Start"
HeaderText
=
"Inizio"
DataType
=
"DateTime"
UniqueName
=
"Start"
DataFormatString
=
"dd/MM/yy"
Width
=
"65px"
AllowEdit
=
"false"
/>
<
telerik:GanttBoundColumn
DataField
=
"End"
HeaderText
=
"Fine"
DataType
=
"DateTime"
UniqueName
=
"End"
DataFormatString
=
"dd/MM/yy"
Width
=
"65px"
AllowEdit
=
"false"
/>
<
telerik:GanttBoundColumn
DataField
=
"PercentComplete"
HeaderText
=
"Completamento"
DataType
=
"Number"
UniqueName
=
"PercentComplete"
Width
=
"110px"
AllowEdit
=
"false"
/>
</
Columns
>
<
YearView
UserSelectable
=
"true"
/>
<
DataBindings
>
<
TasksDataBindings
IdField
=
"ID"
ParentIdField
=
"ParentID"
StartField
=
"Start"
SummaryField
=
"Summary"
EndField
=
"End"
TitleField
=
"Title"
PercentCompleteField
=
"PercentComplete"
OrderIdField
=
"OrderID"
/>
<
DependenciesDataBindings
TypeField
=
"Type"
IdField
=
"ID"
PredecessorIdField
=
"PredecessorID"
SuccessorIdField
=
"SuccessorID"
/>
</
DataBindings
>
</
telerik:RadGantt
>
protected
override
void
OnPreRender(EventArgs e)
{
base
.OnPreRender(e);
//Day View
GanttChart.DayView.DayHeaderDateFormat =
"dddd dd/MM"
;
GanttChart.DayView.SlotWidth = Unit.Parse(
"55px"
);
GanttChart.DayView.HourSpan = 1;
GanttChart.DayView.TimeHeaderDateFormat =
"HH:mm"
;
//Week View
GanttChart.WeekView.DayHeaderDateFormat =
"ddd dd/MM"
;
GanttChart.WeekView.SlotWidth = Unit.Parse(
"85px"
);
GanttChart.WeekView.WeekHeaderDateFormat =
"ddd"
;
//Month View
GanttChart.MonthView.WeekHeaderDateFormat =
"ddd dd"
;
GanttChart.MonthView.SlotWidth = Unit.Parse(
"110px"
);
GanttChart.MonthView.MonthHeaderDateFormat =
"MMMM yy"
;
//Year View
GanttChart.YearView.MonthHeaderDateFormat =
"MMM"
;
GanttChart.YearView.SlotWidth = Unit.Parse(
"120px"
);
GanttChart.YearView.MonthHeaderDateFormat =
"Y"
;
//Common properties working for all views
GanttChart.ShowFullTime =
true
;
GanttChart.ShowFullWeek =
true
;
GanttChart.Culture = CultureInfo.CurrentCulture;
GanttChart.WorkWeekStart = DayOfWeek.Monday;
GanttChart.WorkWeekEnd = DayOfWeek.Friday;
GanttChart.AllowSorting =
false
;
}
public
List<Task> GetGanttDataSource(
int
projectId)
{
List<Task> tasks =
new
List<Task>();
var taskResult = GetDbResult(projectId);
int
hasNext = 0;
foreach
(var item
in
taskResult)
{
Task task =
new
Task();
task.ID = item.Id;
task.ParentID = item.ParentId;
task.Start = item.Start;
task.End = item.End;
task.Title = item.Title;
task.PercentComplete = item.PercentComplete;
if
(item.Summary)
item.Summary = taskResult.Any(x => x.ParentId == item.Id);
task.Summary = item.Summary;
task.Expanded =
true
;
task.OrderID = item.OrderId;
tasks.Add(task);
}
return
tasks;
}
hello,
I have a radComboBox with Checkboxes enabled. I use the OnItemChecked and OnCheckAllItems events while loading data to Combobox with ItemRequested event and LoadOnDemand enabled.
the problem is that the OnItemChecked and OnCheckAllItems events not working.
How can I make it
Is there any way to cancel the material design ripple at runtime?
I'm using the material design theme with the RadPanelBar and in each item I've added a star icon to toggle favorited items. The problem is that even though I am able to cancel/prevent the item click from occurring, the ripple still happens.
My click event is bound to the icon toggle element directly with jquery, but calling stopImmediatePropagation and all other event cancelling methods I know of do not work for preventing the ripple effect from firing.
Thanks,
Adam