Solved

How to refresh updatepanel content when user click on table row within that control?

Posted on 2008-10-20
12
1,112 Views
Last Modified: 2008-10-21
Hi, I have updatepanel control which contains a table, I want to execute a serverside function and then refresh that update control once user double click on a table row, how can I do that?
0
Comment
Question by:Abdu_Allah
  • 6
  • 6
12 Comments
 
LVL 6

Expert Comment

by:AmarIs26
ID: 22756614
If your Table is inside the update panel and your Table is initiating the postback to the server then the updatepanel will automatically update providing the UpdateMode is not set or is not set to Confitional.

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Table... />
</ContentTemplate>
</asp:UpdatePanel>
If it is set to Conditional then in your server side method you must update the updatepanel by calling the method.
UpdatePanel1.Update();
If your table is outside the updatepanel and you still want to update, then you must set the UpdateMode="Conditional" and then register the Table control for Asyncpostback using the scriptmanager. (Note: that if your updatepanel's updatemode is not set or is set to always then you dont need to register for asyncpostback).

ScriptManager.RegisterAsyncPostBackControl(Table...
 
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22756651
My table is inside the updatepanel. I want to refresh the content of updatepanel once user double click on a row in that table.
0
 
LVL 6

Expert Comment

by:AmarIs26
ID: 22756774
Sorry the above solution assumed you already are calling the server side function and your updatepanel is not updating. If you just want to know how to call the server side function from row double click then...

Also you can call the following code in javascript from the doubleclick event of the html row and then add this javascript to your page.
<script language="javascript" type="text/javascript">
function CallServerFunction(rowID,arg)
{
  __doPostBack(postBackDataID,arg)
}
</script>
So imagine your table is like this. Because it is a htmltable we need to add runat="server" and the id property

<table style="width: 100%;" runat="server" id="testTable">
<tr>
<td>
asdsadasd
</td>
</tr>
</table>
in the serverside code behind. This is basically trying to see if a row has been double clicked, if so call our ServerFunction.

protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);

string eventTarget = Request.Form["__EVENTTARGET"];
if (!string.IsNullOrEmpty(eventTarget) && eventTarget== "ServerFunction")
{
//Call Server Function
}
}
 Finally, Ensure that we attach double click event handlers to each table row. This will call the javascript function passing the serverside function name to execute.

protected override void OnPreRender(EventArgs e)
{
foreach (HtmlTableRow row in testTable.Rows)
{
row.Attributes.Add("ondblclick" , "javascript:CallServerFunction('ServerFunction','row1');");
}
base.OnPreRender(e);
}
 
 
 
 
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22756973
Thank you for that code but I noticed that the postback refresh the entire page not only Updatepanel content, how to make it just refresh just updatepanel content only. Something else how can I get the arg that I sent from via CallServerFunction function.
0
 
LVL 6

Expert Comment

by:AmarIs26
ID: 22757141
Sorry the previous javascript had an error. here is the code that works fully with args being passed. Basically you need to add a hiddenfield in the update panel which will hold your arg and server name

<asp:HiddenField ID="HiddenField1" runat="server" OnValueChanged="HiddenField1_ValueChanged" />
Then when you call the CallServerFunction (javascript one) it will populate the hidden field with the server function id (not recommended use some sort of key name) + arg. This can be retrieved on teh server side in the ValueChanged event of the hidden field.

<script language="javascript" type="text/javascript">
function CallServerFunction(rowID,arg)
{
var hiddenID = '<%= HiddenField1.ClientID %>';
var hiddenField = document.getElementById(hiddenID);
hiddenField.value = rowID + ","+arg;
__doPostBack(hiddenID,arg)
}
</script>
 So all you  need to do is
HiddenField1.Value
and split that with "," to separate the function name and arg.
 
 
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22757145
ooops I forgot the runat server property for the updatepanel, it works fine but how can I get the arguments I sent via __doPostBack(postBackDataID,arg)  in the Onload function that ?
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 6

Expert Comment

by:AmarIs26
ID: 22757162
Also you dont need the code in the OnLoad event. All that can go. :)
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22757180
Actually I want to retreive the arguments data in the Onload function how can I do that?
0
 
LVL 6

Expert Comment

by:AmarIs26
ID: 22757201
then you could use the piece of code i asked you to remve
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);

string eventTarget = Request.Form["__EVENTTARGET"];
if (!string.IsNullOrEmpty(eventTarget) && eventTarget== "HiddenField1")
{
      string value = HiddenField1.Value;
//     value.Split(new string[]{","});
}
}  
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22757390
AmarIs26, if I place an asp:button inside the updatepanel and then click it the postback event fired successfully and only the updatepanel area is refreshed but if I double click on the table row the postback event fired successfully but the entire page is refreshed!
0
 
LVL 6

Accepted Solution

by:
AmarIs26 earned 500 total points
ID: 22757508
Here is the full solution as described in the posts. It works on my machine fine without the page refresh.

<script language="javascript" type="text/javascript">
function CallServerFunction(rowID,arg)
{
var hiddenID = '<%= HiddenField1.ClientID %>';
var hiddenField = document.getElementById(hiddenID);
hiddenField.value = rowID + ","+arg;
__doPostBack(hiddenID,arg)
}
</script>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:HiddenField ID="HiddenField1" runat="server" OnValueChanged="HiddenField1_ValueChanged" />
<table style="width: 100%;" runat="server" id="testTable">
<tr>
<td>
asdsadasd
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
 
-------------------Code behind ----------------
 

protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
if (!string.IsNullOrEmpty(HiddenField1.Value))
{
//Call Server Function
string [] args = HiddenField1.Value.Split(new string[] { "," },StringSplitOptions.None);
string functionName = args[0];
string arg = args[1];
if (functionName == "Function1")
{
// Call Function 1
}
}
}

protected override void OnPreRender(EventArgs e)
{
foreach (HtmlTableRow row in testTable.Rows)
{
row.Attributes.Add("ondblclick" , "javascript:CallServerFunction('ServerFunction','row1');");
}
base.OnPreRender(e);
}

protected void HiddenField1_ValueChanged(object sender , EventArgs e)
{
// Reset the value so next time change event occurs.
HiddenField1.Value = string.Empty;
}
 
0
 
LVL 3

Author Comment

by:Abdu_Allah
ID: 22765310
Thank you man.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Host asp.net pages 5 25
Error on Add method 1 38
Why is some text in blue in Visual Studio? 6 23
Where can I ask about my ASP.NET MVC project? 6 21
Lots of people ask this question on how to extend the “MembershipProvider” to make use of custom authentication like using existing database or make use of some other way of authentication. Many blogs show you how to extend the membership provider c…
Today is the age of broadband.  More and more people are going this route determined to experience the web and it’s multitude of services as quickly and painlessly as possible. Coupled with the move to broadband, people are experiencing the web via …
Internet Business Fax to Email Made Easy - With  eFax Corporate (http://www.enterprise.efax.com), you'll receive a dedicated online fax number, which is used the same way as a typical analog fax number. You'll receive secure faxes in your email, f…
As a trusted technology advisor to your customers you are likely getting the daily question of, ‘should I put this in the cloud?’ As customer demands for cloud services increases, companies will see a shift from traditional buying patterns to new…

920 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now