Questions on UI for ASP.NET AJAX Forum

0 answers

65 views

Sample for DataPager used with a client-side databound ListView

I have a ListView using automatic client-side databinding to a web service. Additionally, there is a DataPager placed just after the ListView in the page's markup as in the code pasted below.

When the page loads, the ListView shows data, which means the automatic client-side databinding is working, but the DataPager is showing nothing i.e. there is no pager visible even though there is more than one page of records in the database.

Is there a sample that uses a similar scenario of DataPager with a ListView? I tried searching online, but couldn't find any.

<telerik:RadListView ID="RadListView1" runat="server" RenderMode="Auto" AllowPaging="true" PageSize="5" ItemPlaceholderID="items">
    <ClientSettings>
        <ClientEvents OnDataBinding="RadListView1_Comments_DataBinding" OnDataBound="RadListView1_Comments_DataBound" OnDataSourceResolved="RadListView1_Comments_DataSourceResolved" />
        <DataBinding ItemPlaceHolderID="items">
            <LayoutTemplate>
                        <label for="" class="comments">Comments</label>
                        <div id="items"></div>
                       <%--<div id="pagerContainer"></div>--%>
            </LayoutTemplate>
            <ItemTemplate>
                       <div>
                            <div class="subject">#=Subject#</div>
                            <div class="comment">#=CommentText#</div>
                            <div class="author">by #=Author# on #=CreateDate# </div>
                      </div> 
            </ItemTemplate>
            <EmptyDataTemplate>
                        <div>
                            No Comments have been posted for this page
                        </div>
            </EmptyDataTemplate>
            <DataService Location="~/CommentsService.asmx" DataPath="GetComments" FilterParameterType="Sql" SortParameterType="Sql" CountPropertyName="Count"></DataService>
        </DataBinding>
    </ClientSettings>
</telerik:RadListView>
<telerik:RadDataPager RenderMode="Auto" ID="RadDataPager1" runat="server" PagedControlID="RadListView1">
    <Fields>
        <telerik:RadDataPagerButtonField FieldType="FirstPrev"></telerik:RadDataPagerButtonField>
        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
        <telerik:RadDataPagerButtonField FieldType="NextLast"></telerik:RadDataPagerButtonField>
        <telerik:RadDataPagerGoToPageField></telerik:RadDataPagerGoToPageField>
    </Fields>
</telerik:RadDataPager>

I tried adding the following JavaScript code in the client-side databinding event of ListView so that all needed properties of DataPager get set, but still the DataPager shows nothing.

function RadListView1_Comments_DataBound(sender, args) {
    //set datapager properties
    let dataPager = $find(pageBag.radDataPager1Id);
    dataPager.set_currentPageIndex(sender._currentPageIndex);
    dataPager._totalRowCount = sender._virtualItemCount;
    dataPager.set_pageSize(sender._pageSize);
    dataPager._pageCount = Math.ceil(dataPager._totalRowCount / dataPager._pageSize);
    dataPager._startRowIndex = startRowIndex;
}

DataPager

ListView

updated question on 22 Apr 2024

2 answers

370 views

Telerik controls are not loading in container

Hi Friends,

I'm trying to migrate ASP.NET web application (.NET 4.7.2) running on Windows server to ECS windows container but having following issues after hosting the image saying

1. 'Failed to load resource: the server responded with a status of 404()' for WebResource.axd, ScriptResource.axd and Telerik.Web.UI.WebResource.axd.

2. Uncaught Error: ASP.NET Ajax client-side framework failed to load.

3. Uncaught ReferenceError: Sys is not defined at jsdebug

4. Uncaught ReferenceError: $get is not defined

Please someone help me in resolving these issues.

Ajax

answered on 18 Apr 2024

1 answer

86 views

Cannot drag column to group by

Group by is only available when done at design time.

<telerik:RadGrid ID="gridLockbox" runat="server" PageSize="20" PagerStyle-PageButtonCount="5" AllowMultiRowSelection="true"
    OnNeedDataSource="gridLockbox_NeedDataSource" OnDetailTableDataBind="gridLockbox_DetailTableDataBind"
    OnItemDataBound="gridLockbox_ItemDataBound" OnUpdateCommand="gridLockbox_UpdateCommand"
    AllowPaging="true" AllowSorting="true" ShowGroupPanel="true" CellSpacing="0" Width="100%" Height="700px"
    RenderMode="Lightweight" ShowFooter="true" Skin="WebBlue">
    <GroupingSettings ShowUnGroupButton="True" CaseSensitive="false"/>
    <ClientSettings>
        <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" />
    </ClientSettings>
    <MasterTableView EditMode="PopUp" AutoGenerateColumns="false" AllowFilteringByColumn="true" DataKeyNames="TransUID"
        AllowMultiColumnSorting="true" CommandItemDisplay="None" TableLayout="Fixed" Font-Size="10">
        <DetailTables>
            <telerik:GridTableView DataKeyNames="RecordId" Name="Details" Width="100%" AutoGenerateColumns="false" TableLayout="Fixed">
                <Columns>
                    <telerik:GridBoundColumn DataField="FileOperation" HeaderText="File Operation" HeaderButtonType="None">
                        <HeaderStyle Width="180px" />
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="FileStatus" HeaderText="File Status" HeaderButtonType="TextButton">
                        <HeaderStyle Width="200px" />
                    </telerik:GridBoundColumn>
                    <telerik:GridDateTimeColumn DataField="CreatedDateTime" HeaderText="Created At">
                        <HeaderStyle Width="250px" />
                    </telerik:GridDateTimeColumn>
                    <telerik:GridBoundColumn DataField="Notes" HeaderText="Notes" HeaderButtonType="TextButton"></telerik:GridBoundColumn>
                </Columns>
            </telerik:GridTableView>
        </DetailTables>
        <GroupByExpressions>
            <telerik:GridGroupByExpression>
                <SelectFields>
                    <telerik:GridGroupByField FieldAlias="Date_Time" FieldName="Date_Time" FormatString="{0:MM/dd/yyyy}" HeaderValueSeparator=" from date: " />
                </SelectFields>
                <GroupByFields>
                    <telerik:GridGroupByField FieldName="Date_Time" SortOrder="Descending" />
                </GroupByFields>
            </telerik:GridGroupByExpression>
        </GroupByExpressions>
        <Columns>
            <telerik:GridEditCommandColumn UniqueName="EditColumn" HeaderText="Edit" Exportable="false">
                <HeaderStyle Width="50px" />
            </telerik:GridEditCommandColumn>
            <telerik:GridBoundColumn UniqueName="Lockbox" DataField="Lockbox" HeaderText="Lockbox" HeaderStyle-Width="180px" FilterControlWidth="70%">
                <FilterTemplate>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="cmbLockbox" DataSource='<%#LockboxNames %>' DataTextField="Name"
                        DataValueField="ID" Width="150px" AppendDataBoundItems="true"
                        SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("Lockbox").CurrentFilterValue %>'
                        runat="server" OnClientSelectedIndexChanged="LockboxIndexChanged">
                        <Items>
                            <telerik:RadComboBoxItem Text="All" />
                        </Items>
                    </telerik:RadComboBox>
                    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
                        <script type="text/javascript">
                            function LockboxIndexChanged(sender, args) {
                                var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
                                tableView.filter("Lockbox", args.get_item().get_value(), "EqualTo");
                            }
                        </script>
                    </telerik:RadScriptBlock>
                </FilterTemplate>
            </telerik:GridBoundColumn>
            <telerik:GridDateTimeColumn UniqueName="Date_Time" DataField="Date_Time" HeaderText="Date" DataFormatString="{0:MM/dd/yyyy}">
                <HeaderStyle Width="180px" />
            </telerik:GridDateTimeColumn>
            <telerik:GridBoundColumn UniqueName="TransSource" DataField="TransSource" HeaderText="Trans Type" Display="false"></telerik:GridBoundColumn>
            <telerik:GridNumericColumn UniqueName="Amount" DataField="Amount" HeaderText="Amount" DataType="System.Decimal" DataFormatString="{0:C}" FilterControlWidth="80%" Aggregate="Sum">
                <HeaderStyle Width="140px" />
            </telerik:GridNumericColumn>
            <telerik:GridBoundColumn UniqueName="ABA_RT" DataField="ABA_RT" HeaderText="Routing number">
                <HeaderStyle Width="200px" />
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn UniqueName="AccountNum" DataField="AccountNum" HeaderText="Account number">
                <HeaderStyle Width="210px" />
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn UniqueName="CheckNum" DataField="CheckNum" HeaderText="Check Number">
                <HeaderStyle Width="200px" />
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn UniqueName="FileOperation" DataField="FileOperation" HeaderText="File Operation">
                <HeaderStyle Width="200px" />
                <FilterTemplate>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="cmbFileOperation" DataSource='<%#FileOperationNames %>' DataTextField="Name"
                        DataValueField="ID" Width="150px" AppendDataBoundItems="true"
                        SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("FileOperation").CurrentFilterValue %>'
                        runat="server" OnClientSelectedIndexChanged="FileOperationIndexChanged">
                        <Items>
                            <telerik:RadComboBoxItem Text="All" />
                        </Items>
                    </telerik:RadComboBox>
                    <telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">
                        <script type="text/javascript">
                            function FileOperationIndexChanged(sender, args) {
                                var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
                                tableView.filter("FileOperation", args.get_item().get_value(), "EqualTo");
                            }
                        </script>
                    </telerik:RadScriptBlock>
                </FilterTemplate>
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn UniqueName="FileStatus" DataField="FileStatus" HeaderText="FileStatus">
                <HeaderStyle Width="200px" />
                <FilterTemplate>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="cmbFileStatus" DataSource='<%#FileStatusNames %>' DataTextField="Name"
                        DataValueField="ID" Width="150px" AppendDataBoundItems="true"
                        SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("FileStatus").CurrentFilterValue %>'
                        runat="server" OnClientSelectedIndexChanged="FileStatusIndexChanged">
                        <Items>
                            <telerik:RadComboBoxItem Text="All" />
                        </Items>
                    </telerik:RadComboBox>
                    <telerik:RadScriptBlock ID="RadScriptBlock3" runat="server">
                        <script type="text/javascript">
                            function FileStatusIndexChanged(sender, args) {
                                var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");
                                tableView.filter("FileStatus", args.get_item().get_value(), "EqualTo");
                            }
                        </script>
                    </telerik:RadScriptBlock>
                </FilterTemplate>
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn UniqueName="ImageFilePath" DataField="ImageFilePath" Display="false"></telerik:GridBoundColumn>
            <telerik:GridNumericColumn UniqueName="PaymentId" DataField="PaymentId" HeaderText="Payment Id" FilterControlWidth="70%">
                <HeaderStyle Width="120px" />
            </telerik:GridNumericColumn>
        </Columns>
        <EditFormSettings EditFormType="WebUserControl" UserControlName="LockboxCtrl.ascx">
            <PopUpSettings Modal="true" Width="1500px"/>
        </EditFormSettings>
    </MasterTableView>
</telerik:RadGrid>

Grid

answered on 17 Apr 2024

0 answers

63 views

RadGrid pager style

Hi,

I'm having problems with the style regarding the pager part of my RadGrid (see attachment). I use it with Bootstrap v. 5.3.3. Can you explain to me what I need to add in my CSS file to fix.

Thank you
Dario

Grid

Styling

asked on 16 Apr 2024

1 answer

88 views

RadGrid AllowMultiRowSelection = "true" not firing ItemCommand for every row

Hello,

I'm working with a RadGrid that has AllowMultiRowSelection set to "true":

<telerik:RadGrid ID="sampleRgId" runat="server" AllowPaging="True" AllowCustomPaging="True" SkinID="Default" 
PageSize="20" AllowAutomaticDeletes="false" AllowAutomaticUpdates="false" AllowMultiRowSelection="true" OnDetailTableDataBind="sampleRgDetailTableDataBind"  RetainExpandStateOnRebind="True" HierarchyLoadMode="ServerOnDemand" EnableViewState="true">
    <ClientSettings>
        <Selecting AllowRowSelect="true" />
        <ClientEvents OnRowSelected="sampleRgRowSelected"
        OnRowDeselected="sampleRgRowDeselected"/>
    </ClientSettings>
    <MasterTableView Name="sample" 
    runat="server" Width="100%" 
    HierarchyLoadMode="ServerOnDemand" ShowHeader="True" 
    ShowFooter="True" AllowPaging="True" 
    AllowCustomPaging="True" PageSize="20" 
    AllowFilteringByColumn="True" DataMember="sampleRgTable"
    EnableHierarchyExpandAll="True" EnableGroupsExpandAll="True" 
    RetainExpandStateOnRebind="True" DataKeyNames="dataKeyOne, dataKeyTwo">
        <Columns>
            <telerik:GridClientSelectColumn UniqueName="uniqueNameOne" Display="True" HeaderStyle-Width="35px" 
            HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center" />
            <telerik:GridBoundColumn HeaderText="Header Text" DataField="dataFieldOne" UniqueName="UniqueNameTwo" 
            SortExpression="UniqueNameTwo" HeaderStyle-Width="50%" FilterControlWidth="70%" />
...

The "sampleRgRowSelected" function looks like this:

asyncfunctionsampleRgRowSelected(sender, args){
        let masterTable = $find("<%= sampleRgId.ClientID %>").get_masterTableView();
        let itemIndex = args.get_itemIndexHierarchical();
        masterTable.fireCommand("SelectRow", itemIndex);
}

The "SelectRow" function in the code-behind looks like this:

PrivateSub SelectParentGroup(e As GridCommandEventArgs)
    Dim itemIndex as Integer = e.CommandArgument
    Dim item As GridDataItem = e.Item.OwnerTableView.Items(itemIndex)
    processData(item)
    item.Selected = trueEndSub

I'm having two problems with the above when I click the "multi row selection" / "select all" checkbox in the RadGrid:

1- Selected rows aren't staying selected. When I click "Select All," every row is selected at first. After a minute, though, only the last row shows as selected. I'm guessing that is because of the ItemCommand taking some time to fire for each row. Then the final state is only having the last row selected.

2- When I have > 6 rows, not every row is selected. When I click "Select All," the sampleRgRowSelected() JavaScript function runs for every row in the RadGrid, starting with the last row. However, the ItemCommand is not fired for every row in the RadGrid. Only the first 6 rows as well as the last one have had "SelectRow" called on them.

Is there a way to know when "select all" has been selected in a RadGrid? If I knew that, I could just manually call processData and select each item. That would work better because I could also select paginated items when "select all" has been clicked.

Thanks for your time.

Grid

answered on 15 Apr 2024

1 answer

96 views

Changing the visible property server side not working

I have a RadNumericTextbox where the visible field is set to false. Depending on another variables value, the RadNumericTextbox visible may change to true. This is not working. The field is in a panel.

I stepped through the code and the visible property will not change.

I even directly changed the value to true and the value remained false in the watch list.

NumericTextBox

answered on 11 Apr 2024

0 answers

108 views

Error in sorting of list of object when using KENDO UI

Hello,

When I tried to filter my other columns it seems working, but for the payment type column, im getting error: At least one object must implement IComparable

Client model:
public Guid Id { get; set; }

[Display(Name = "Client Code")]
public string Ref { get; set; }

[Display(Name = "Company Name")]
public string CompanyName { get; set; }

[Display(Name = "Payment Options")]
public List<PaymentTypeViewModel> PaymentTypes { get; set; }

payment type model:
using System;

namespace Act2.Certificate.Api.Models.Client
{
public class PaymentTypeViewModel
{
public Guid Id { get; set; }

public string Name { get; set; }

public bool Selected { get; set; }
}
}

Controller file:
public async Task<IActionResult> GetClientList([DataSourceRequest] DataSourceRequest request
)
{
try
{
var list = await _mediator.Send(new ClientsQuery());

DataSourceResult result = list.ToDataSourceResult(request);
return new JsonResult(result);
}
catch (Exception ex)
{
return BadRequest(new { message = ex.Message });
}
}
}

Do take note, that the payment type has multiple value per row, see below image:

Filter

Grid

asked on 11 Apr 2024

2 answers

3.4K+ views

Error when Build Project - NuGet package restore failed.

Im having an issue with a application im working on within VS 2019 asp.net

When I build my application I get the error below:

NuGet Package restore failed for project Planning_BO: Unable to find version '2022.1.119' of package 'Telerik.UI.for.AspNet.Ajax.Net35'.
https://nuget.telerik.com/v3/index.json: Package 'Telerik.UI.for.AspNet.Ajax.Net35.2022.1.119' is not found on source 'https://nuget.telerik.com/v3/index.json'.

Im not sure how to resolve this. I have tried https://api.nuget.org/v3/index.json still the same issue.

Ajax

answered on 10 Apr 2024

1 answer

722 views

Unrestricted File Upload

Dear Team,

We are currently using Telerik version 2013.1.0.403 in our application. One of our client has highlighted a Unrestircted Fie Upload issue concerning the RadAsyncUpload function.

The impact of the concern is that the RadAsyncUpload's AsyncUploadHandler was configured with a static key for encrypting form data in file upload requests. This key, PrivateKeyForEncryptionOfRadAsyncUploadConfiguration, was not changed from its default value. As a result, an attacker could exploit this by crafting a file upload request to /Telerik.Web.Ui.WebResource.axd?type=rau with a custom encrypted rauPostData POST parameter.

This could allow the attacker to upload malicious files and potentially gain unauthorized access, such as a web shell.

How do we configure the PrivateKeyForEncryptionOfRadAsyncUploadConfiguration, and what is the procedure for doing so?
Thank you in advance for your cooperation.

AsyncUpload

answered on 08 Apr 2024

1 answer

177 views

Getting error while updating telerik. web.UI DLL.

We are getting below error message while updating latest telerik dll.

Severity Code Description Project File Line Suppression State
Error The project currently contains references to more than one version of System.Web.Extensions, a direct reference to version 3.5.0.0 and an indirect reference (through 'Telerik.Web.UI.RadWindowManager') to version 4.0.0.0. Change the direct reference to use version 4.0.0.0 (or higher) of System.Web.Extensions. C:\xyz.aspx

Ajax

answered on 05 Apr 2024