
Hello guys,
I have copied and pasted the example provided by the Telerik website almost verbatim - with exception to the implemented DataSource (which I'm doing programmatically for the sake of the example), and am getting problems. The website is here: Virtual Scrolling and Paging.
The problems are as follows:
Please see the attached image 'ScrollingHangingIllustration.png'. Also, see below for the code. Please help!!
ASP.NET Markup:
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> <script type="text/javascript"> function HandleScrolling(e) { var grid = $find("<%=RadGrid1.ClientID %>"); var scrollArea = document.getElementById("<%= RadGrid1.ClientID %>" + "_GridData"); if (IsScrolledToBottom(scrollArea)) { var currentlyDisplayedRecords = grid.get_masterTableView().get_pageSize() * (grid.get_masterTableView().get_currentPageIndex() + 1); //if the visible items are less than the entire record count //trigger an ajax request to increase them if (currentlyDisplayedRecords < 100) { $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords"); } } } //calculate when the scroll bar is at the bottom function IsScrolledToBottom(scrollArea) { var currentPosition = scrollArea.scrollTop + scrollArea.clientHeight; return currentPosition == scrollArea.scrollHeight; } </script> </telerik:RadCodeBlock> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadGrid1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px" Width="75px" Transparency="25"> <img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' style="border: 0;" /></telerik:RadAjaxLoadingPanel> <telerik:RadGrid ID="RadGrid1" runat="server" Skin="Silk" AllowSorting="True" AllowPaging="True" PageSize="15" Width="97%" AutoGenerateColumns="False" GridLines="None"> <PagerStyle Visible="False" /> <MasterTableView Width="99%" TableLayout="Fixed" CommandItemDisplay="None" CurrentResetPageIndexAction="SetPageIndexToFirst" PageSize="15"> <SortExpressions> <telerik:GridSortExpression FieldName="CreateDate" SortOrder="Descending" /> </SortExpressions> <Columns> <telerik:GridBoundColumn HeaderText="Code" DataField="ZipFileCode" UniqueName="ZipFileCode"> <HeaderStyle Width="90px" /> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Description" DataField="ZipFileDesc" UniqueName="ZipFileDesc"> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Select/Omit" DataField="ZipType" UniqueName="ZipType"> <HeaderStyle Width="100px" /> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Create Date" DataField="CreateDate" UniqueName="CreateDate" DataType="System.DateTime" DataFormatString="{0:d}" ShowSortIcon="true"> <HeaderStyle Width="100px" /> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Company" DataField="Company" UniqueName="Company"> <HeaderStyle Width="100px" /> </telerik:GridBoundColumn> </Columns> </MasterTableView> <ClientSettings> <Scrolling AllowScroll="True" UseStaticHeaders="True" ScrollHeight="300px" /> <ClientEvents OnScroll="HandleScrolling" /> </ClientSettings> </telerik:RadGrid>VB Code-Behind:
Protected Sub RadAjaxManager1_AjaxRequest(ByVal sender As Object, ByVal e As AjaxRequestEventArgs) Handles RadAjaxManager1.AjaxRequest RadGrid1.PageSize = 10 + RadGrid1.PageSize RadGrid1.Rebind()End SubPublic Function GetItemsTest(ByVal startRowIndex As Integer, ByVal maxRows As Integer) As DataSet Dim dt As DataTable = New DataTable("Sample") dt.Columns.Add("Company", System.Type.GetType("System.String")) dt.Columns.Add("ZipFileCode", System.Type.GetType("System.String")) dt.Columns.Add("ZipFileDesc", System.Type.GetType("System.String")) dt.Columns.Add("ZipType", System.Type.GetType("System.String")) dt.Columns.Add("CreateDate", System.Type.GetType("System.DateTime")) dt.Columns.Add("DeletedFile", System.Type.GetType("System.Boolean")) dt.Columns.Add("UploadedBy", System.Type.GetType("System.String")) Dim row As DataRow Dim dte As DateTime dte = DateTime.Now For i As Integer = 0 To maxRows row = dt.NewRow() row(0) = "Company" & i row(1) = "ZipFileCode" & i row(2) = "ZipFileDesc" & i row(3) = "ZipType" & i row(4) = dte row(5) = True row(6) = "UploadedBy" & i dt.Rows.Add(row) Next Dim ds As New DataSet("Sample") ds.Tables.Add(dt) Return dsEnd FunctionPrivate Sub RadGrid1_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadGrid1.NeedDataSource RadGrid1.DataSource = GetItemsTest(0, RadGrid1.PageSize)End SubHi, sorry my english isn't very good, hope you understand.
I have a treeview with a contextMenu. In the contextMenu I have an item that needs some javascript to run and a confirmation to know if postback must be triggered.
Something like this :
- user right-click on a node (contextMenu appears)
- user select menu item
- javascript stop postback (I used "args.set_cancel(true);" in the javascript)
- javascript runs some functions then a "modal window" is displayed (this is not a window.confirm !!!) with a message like "Are you sure ?" and the usual buttons "yes/no"
My problem, how do I re-enable (or resume, or resend) the "postback" like if the menu item was clicked ?
I've already done something like this on a RadButton, and simply by using "sender.click()" in the javascript, the postback is "resumed". But there are no functions like this on a contextMenu I think...

I have one grid with an ImageButton in an ItemTemplate that download a file and delete a row in the db inside the ItemCommand function. I am using a datasource on the page. All Insert/Update/Delete events are being bound on the server side also.
I am calling the Rebind() method after the data operations, but the grid itself does not show the updated results unless I refresh the page completely.
I've tried disabling the grid viewstate, but it's not working. What do I need to do to get the grid to refresh?
Some code:
<telerik:radgrid runat="server" id="grdId"
allowpaging="True" allowsorting="true" autogeneratecolumns="False" pagesize="10"
cssclass="RadGrid_ModernBrowsers" OnItemCommand="grdId_OnItemCommand"
localizationpath="~/App_GlobalResources" DataSourceID="objDataSource"
enableembeddedskins="true" skin="Telerik" culture="it-IT" allowfilteringbycolumn="true" ViewStateMode="Disabled">
<SelectedItemStyle BorderColor="Yellow"></SelectedItemStyle>
<MasterTableView CommandItemDisplay="Top" DataKeyNames="id"
ClientDataKeyNames="id" ShowGroupFooter="true"
TableLayout="Fixed"
ShowFooter="True" PageSize="10">
<PagerStyle Mode="NextPrevNumericAndAdvanced"></PagerStyle>
<Columns>
(...)
<telerik:GridTemplateColumn AllowFiltering="false">
<HeaderStyle Width="80px" />
<HeaderTemplate>
CV
</HeaderTemplate>
<ItemTemplate>
<asp:ImageButton ID="btnDownload" Width="40px" runat="server" ImageUrl="img/docx.png" CommandName="Download"
AlternateText="Download" ToolTip="Download" CommandArgument='<%# Eval("id")%>' />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</telerik:GridTemplateColumn>
</Columns>
<CommandItemSettings ShowExportToPdfButton="false"
ShowAddNewRecordButton="false" ShowRefreshButton="false" RefreshText="" />
</MasterTableView>
<ClientSettings>
<Selecting AllowRowSelect="True" />
</ClientSettings>
<GroupingSettings CaseSensitive="false" />
</telerik:radgrid>
<asp:ObjectDataSource ID="objDataSource" runat="server"
TypeName="TypeName"
SelectMethod="Select_Table">
</asp:ObjectDataSource>
Protected Sub Page_PreRender(sender As Object, e As System.EventArgs) Handles Me.PreRender
Try
If Not IsPostBack Then
grdId.DataBind()
End If
Catch ex As Exception
End Try
End Sub
Protected Sub grdId_OnItemCommand(sender As Object, e As GridCommandEventArgs)
Try
If e.CommandName = "Download" Then
Dim Id As Integer = Convert.ToInt32(e.CommandArgument)
Dim scarica As Byte() = CQuery.Select_Download(Id)
Response.Clear()
Response.AddHeader("Content-Disposition", "attachment; filename=" + "nomefile")
Response.ContentType = "application/msword"
Response.BinaryWrite(scarica)
CQuery.Update_Table(Id) 'This delete the record
grdId.Rebind()
Response.End()
Response.Flush()
End If
Catch ex As Exception
End Try
End Sub
Is it possible to do paging by number of datagroups? Display say 5 datagroups per page, instead of items.
Thanks.

Hello,
I have utilized the virtual scrolling example provided by the Telerik website verbatim - with exception to the implemented DataSource (which I'm doing programmatically for the sake of the example), and am getting issues. The website is here: Virtual Scrolling and Paging.
The problems are as follows:
Please see the attached image 'ScrollingHangingIllustration.png'. Also, see below for the code. Please help!!
Client-Side RadCodeBlock
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> <script type="text/javascript"> function HandleScrolling(e) { var grid = $find("<%=RadGrid1.ClientID %>"); var scrollArea = document.getElementById("<%= RadGrid1.ClientID %>" + "_GridData"); if (IsScrolledToBottom(scrollArea)) { var currentlyDisplayedRecords = grid.get_masterTableView().get_pageSize() * (grid.get_masterTableView().get_currentPageIndex() + 1); //if the visible items are less than the entire record count //trigger an ajax request to increase them if (currentlyDisplayedRecords < 100) { $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("LoadMoreRecords"); } } } //calculate when the scroll bar is at the bottom function IsScrolledToBottom(scrollArea) { var currentPosition = scrollArea.scrollTop + scrollArea.clientHeight; return currentPosition == scrollArea.scrollHeight; } </script> </telerik:RadCodeBlock>Client-Side AJAX Manager
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="RadGrid1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings></telerik:RadAjaxManager><telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Height="75px" Width="75px" Transparency="25"> <img alt="Loading..." src='<%= RadAjaxLoadingPanel.GetWebResourceUrl(Page, "Telerik.Web.UI.Skins.Default.Ajax.loading.gif") %>' style="border: 0;" /></telerik:RadAjaxLoadingPanel>Client-Side RadGrid
<telerik:RadGrid ID="RadGrid1" runat="server" Skin="Silk" AllowSorting="True" AllowPaging="True" PageSize="15" Width="97%" AutoGenerateColumns="False" GridLines="None"> <PagerStyle Visible="False" /> <MasterTableView Width="99%" TableLayout="Fixed" CommandItemDisplay="None" CurrentResetPageIndexAction="SetPageIndexToFirst" PageSize="15"> <SortExpressions> <telerik:GridSortExpression FieldName="CreateDate" SortOrder="Descending" /> </SortExpressions> <Columns> <telerik:GridBoundColumn HeaderText="Code" DataField="ZipFileCode" UniqueName="ZipFileCode"> <HeaderStyle Width="90px" /> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Description" DataField="ZipFileDesc" UniqueName="ZipFileDesc"> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Select/Omit" DataField="ZipType" UniqueName="ZipType"> <HeaderStyle Width="100px" /> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Create Date" DataField="CreateDate" UniqueName="CreateDate" DataType="System.DateTime" DataFormatString="{0:d}" ShowSortIcon="true"> <HeaderStyle Width="100px" /> </telerik:GridBoundColumn> <telerik:GridBoundColumn HeaderText="Company" DataField="Company" UniqueName="Company"> <HeaderStyle Width="100px" /> </telerik:GridBoundColumn> </Columns> </MasterTableView> <ClientSettings> <Scrolling AllowScroll="True" UseStaticHeaders="True" ScrollHeight="300px" /> <ClientEvents OnScroll="HandleScrolling" /> </ClientSettings></telerik:RadGrid>Server-Side AjaxRequest
Protected Sub RadAjaxManager1_AjaxRequest(ByVal sender As Object, ByVal e As AjaxRequestEventArgs) Handles RadAjaxManager1.AjaxRequest RadGrid1.PageSize = 10 + RadGrid1.PageSize RadGrid1.Rebind()End SubServer-Side Datasource
Public Function GetItemsTest(ByVal startRowIndex As Integer, ByVal maxRows As Integer) As DataSet Dim dt As DataTable = New DataTable("Sample") dt.Columns.Add("Company", System.Type.GetType("System.String")) dt.Columns.Add("ZipFileCode", System.Type.GetType("System.String")) dt.Columns.Add("ZipFileDesc", System.Type.GetType("System.String")) dt.Columns.Add("ZipType", System.Type.GetType("System.String")) dt.Columns.Add("CreateDate", System.Type.GetType("System.DateTime")) dt.Columns.Add("DeletedFile", System.Type.GetType("System.Boolean")) dt.Columns.Add("UploadedBy", System.Type.GetType("System.String")) Dim row As DataRow Dim dte As DateTime dte = DateTime.Now For i As Integer = 0 To maxRows row = dt.NewRow() row(0) = "Company" & i row(1) = "ZipFileCode" & i row(2) = "ZipFileDesc" & i row(3) = "ZipType" & i row(4) = dte row(5) = True row(6) = "UploadedBy" & i dt.Rows.Add(row) Next Dim ds As New DataSet("Sample") ds.Tables.Add(dt) Return dsEnd FunctionPrivate Sub RadGrid1_NeedDataSource(ByVal source As Object, ByVal e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadGrid1.NeedDataSource RadGrid1.DataSource = GetItemsTest(0, RadGrid1.PageSize)End SubThanks!
Hi Telerik
I wana to set DelayFilter for FilterTemplate in RadGrid but when i set that , it's not work !
why this not work and how to set it ?
please help me .
Thanks
<telerik:GridTemplateColumn DataField="ProvinceName" HeaderText="ProvinceName" SortExpression="ProvinceName" UniqueName="ProvinceName" FilterDelay="1000"> <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" /> <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" /> <ClientItemTemplate> #=ProvinceName# </ClientItemTemplate> <FilterTemplate> <telerik:RadTextBox ID="txtProvinceName" runat="server"> <ClientEvents OnValueChanged="ProvinceNameChenged"></ClientEvents> </telerik:RadTextBox> <telerik:RadScriptBlock ID="rsbProvinceName" runat="server"> <script type="text/javascript"> function ProvinceNameChenged(sender, args) { var gv = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>"); if (args.get_newValue() == "") { gv.filter("ProvinceName", null, "NoFilter"); return; } gv.filter("ProvinceName", args.get_newValue(), "StartsWith"); } </script> </telerik:RadScriptBlock> </FilterTemplate> </telerik:GridTemplateColumn>
I've looked at a number of posts here on doing this and just can't seem to get it to work. But I have inside of a GridTemplateColumn and based on the value of one of the data columns I want to set it to disabled. My data values are either "OPEN" or "CLOSED". The checkbox in question is cbMarkCompleted and the datavalue I'm checking is TaskStatusTypeCode So here is my current code:
<Columns> <telerik:GridBoundColumn UniqueName="NotificationId" DataField="NotificationId" DataType="System.Int32" display="false" /> <telerik:GridTemplateColumn UniqueName="MARKCOMPLETED" ShowFilterIcon="false" HeaderText="Mark Completed" HeaderStyle-Width="65"> <FilterTemplate> <asp:CheckBox ID="cbAll" runat="server" onclick="CheckAll(this)" /> </FilterTemplate> <ItemTemplate> <asp:CheckBox ID="cbMarkCompleted" runat="server" ></asp:CheckBox> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridBoundColumn UniqueName="NOTIFICATIONTYPE" HeaderText="Type" DataField="NOTIFICATIONTYPE" ShowFilterIcon="false" CurrentFilterFunction="Contains" AutoPostBackOnFilter="true" SortExpression="NOTIFICATIONTYPE" HeaderStyle-Width="80"/> <telerik:GridBoundColumn UniqueName="DISPLAYTEXT" HeaderText="Text" DataField="DISPLAYTEXT" ShowFilterIcon="false" CurrentFilterFunction="Contains" AutoPostBackOnFilter="true" SortExpression="DISPLAYTEXT" HeaderStyle-Width="340"/> <telerik:GridDateTimeColumn UniqueName="CREATEDON" HeaderText="Created On" DataField="CREATEDON" ShowFilterIcon="false" DataFormatString="{0:dd MMM yyyy}" DataType="System.DateTime" HtmlEncode="false" ItemStyle-CssClass="center" CurrentFilterFunction="GreaterThanOrEqualTo" AutoPostBackOnFilter="true" HeaderStyle-Width="100"/> <telerik:GridDateTimeColumn UniqueName="MODIFIEDON" HeaderText="Last Update" DataField="MODIFIEDON" ShowFilterIcon="false" DataFormatString="{0:dd MMM yyyy}" DataType="System.DateTime" HtmlEncode="false" ItemStyle-CssClass="center" CurrentFilterFunction="GreaterThanOrEqualTo" AutoPostBackOnFilter="true" HeaderStyle-Width="100"/> <telerik:GridDateTimeColumn UniqueName="DUEDATE" HeaderText="Due Date" DataField="DUEDATE" ShowFilterIcon="false" DataFormatString="{0:dd MMM yyyy}" DataType="System.DateTime" HtmlEncode="false" ItemStyle-CssClass="center" CurrentFilterFunction="GreaterThanOrEqualTo" AutoPostBackOnFilter="true" HeaderStyle-Width="100"/> <telerik:GridTemplateColumn UniqueName="ENTITYTYPE" ShowFilterIcon="false" DataField="ENTITYTYPE" SortExpression="ENTITYTYPE" HeaderText="Notification For" CurrentFilterFunction="Contains" AutoPostBackOnFilter="true" HeaderStyle-Width="75"> <ItemTemplate> <asp:LinkButton ID="lnkNavigateToItem" runat="server" CommandName="NAVIGATE" Text='<%# Eval("EntityType") %>' CommandArgument='<%# Eval("ENTITYID") + "," + Eval("EntityTypeCode") %>' /> <asp:Label ID="lblEntityType" runat="server" Text='<%# Eval("EntityType") %>'></asp:Label> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridBoundColumn UniqueName="ENTITYTYPECODE" Visible="false" HeaderText="" DataField="ENTITYTYPECODE" ShowFilterIcon="false" CurrentFilterFunction="Contains" AutoPostBackOnFilter="true" SortExpression="ENTITYTYPECODE"/> <telerik:GridBoundColumn UniqueName="TaskStatusTypeCode" Visible="false" HeaderText="" DataField="TaskStatusTypeCode" ShowFilterIcon="false" CurrentFilterFunction="Contains" AutoPostBackOnFilter="true" SortExpression="TaskStatusTypeCode" HtmlEncode="true" /></Columns>