Update value in modalpop panel inside the updatePanel - asp.net

Here I try to update the Label value base on click event of Linkbutton which is inside the repeater control. Scenario is When I click on Linkbutton same time Modal popup open and the Label text also change.
Below is my code.
<%# Page Language="C#" AutoEventWireup="true" CodeFile="ModalPopupUpdatePanel.aspx.cs"
Inherits="ModalPopupUpdatePanel" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>ModalPopups and UpdatePanels</title>
<link rel="stylesheet" href="StyleSheet.css" />
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="scriptMgr1">
</asp:ScriptManager>
<div style="width: 300px; left: 100px">
<div >
<asp:Label ID="Label2" runat="server">Update Panel that contains a ModalPopup and its associated PopupPanel inside it</asp:Label>
<asp:UpdatePanel runat="server" ID="updatePanel2" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<br />
<asp:Repeater runat="server" ID="btnresr" DataSourceID="SqlDataSource1">
<ItemTemplate>
<asp:LinkButton runat="server" ID="text" OnClick="Button5_Click" Text=' <%# DataBinder.Eval(Container.DataItem, "AgentName")%>' BackColor="Red"></asp:LinkButton>
</ItemTemplate>
</asp:Repeater>
<asp:Button runat="server" ID="button2" Text="Launch Modal Popup2" style="display:none"/>
<ajaxToolkit:ModalPopupExtender runat="server" ID="modalPopupExtender2" TargetControlID="button2"
PopupControlID="modalPanel2" OkControlID="okBtn2" CancelControlID="cancelBtn2"
BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:PTBWConnectionString %>"
SelectCommand="SELECT [AgentName], [AgentID] FROM [AgentMaster]">
</asp:SqlDataSource>
<asp:Panel runat="server" ID="modalPanel2" BackColor="AliceBlue" Style="display: none">
<asp:UpdatePanel runat="server" ID="updatePanel4" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:Label runat="server" ID="label5" ></asp:Label>
<asp:Button runat="server" ID="postbackBtn" Text="Click to Cause postback" OnClick="postbackBtn_Click" /><br />
<asp:Button runat="server" ID="cancelBtn2" Text="OK" />
<asp:LinkButton runat="server" ID="okBtn2" Text="Cancel" />
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</form>
</body>
</html>
and Code behind
using System;
using System.Web.UI.WebControls;
public partial class ModalPopupUpdatePanel : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void updateLabel_Click(object sender, EventArgs e)
{
}
protected void postbackBtn_Click(object sender, EventArgs e)
{
label5.Text = "After Postback";
}
protected void Button5_Click(object sender, EventArgs e)
{
LinkButton l = (LinkButton)sender;
label5.Text = "This is before postback,saroop";
modalPopupExtender2.Show();
}
}
I am block here please help me..Is there any Jquery way then also please here me

That is because the lable5 is not avaiable like that, it is nested inside the RepeaterItem.
Can you try this.
LinkButton l = (LinkButton)sender;
RepeaterItem rpt = (RepeaterItem)l.Parent();
Label label5 = (Label)rpt.FindControl("label5");
label5.Text = "This is before postback,saroop";
modalPopupExtender2.Show();

Related

link button click not getting fired

I am sorry I am repeating this question. Rather, I am having to repeat it. The last time I posted this, I dint get an answer. I have googled for more than 3 hrs, dint find an answer. Heres the html for the linkbutton and the modal popup. The link button is inside/on a tab panel and auto postback is set to true.
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClick="lnkAddNewAddress_Click">Click Here To Add New Address</asp:LinkButton>
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled" >
</asp:ModalPopupExtender>
I want the clickevent of the linkbutton to fire which is not happening. However clicking on the link does open the modal popup extender (which is also something I want)... How do I get into the click event. I know that a postback is being avoided here because of the modal popup probably...but I dont the solution for it....
The code on save button:
if(hdnfld.Value.ToString()!=null)
{
if(hdnfld.Value.ToString()=="Save")
{
SaveNewAddress();
}
else
{
UpdateAddress();
}
<%# Page StylesheetTheme="" Title="" Language="C#" MasterPageFile="~/Site.Master"
AutoEventWireup="true" CodeBehind="frmMyAccountMyProfile.aspx.cs" Inherits="WebApplication1.frmMyAccountMyProfile" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
function CheckType(type)
{
document.getElementById("hdnfld").value = type;
alert(document.getElementById("hdnfld").value);
return false;
}
</script>
<link href="Styles/myStyleSheet.css" rel="stylesheet" type="text/css" />
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div class="divwrap">
<table style="width: 100%; margin-right: 0px;">
<tr>.........
<td>
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('Save');">Click Here To Add New Address</asp:LinkButton>
<asp:HiddenField ID="hdnfld" runat="server" />
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground" DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled">
</asp:ModalPopupExtender>
...........
<asp:Button ID="btnEdit" runat="server" CssClass="roundcorner btn" OnClick="btnEdit_Click" OnClientClick="return CheckType('Edit');" Text="Edit" />
<asp:Panel ID="pnlMyAddressBook" runat="server" BackColor="White" CssClass="roundcorner">
you can use hidden field instead of viewstate, if you really want to retain some value at code behind. You can access hidden field at client side as well as in code behind too.
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('save');">Click Here To Add New Address</asp:LinkButton>
<asp:HiddenField ID="hdf_type" runat="server" />
Javascript code
function CheckType(type) {
document.getElementById("hdf_type").value = type;
return false;
}
Access value in code behind when clicked on save button, and perform your action save or update according to value in hidden field.
hdf_type.Value.ToString();
MORE HELP FOR YOU
HTML FILE SHOULD LOOK LIKE THIS
below i'm posting the whole code which is working fine for me.
<head runat="server">
<title></title>
<script type="text/javascript">
function CheckType(type) {
document.getElementById("hdf_type").value = type;
alert(document.getElementById("hdf_type").value);
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('save');">Click Here To Add New Address</asp:LinkButton>
<asp:Button ID="btn" runat="server" OnClientClick="return CheckType('edit');" Text="Click Here To Add New Address" />
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled">
</asp:ModalPopupExtender>
<div id="pnlMyAddressBook" style="height: 100px; width: 100px; display: none; background-color: Gray">
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /><br />
</div>
<asp:HiddenField ID="hdf_type" runat="server" />
</div>
</form>
getting value at code behind:
Try this:
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClick="lnkAddNewAddress_Click">Click Here To Add New Address</asp:LinkButton>
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="btnHidden">
</asp:ModalPopupExtender>
<asp:Button ID="btnHidden" runat="server" style="Display:none;" Text="Button"/>
In Code behind:
protected void lnkAddNewAddress_Click(object sender, EventArgs e)
{
lnkAddNewAddress_ModalPopupExtender.Show();
}

AJAX GridView Not Updating

I am using a update panel and placing the SqlDataSource as well as the GridView inside the contenttemplate
i've set timercontrol as the asyncpostback trigger but the gridview does not update when i change a record from the related table in sqlserver plus what seems even more crazy is that the deleted record still shows up in the grid view when i do refresh(full post back of page)
Also i've disabled caching for the datasource however this aint wrking HELP!!!!!
here's my code
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs"
Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<div id="ajx">
<div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:busConnectionString %>"
SelectCommand="SELECT * FROM [reserv]" EnableCaching="false" CacheDuration="0" CacheExpirationPolicy="Absolute" EnableViewState="false"></asp:SqlDataSource>
</div>
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataSourceID="SqlDataSource1" EnableModelValidation="True">
<Columns>
<asp:BoundField DataField="SeatNo" HeaderText="SeatNo"
SortExpression="SeatNo" />
<asp:BoundField DataField="Status" HeaderText="Status"
SortExpression="Status" />
</Columns>
</asp:GridView>
</div>
<div>
<asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
</asp:Timer>
</div>
<div>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1"/>
</Triggers>
</asp:UpdatePanel>
</form>
</body>
</html>
You'll have to manually databind the datasource and gridview on each tick of the timer.
Add the following to your Timer1_Tick event:
protected void Timer1_Tick(object sender, EventArgs e)
{
SqlDataSource1.DataBind();
GridView1.DataBind();
}

UpdatePanel + Timer takes focus from my DropDownList

I use a timer and updatepanel to show clock in my page (Just an example).
Using this codes in my aspx:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script type="text/javascript">
</script>
<script runat="server">
protected void btnClick(object sender, EventArgs e)
{
for (int i = 0; i < 100000000; i++)
{
txt.Text = "Denis Storti";
}
}
protected void TimerTick(object sender, EventArgs e)
{
DropDownList1.Focus();
ScriptManager1.SetFocus(DropDownList1);
for (int i = 0; i < 100000000; i++)
{
txt.Text = "Timer Tick";
//upnBusca.Update();
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<script type="text/javascript">
function Cancel() {
Sys.WebForms.PageRequestManager.getInstance().abortPostBack();
}
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args) {
postBackElement = args.get_postBackElement();
if (postBackElement.id == 'Timer1') {
$get('UpdateProgress1').style.display = "block";
}
}
function EndRequest(sender, args) {
if (postBackElement.id == 'Timer1') {
$get('UpdateProgress1').style.display = "none";
}
}
</script>
<div style="padding-left: 20%; padding-top: 10%">
<p>
<asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="TimerTick">
</asp:Timer>
<asp:UpdatePanel ID="upnBusca" UpdateMode="Conditional" ChildrenAsTriggers="false"
runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnBusca" EventName="Click" />
</Triggers>
<ContentTemplate>
<asp:TextBox ID="txt" runat="server">
</asp:TextBox>
<asp:Button ID="btnBusca" runat="server" OnClick="btnClick" Text="Busca Nome" />
<%=DateTime.Now.ToString() %>
<asp:UpdatePanel ID="upnDate" UpdateMode="Conditional" ChildrenAsTriggers="false"
runat="server">
<ContentTemplate>
<%=DateTime.Now.ToString() %>
<br />
<asp:DropDownList ID="DropDownList1" runat="server"
Width="110px">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
<asp:ListItem>6</asp:ListItem>
<asp:ListItem></asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
<asp:AsyncPostBackTrigger ControlID="DropDownList1" />
</Triggers>
</asp:UpdatePanel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress DisplayAfter="0" ID="UpdateProgress1" runat="server" DynamicLayout="False">
<ProgressTemplate>
<span style="font-size: large">Processing...</span>
<asp:LinkButton ID="LinkButton1" runat="server" OnClientClick="Cancel(); return false;"
Text="Cancel" />
</ProgressTemplate>
</asp:UpdateProgress>
</p>
</div>
</form>
</body>
</html>
I choose a dropdownlist this ajax code cause the dropdownlist unfocused and close.
how can I maintain focus on this dropdownlist.
any help would be appreciated. Thanks

Specify when UpdateProgress Control are displayed

Does anyone have a resource or provide a code sample on when not to display an UpdatePrgress Control when a certain button is clicked.
in your Markup:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Label ID="Label1" runat="server" Text="Initial page rendered."></asp:Label><br />
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
Processing...
</ProgressTemplate>
</asp:UpdateProgress>
in your code behind:
protected void Button1_Click(object sender, EventArgs e)
{
// Introducing delay for demonstration.
System.Threading.Thread.Sleep(3000);
Label1.Text = "Page refreshed at " +
DateTime.Now.ToString();
}
this should work, try it...
source: Introduction to the UpdateProgress Control

How to get data from controls in Repeater

I have repeater with item template:
<asp:Repeater ID="queryParametersRepeater" runat="server"
DataSourceID="queryParametersObjectDataSource">
<ItemTemplate>
<tr class="itemTemplate">
<td class="labelTd" style="width: 300px;">
<asp:HiddenField runat="server" Value='<%# Eval("ParameterType") %>' />
Define <%# Eval("ParameterName") %> (type <%# Eval("ParameterType") %>)
</td>
<td class="valueTd">
<asp:TextBox runat="server" Width="300px" Text='<%# Eval("ParameterName") %>' />
<asp:CheckBox runat="server" Width="300px" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
In jQuery I change display property of textBox and chekBox. How can I get data from those controls?
I can't use FindControls() function, because I don't know id of my controls.
You can use ID's and findcontrol to get the values. Here is a working example:
<%# Page Language="C#" %>
<%# Import Namespace="System.Collections.Generic" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//bind the data source
RepeaterExample.DataSource = new List<KeyValuePair<int, string>>{
new KeyValuePair<int, string>(1, "Test1"),
new KeyValuePair<int, string>(2, "Test2"),
new KeyValuePair<int, string>(3, "Test3")
};
RepeaterExample.DataBind();
}
}
protected void cmdSubmit_Click(object sender, EventArgs e)
{
//read the values and output them
litResults.Text = "";
foreach (RepeaterItem i in RepeaterExample.Items)
{
TextBox txtExample = (TextBox)i.FindControl("txtExample");
if (txtExample != null)
{
litResults.Text += txtExample.Text + "<br />";
}
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater ID="RepeaterExample" runat="server">
<HeaderTemplate>
test</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txtExample" runat="server" Text='<%#Eval("Value") %>'></asp:TextBox>
</ItemTemplate>
</asp:Repeater><br />
<asp:Button ID="cmdSubmit" runat="server" Text="Submit" OnClick="cmdSubmit_Click" />
<br />
<asp:Literal ID="litResults" runat="server"></asp:Literal>
</div>
</form>
</body>
</html>
Can you add a class to your controls?
If so you could try with $(".givenClass").

Resources