This is a migrated thread and some comments may be shown as answers.

LoadingPanel doesn't show when using ClientSide Binding and RequestStart

1 Answer 71 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Carrie asked on 13 Dec 2012, 04:03 PM

I have a grid that binds using the clientside method - I want to have the LoadingPanel display but can't seem to get it working - any help is appreciated:

<telerik:RadAjaxManager id="RadAjaxManager1" runat="server" >

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

<ClientEvents OnRequestStart="RequestStart" OnResponseEnd="ResponseEnd" />

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default">

</telerik:RadAjaxLoadingPanel>

<asp:Panel ID="Panel1" runat="server">

<div id="dashtabs-comments" class="box-content no-padding">

<telerik:Radgrid id="RadGrid1" runat="server" allowmultirowselection="False" allowpaging="True"

allowsorting="True" gridlines="None" pagesize="25" showstatusbar="True" autogeneratecolumns="False"

CellSpacing="0">

<ClientSettings>

<DataBinding Location="manageUsers.aspx" SelectMethod="GetDataAndCount" />

<ClientEvents OnGridCreated="AddAllFilterExpressions" OnDataBinding="RadGrid1_DataBinding" OnRowDataBound="OnGridRowDataBound" />

</ClientSettings>

<HeaderContextMenu EnableTheming="True">

<CollapseAnimation Duration="200" Type="OutQuint" />

</HeaderContextMenu>

<MasterTableView ClientDataKeyNames="UserId" TableLayout="Fixed">

<Columns>

telerik:GridBoundColumn DataField="FirstName" UniqueName="FirstName" HeaderText="First Name" HeaderStyle-Width="15%"/>

<telerik:GridBoundColumn DataField="LastName" UniqueName="LastName" HeaderText="Last Name" HeaderStyle-Width="15%"/>

<telerik:GridBoundColumn DataField="Email" UniqueName="Email" HeaderText="Email" HeaderStyle-Width="15%"/>

<telerik:GridBoundColumn DataField="PhoneNumber" UniqueName="PhoneNumber" HeaderText="Phone" HeaderStyle-Width="10%"/>

</Columns>

<RowIndicatorColumn>

<HeaderStyle Width="20px" />

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px" />

</ExpandCollapseColumn>

<EditFormSettings>

<EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>

</EditFormSettings>

</MasterTableView>

<ClientSettings>

<Selecting AllowRowSelect="True" />

</ClientSettings>

<FilterMenu EnableTheming="True">

<CollapseAnimation Duration="200" Type="OutQuint" />

</FilterMenu>

<PagerStyle Mode="NextPrevNumericAndAdvanced" />

</telerik:Radgrid>

</div>

</asp:Panel>

and JavaScript:

<script type="text/javascript">

function RadGrid1_DataBinding(sender, args) {

// get data source location, method name and arguments

var dataSourceLocation = args.get_location();

var selectMethodName = args.get_methodName();

var methodArguments = args.get_methodArguments();

// set data source location and method name

args.set_location(dataSourceLocation);

args.set_methodName(selectMethodName);

var startRowIndexParameterName = sender.ClientSettings.DataBinding.StartRowIndexParameterName;

var maximumRowsParameterName = sender.ClientSettings.DataBinding.MaximumRowsParameterName;

var sortParameterName = sender.ClientSettings.DataBinding.SortParameterName;

var filterParameterName = sender.ClientSettings.DataBinding.FilterParameterName;

}

function AddFilter(name, value) {

var grid = $find("<%= RadGrid1.ClientID %>");

var filterExpression = new Telerik.Web.UI.GridFilterExpression();

var column = grid.get_masterTableView().getColumnByUniqueName("linkColumn");

var filterFunction = Telerik.Web.UI.GridFilterFunction.Contains;

column.set_filterFunction(filterFunction);

filterExpression.set_fieldName(name);

filterExpression.set_fieldValue(value);

filterExpression.set_filterFunction(filterFunction);

filterExpression.set_columnUniqueName("name");

grid.get_masterTableView()._updateFilterControlValue(value, "name", filterFunction);

grid.get_masterTableView()._filterExpressions.add(filterExpression);

}

function AddAllFilterExpressions(sender, args) {

AddFilter("aname", document.getElementById('<%= tAccountName.ClientID %>').value);

AddFilter("fname", document.getElementById('<%= tFirstName.ClientID %>').value);

AddFilter("lname", document.getElementById('<%= tLastName.ClientID %>').value);

AddFilter("email", document.getElementById('<%= tEmail.ClientID %>').value);

AddFilter("uname", document.getElementById('<%= tUserName.ClientID %>').value);

}

var currentLoadingPanel = null;

var currentUpdatedControl = "<%= Panel1.ClientID %>";

function RequestStart(sender, args) {

currentLoadingPanel = $find("<%= RadAjaxLoadingPanel1.ClientID %>");

//show the loading panel over the updated control

currentLoadingPanel.show(currentUpdatedControl);

}

function ResponseEnd() {

//hide the loading panel and clean up the global variables

if (currentLoadingPanel != null)

currentLoadingPanel.hide(currentUpdatedControl);

currentUpdatedControl = null;

currentLoadingPanel = null;

}

</script>

LoadingPanel doesn't show when using ClientSide Binding and RequestStart

1 Answer, 1 is accepted