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

How to display this progressbar in Div onRowClick

1 Answer 82 Views

Grid

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

Nirav asked on 31 Jan 2011, 10:29 PM

Hi,
I am using 2009.3.1103.20 version of Telerik Controls.
Now, on my RadGrid, I process something serverside when row is clicked, and then visible other panel of my page.
Everything works fine but actually I want to display progressbar when Grid's row is clicked and its processing something.
I already have a Div which I display on everypostback to display progressbar and I want to call the same javascript function to display that progressbar when Grid's row is clicked.
I tried but could not achieve this.
So what I am looking for here is, when Grid's row is clicked, Want to call a javascript function which displays progressbar.
I need to pass clicked Row as object so that I can display progressbar at the same level, if its not possible, I can surely pass RadGrid itself to display progressbar at top of Grid. But my first preference is passing Row as object to my function.
Here is my code.

<div class="Scrollgrid" style="width: 1100px; height: 600px;">

<telerik:RadGrid ID="RadGridAllRequests" runat="server" AllowPaging="true" AllowSorting="true"

AllowFilteringByColumn="true" AutoGenerateColumns="False" BorderStyle="None"

GridLines="Both" OnNeedDataSource="RadGridAllRequests_needdatasource" OnItemDataBound="RadGridAllRequests_ItemDataBound"

OnItemCreated="RadGridAllRequests_ItemCreated" OnItemCommand="RadGridAllRequests_ItemCommand"

AllowMultiRowSelection="true" SelectedItemStyle-CssClass="SelectedItem" Width="100%"

Skin="WebBlue">

<PagerStyle Mode="NextPrevNumericAndAdvanced" Position="TopAndBottom" AlwaysVisible="true" />

<ClientSettings EnableRowHoverStyle="true" EnablePostBackOnRowClick="true">

<Selecting AllowRowSelect="true" />

<%--<ClientEvents OnRowClick="RowClicked" />--%>

</ClientSettings>

<MasterTableView

ShowHeadersWhenNoRecords="true"

AllowFilteringByColumn="true" DataKeyNames="RequestInfoID">

<Columns>

<telerik:GridNumericColumn DataField="RequestInfoID" HeaderText="Request No." SortExpression="RequestInfoID"

DataType="System.Int64" FilterControlWidth="40px" HeaderStyle-Width="100px"

>

</telerik:GridNumericColumn>

</Columns>

<EditFormSettings>

<PopUpSettings ScrollBars="None" />

</EditFormSettings>

<ExpandCollapseColumn Resizable="False" Visible="False">

<HeaderStyle />

</ExpandCollapseColumn>

<RowIndicatorColumn Visible="False">

<HeaderStyle />

</RowIndicatorColumn>

</MasterTableView>

</telerik:RadGrid>

</div>

DIV AT THE BOTTOM OF PAGE:

<div class="WaitDisplay" id="divWait" style="display: none; width: auto;">

<img alt="" src="Images/spinner2.gif" />

<div id="divWaitMessage">

Processing...

</div>

JAVASCRIPT:

function buttonClicked_WithObj(obj) {

divWaitMessage.innerHTML = "Processing........<br />Please wait<br />"

displayBanner_WithObj(divWait, obj);

}

function displayBanner_WithObj(oDiv, obj) {

oDiv.style.position = "absolute";

var leftPos = getAbsoluteLeft(obj);

var topPos = getAbsoluteTop(obj);

oDiv.style.top = topPos - 30;

oDiv.style.left = leftPos;

oDiv.style.display = "block";

}

function getAbsoluteLeft(oNode) {

var oCurrentNode = oNode;

var iLeft = 0;

while (oNode != null && oCurrentNode.tagName != "BODY") {

iLeft += oCurrentNode.offsetLeft;

oCurrentNode = oCurrentNode.offsetParent;

}

return iLeft;

}

function getAbsoluteTop(oNode) {

var oCurrentNode = oNode;

var iTop = 0;

while (oNode != null && oCurrentNode.tagName != "BODY") {

iTop += oCurrentNode.offsetTop;

oCurrentNode = oCurrentNode.offsetParent;

}

return iTop;

}

Now in Above code, I want to call something like
onRowClick="javascript:Page_BlockSubmit = false;buttonClicked_WithObj(this);"

Any idea how can I call this javascript function to display my Div by passing clicked row as object or by passing Grid as object?

This javascript is working fine for all the controls on screen so just need to call to display progressbar on clicked row.

Thanks in advance,

How to display this progressbar in Div onRowClick

1 Answer, 1 is accepted