Ajax UpdateProgress not working - javascript

i am using ajax UpdateProgress bar in asp dot net with button click but query execute in write format but prrgress bar not run how to slove this type of problem.plz help me give me any solutions of progress bar
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.style1
{
width: 100%;
}
</style>
<script language="javascript" type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args) {
if (prm.get_isInAsyncPostBack())
args.set_cancel(true);
postBackElement = args.get_postBackElement();
if (postBackElement.id == 'Button1')
$get('UpdateProgress1').style.display = 'block';
}
function EndRequest(sender, args) {
if (postBackElement.id == 'Button1')
$get('UpdateProgress1').style.display = 'none';
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:ToolkitScriptManager ID="ScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<table class="style1">
<tr>
<td>
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
<td>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click"Text="Button"/>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
</table>
<asp:UpdateProgress ID="PageUpdateProgress" runat="server">
<ProgressTemplate>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<img src="images/ajax-loader.gif" alt="image missing" />
</ProgressTemplate>
</asp:UpdateProgress>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>

I think you are missing a prm.add_beginRequest(onPrmBeginRequest); here.
The progress must be shown when the request begins:
onPrmBeginRequest = function (sender, args) {
var postBackElement = args.get_postBackElement();
if (postBackElement.id == 'Button1') {
$get('UpdateProgress1').style.display = 'block';
}
}
So move the appropriate code block from initializeRequest to beginRequest.
Now you can hide in endrequest.
Note:
The id may have been mangled by ASP.Net unless clientIDMode is specified. So make sure you are using the id like ctl00_ContentPlaceHolder1_UpdateProgress1.

Related

How to generate another form on checkbox select event using loop in ASP.NET?

I created a form with validations to take member's details and register it. I want to create another form when user click on add another member by using it. Is it possible to have 2 form tag in one page in ASP.NET, and how to do it?
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="webAss1.WebForm4" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.auto-style1 {
width: 59%;
}
.auto-style2 {
width: 112px;
}
.auto-style3 {
width: 112px;
height: 29px;
}
.auto-style4 {
height: 29px;
}
</style>
</head>
<body>
<h2>MEMBER REGISTRATION FORM</h2>
<p>
Enter the details:</p>
<form id="form1" runat="server">
<table class="auto-style1">
<tr>
<td class="auto-style2">Name:</td>
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style2">Email:</td>
<td>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style2">Contact no:</td>
<td>
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style3">Address:</td>
<td class="auto-style4">
<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
</td>
<td class="auto-style4"></td>
</tr>
<tr>
<td class="auto-style2"> </td>
<td>
<asp:CheckBox ID="CheckBox1" runat="server" />
</td>
<td> </td>
</tr>
<tr>
<td class="auto-style2"> </td>
<td>
<asp:Button ID="Button1" runat="server" Text="Button" />
</td>
<td> </td>
</tr>
</table>
<div>
</div>
</form>
</body>
</html>
Please help
If you test another server side form in you page you will get this error:
A page can have only one server-side Form tag.
But you can add another form without runat="server. That is a client side form. But I think it is useless. Maybe do some help for validations.(Of course client side validations with $("#form_id").valid();)

Refresh partial page on user control text change event

I have one Usercontrol Textbox with some radio buttons.
I want to refresh some of these buttons when I change the usercontrol textbox value.
In short, when I select Specific button it displays RM row & for All radio button selection it hides RM row. After selecting RM & checking Client radio button, it again displays two radio button below. By checking any of radio it displays the grid data below. For Prospect & Closed button it displays grid data below after checking it.
For all radio all the functionality is same except RM selection.
My all functionality is working as expected just need to add one more addition in it.
Now I want to refresh 5 radio buttons(Client, Prospect, Closed, Client, Family) which are below RM user control screen when I change the RM name from usercontrol textbox.
I tried using update panel but it couldn't work as it got mess for me so reverted all that changes. My current working code is as below:
<script type="text/javascript">
$110 = $;
$110(document).ready(function () {
//intial setting of panel
rdoBtnShowHidePanels();
$110("#trClient").hide();
$110("#btnSendSms").hide();
$110("#trCommMode").hide();
$110("input[type='radio'][name='First']").attr('checked', false);
$110("input[type='radio'][name='SelectRM']").change(function () {
$110("#trClient").hide();
$110("#jqxContact").hide();
$110("#trCommMode").hide();
if ($110("input[type='radio'][id='RdoSpecific']").is(":checked") == true) {
$110("input[type='radio'][name='First']").attr('checked', false);
$110("input[type='radio'][name='a']").attr('checked', false);
$110("#trRM").show();
$("input[id$=mcscRMSearch_txtSearch]").val('');
$110("input[type='radio'][name='First']").change(function () {
if ($110("input[type='radio'][id='RdoSpecific']").is(":checked") == true) {
if (ValidateRMSelection() == true) {
$110("#trRM").show();
if ($110("input[type='radio'][id='rdoClientAll']").is(":checked") == true) {
$110("#trClient").show();
$110("input[type='radio'][name='a']").change(function () {
$110("#hdnType").val("C");
$110("#jqxContact").show();
var getselectedrowindexes = $110('#jqxContact').jqxGrid('getselectedrowindexes');
$110('#jqxContact').jqxGrid('unselectrow', getselectedrowindexes);
$110('#jqxContact').jqxGrid('clearselection');
if ($110("input[type='radio'][id='RdoSpecific']").is(":checked") == true) {
BindGridBasedOnRadioButtons();
}
$110("#trCommMode").show();
return;
})
}
else {
$110("#hdnType").val("P");
$110("input[type='radio'][id='rdoclient']").prop("checked", false);
$110("input[type='radio'][id='rdofamily']").prop("checked", false);
$110("#trClient").hide();
$110("#jqxContact").show();
var getselectedrowindexes = $110('#jqxContact').jqxGrid('getselectedrowindexes');
$110('#jqxContact').jqxGrid('unselectrow', getselectedrowindexes);
$110('#jqxContact').jqxGrid('clearselection');
if ($110("input[type='radio'][id='RdoSpecific']").is(":checked") == true) {
BindGridBasedOnRadioButtons();
}
$110("#trCommMode").show();
return;
}
}
else {
alert("Select RM");
$110("#trClient").hide();
$110("#trCommMode").hide();
$110("#jqxContact").hide();
return;
}
}
})
}
else {
$110("#trRM").hide();
$110("#trCommMode").hide();
$110("input[type='radio'][name='First']").attr('checked', false);
$110("input[type='radio'][name='a']").attr('checked', false);
$110("input[type='radio'][name='First']").change(function () {
if ($110("input[type='radio'][id='rdoClientAll']").is(":checked") == true) {
$110("#jqxContact").hide()
$110("#trClient").show();
$110("input[type='radio'][name='a']").change(function () {
$110("#hdnType").val("C");
$110("#jqxContact").show();
var getselectedrowindexes = $110('#jqxContact').jqxGrid('getselectedrowindexes');
$110('#jqxContact').jqxGrid('unselectrow', getselectedrowindexes);
$110('#jqxContact').jqxGrid('clearselection');
BindGridBasedOnRadioButtons1();
$110("#trCommMode").show();
return;
})
}
else {
$110("#hdnType").val("P");
$110("input[type='radio'][id='rdoclient']").prop("checked", false);
$110("input[type='radio'][id='rdofamily']").prop("checked", false);
$110("#trClient").hide();
$110("#jqxContact").show();
var getselectedrowindexes = $110('#jqxContact').jqxGrid('getselectedrowindexes');
$110('#jqxContact').jqxGrid('unselectrow', getselectedrowindexes);
$110('#jqxContact').jqxGrid('clearselection');
BindGridBasedOnRadioButtons1();
$110("#trCommMode").show();
return;
}
})
}
})
<form id="Form1" method="post" runat="server">
<asp:ScriptManager ID="scmPhoneBook" runat="server">
</asp:ScriptManager>
<table id="Table1" cellspacing="1" cellpadding="0" width="100%" border="0">
<tr>
<td class="clsTitle" align="center" style="height: 25px">Contacts
</td>
</tr>
<tr>
<td class="clstd" align="left" style="width: 100%" colspan="2">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="clstdnext" align="left" style="width: 100%" colspan="2">
<asp:RadioButton ID="RdoSpecific" runat="server" GroupName="SelectRM" Text="Specific"></asp:RadioButton>
<asp:RadioButton ID="RdoAll" runat="server" GroupName="SelectRM" Text="All"></asp:RadioButton>
</td>
</tr>
<tr id="trRM">
<td class="clstd" width="2%">RM
</td>
<td class="clstd" width="98%">
<mwimcs:MultiColumnSearchControl
runat="server"
ID="mcscRMSearch"
CssClass="clsTextbox"
Width="300"
ControlType="137"
DataTextField="usr_name"
DataValueField="usr_id"
Top="-15px" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="clstdnext" align="left" style="width: 100%" colspan="2">
<asp:RadioButton ID="rdoClientAll" runat="server" GroupName="First" Text="Client"></asp:RadioButton>
<asp:RadioButton ID="RdoProspect" runat="server" GroupName="First" Text="Prospect"></asp:RadioButton>
<asp:RadioButton ID="RdoClosed" runat="server" GroupName="First" Text="Closed"></asp:RadioButton>
</td>
</tr>
<tr id="trClient">
<td class="clstd" align="left" style="width: 100%" colspan="2">
<asp:RadioButton ID="rdofamily" runat="server" GroupName="a" Text="Family"></asp:RadioButton>
<asp:RadioButton ID="rdoclient" runat="server" GroupName="a" Text="Client"></asp:RadioButton>
</td>
</tr>
<tr>
<td valign="top">
<div id="jqxContact"></div>
<asp:Panel ID="PnlClient" runat="server" Width="100%">
</asp:Panel>
</td>
<asp:DataGrid ID="dgCompany" runat="server" Width="100%" AutoGenerateColumns="False"
AllowSorting="True" AllowPaging="True" PageSize="25">
</asp:DataGrid>
</tr>
</table>
<br />
<table width="100%" cellpadding="0" cellspacing="1" border="0">
<tr height="10px">
<td class="clsLabel_err" colspan="2">
<asp:Label ID="lblErrorMsg" runat="server" CssClass="clsLabel_err"></asp:Label>
</td>
</tr>
<tr style="width: 100%" id="trCommMode">
<td class="clstdnext" style="width: 25%">Communication Mode:</td>
<td class="clstdnext" align="left" valign="middle">
<asp:RadioButtonList ID="rbtnlistSmsMail" runat="server" RepeatDirection="Horizontal"
Font-Names="Verdana" Font-Size="11px">
<asp:ListItem>
SMS
</asp:ListItem>
<asp:ListItem>
E-Mail
</asp:ListItem>
</asp:RadioButtonList>
</td>
</tr>
<tr>
<td colspan="2" id="pnlEmailDtls" runat="server">
<asp:Panel ID="pnlpnlEmailDtls" runat="server" Width="100%">
<table id="Table3" cellspacing="1" cellpadding="0" width="100%" border="0">
<tr>
<td class="clstd" style="width: 25%">Email From</td>
<td class="clsTd" style="width: 80%">
<cc1:MultiColumnComboBox ID="mmcEmail" runat="server" CssClass="clstd" HeaderCSS="clsReportTitle"
ItemsCSS="clstdnext" VerticalScrolling="True" DownArrowButtonCSS="clsButton"
DownArrowImageURL="url(Images/downarrow.gif)" DownArrowButtonHeight="12" DownArrowButtonWidth="20"
TextBoxCSS="clsTextbox">
<Columns>
<cc1:Column ColumnWidth="" DataField="email" KeyColumn="True" HeaderText="Email"></cc1:Column>
<cc1:Column ColumnWidth="" DataField="smtp" KeyColumn="False" HeaderText="SMTP"></cc1:Column>
</Columns>
</cc1:MultiColumnComboBox>
</td>
</tr>
<tr>
<td class="clstdnext" style="width: 20px">Subject</td>
<td class="clstdnext" style="width: 80px">
<asp:TextBox ID="txtSubject" runat="server" CssClass="clsTextbox" Width="327px">
</asp:TextBox>
</td>
</tr>
<tr>
<td class="clstd">Attachment 1)
</td>
<td class="clstd">
<input class="clsTextbox" id="fileupload1" style="width: 250px" type="file" size="48" runat="server"
name="fileupload1" />
</td>
</tr>
<tr>
<td class="clstdnext">Attachment 2)
</td>
<td class="clstdnext">
<input class="clsTextbox" id="fileupload2" style="width: 250px" type="file" size="48" runat="server"
name="fileupload2" />
</td>
</tr>
<tr>
<td class="clstd">Attachment 3)
</td>
<td class="clstd">
<input class="clsTextbox" id="fileupload3" style="width: 250px" type="file" size="48" runat="server"
name="fileupload3" />
</td>
</tr>
<tr>
<td class="clsReportTitle" align="center" style="width: 100%" colspan="2">Message
</td>
</tr>
<tr>
<%--<TD width="100%" colSpan=2>
<asp:TextBox id=txtMessage runat="server" CssClass="clsTextbox" Width="100%" TextMode="MultiLine" Height="250px"></asp:TextBox></TD>--%>
<td align="left" class="clstd" colspan="2">
<ftb:FreeTextBox ID="FreeTextBox1" EnableHtmlMode="false" ToolbarLayout="ParagraphMenu, FontFacesMenu, FontSizesMenu, FontForeColorsMenu,FontForeColorPicker, FontBackColorsMenu, FontBackColorPicker, Bold, Italic, Underline,Strikethrough, Superscript, Subscript|InsertImageFromGallery, CreateLink, Unlink, JustifyLeft, JustifyRight, JustifyCenter, JustifyFull,BulletedList, NumberedList, Indent, Outdent,Cut, Copy, Paste, Delete, Undo, Redo,Save,InsertRule, InsertDate,InsertTime,Preview"
Height="300px" runat="server" Width="100%">
</ftb:FreeTextBox>
</td>
</tr>
<tr>
<td style="width: 100%" class="clstd_btn" colspan="2">
<%--<input id="BtnSendEmail" type="button" class="clsButton" value="Send"/>--%>
<asp:Button ID="BtnSendEmail" runat="server" OnClientClick="return ValidationBeforeEmailSendClick();" CssClass="clsButton" Text="Send"></asp:Button>
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
<tr>
<td colspan="2" id="pnlSmsDtls" runat="server">
<asp:Panel ID="pnlpnlSmsDtls" runat="server" Width="100%">
<table cellspacing="1" cellpadding="0" width="100%" border="0">
<tr>
<td class="clstd" style="width: 25%">SMS Type
</td>
<td class="clstd">
<asp:DropDownList ID="ddlSmsType" CssClass="clsCombobox" runat="server">
<asp:ListItem Value="0">---Select---</asp:ListItem>
<asp:ListItem Value="1">Upcoming maturity/due date</asp:ListItem>
<asp:ListItem Value="2">New product offerings</asp:ListItem>
<asp:ListItem Value="3">Pick of the day</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr>
<td colspan="2" class="clstdnext">SMS Text
</td>
</tr>
<tr>
<td colspan="2" class="clstdnext" style="height: 40px">
<asp:TextBox ID="txtSmsText" runat="server" CssClass="clsTextbox" TextMode="MultiLine"
Width="100%" Height="100px">
</asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" class="clstd_btn">
<input type="button" id="btnGo" value="Save" class="clsButton" />
<%--<asp:Button ID="btnGo" runat="server" CssClass="clsButton" Text="Save" />--%>
<asp:Button ID="btnSendSms" runat="server" CssClass="clsButton" Text="Send SMS"
Width="72px"></asp:Button>
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
</table>
<input type="hidden" id="hdnType" />
</form>
Its argent... kindly please help.
Thanks in advance.

How to bind multicolumn radcombo box values to Text boxes client side?

i am using multicolumn rad combo box, in that i have 5 columns like code,name,description, date,remarks. I have to bind these 3 columns values to 3 text boxes when combo box selection changed except value field and text field of combobox. Any body know please share an example.
my aspx page code for combo box is
<table>
<tr>
<td>
<telerik:RadComboBox ID="cmbTendernoticeno" runat="server" MarkFirstMatch="true"
AllowCustomText="false" TabIndex="2" DropDownWidth="230px" HighlightTemplatedItems="true"
EmptyMessage="--Select--" AutoPostBack="True" CausesValidation="false"
onselectedindexchanged="cmbTendernoticeno_SelectedIndexChanged">
<HeaderTemplate>
<table style="width: 200px;">
<tr>
<td style="width: 100px;">
Tendor No.
</td>
<td style="width: 100px;">
Tendor date
</td>
<td style="width: 100px;">
Code
</td>
<td style="width: 100px;">
Code
</td>
<td style="width: 100px;">
Code
</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table style="width: 200px;">
<tr>
<td style="width: 100px;">
<%#DataBinder.Eval(Container.DataItem, "NOTICE_NO")%>
</td>
<td style="width: 100px;">
<%#DataBinder.Eval(Container.DataItem, "NOTICE_DATE", "{0:dd/MMM/yyyy}")%>
</td>
<td style="width: 100px;">
<%#DataBinder.Eval(Container.DataItem, "ACCEPT_DATE")%>
</td>
<td style="width: 100px;">
<%#DataBinder.Eval(Container.DataItem, "TENDER_OPEN_DATE")%>
</td>
<td style="width: 100px;">
<%#DataBinder.Eval(Container.DataItem, "OPENING_PLACE")%>
</td>
</tr>
</table>
</ItemTemplate>
</telerik:RadComboBox>
</td>
</tr>
<tr>
<td>
<label>
Tender Date</label><sup>*</sup>
</td>
<td>
:
</td>
<td>
<telerik:RadTextBox ID="txtTenderDate" runat="server" TabIndex="3" Enabled="false">
</telerik:RadTextBox>
</td>
<td>
</td>
<td>
<label>
Last Date for reciept of Tender</label><sup>*</sup>
</td>
<td>
:
</td>
<td>
<telerik:RadTextBox ID="txtLastdtforrcptTender" runat="server" TabIndex="4" Enabled="false">
</telerik:RadTextBox >
</td>
</tr>
<tr>
<td>
<label>
Date of Opening</label><sup>*</sup>
</td>
<td>
:
</td>
<td>
<telerik:RadTextBox ID="txtDateofOpening" TabIndex="5" runat="server" Enabled="false">
</telerik:RadTextBox >
</td>
<td>
</td>
<td>
<label>
Place of Opening</label><sup>*</sup>
</td>
<td>
:
</td>
<td>
<telerik:RadTextBox ID="txtPlaceofopening" MaxLength="500" runat="server" TabIndex="6" Enabled="false">
<ClientEvents OnKeyPress="validateAlphanumeric" />
</telerik:RadTextBox>
</td>
</tr>
</table>
cs file code is
public void fillTendernoticeno()
{
DataSet ds = new DataSet();
ds = ObjpsBal.fillTendernoticeno();
cmbTendernoticeno.DataTextField = "NOTICE_NO";
cmbTendernoticeno.DataValueField="NOTICE_DATE";
cmbTendernoticeno.DataSource=ds;
cmbTendernoticeno.DataBind();
}
now i want to get the combo box multicolumn values(NOTICE_DATE,ACCEPT_DATE,TENDER_OPEN_DATE,OPENING_PLACE) and has to show in proper text boxes.

Open a ModalPopupExtender on an UpdatePanel using javascript

I'm trying to open a ModalPopup with JavaScript, and i've searched here on stackoverflow and the general advice seems be to use something like this:
$('#inputAdd').live("click", function () {
$('#addRow').show();
$find('<%=mpeIndications.BehaviorID %>').show();
});
Where #inputAdd is an html input image that i have in the ModalPopup, its objective is to show a row (#addRow) where a TextBox is shown. However, when i click on the #inputAdd button, it show the row, but then the ModalPopup hide, I think the reason maybe because there is an UpdatePanel that include the ModalPopup, I am right? In that case which may be a solution? I've putted some of the code I've in the .ascx. Thanks.
<table class="content-box">
<tr>
<td valign="top">
<asp:UpdatePanel runat="server" ID="upAppointments">
<ContentTemplate>
<table>
<tr>
<td>
<asp:Button runat="server" ID="btnIndicationsHidden" Style="display: none;" />
<asp:Panel runat="server" ID="pnlIndications" CssClass="modalPanel" Style="display: none;">
<table class="content-box">
<tr>
<td>
<table style="width: 100%;">
<tr>
<td>
<asp:Panel runat="server" ID="pnlShowCurrentIndication" Style="padding: 13px 8px 8px 8px">
<table style="width: 100%; border: 0;">
<tr>
<td style="width: 30%; vertical-align: top;" rowspan="2">
<asp:RadioButtonList runat="server" ID="gvProfiles" OnDataBound="gvProfiles_DataBound"
DataTextField="Name" DataValueField="Id" Style="white-space: nowrap;" />
</td>
<td style="padding-left: 10px;" class="contentBox">
<table style="width: 100%;">
<tbody id="showTable">
<tr>
<td id="indicacionestd" runat="server">
Indicaciones:
</td>
</tr>
<tr>
<td>
<asp:BulletedList ID="blIndicaciones" DataTextField="Valor" runat="server">
</asp:BulletedList>
</td>
</tr>
<tr>
<td id="contraindicacionestd" runat="server">
Contraindicaciones:
</td>
</tr>
<tr>
<td>
<asp:BulletedList ID="blContraindicaciones" DataTextField="Valor" runat="server">
</asp:BulletedList>
</td>
</tr>
</tbody>
<tbody style="display: none;" id="addRow">
<tr>
<td style="text-align: left; white-space: nowrap;" class="colSepGran">
Nombre:
</td>
</tr>
<tr class="filSepGranRA">
<td class="colSepGran">
<asp:TextBox runat="server" ID="txbName" CssClass="txtNoWidth" Width="150px" ToolTip="Especifique el nombre del perfil"></asp:TextBox>
<act:FilteredTextBoxExtender runat="server" ID="ftbeName" FilterMode="ValidChars"
FilterType="UppercaseLetters, LowercaseLetters, Custom" TargetControlID="txbName"
ValidChars="ñ Ñ ' á é í ó ú Á É Í Ó Ú ü Ü ." />
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="text-align: center; vertical-align: middle;">
<table style="width: 100%;">
<tr>
<td>
</td>
<td>
<input type="image" src="../../App_Themes/Theme/Images/AppIcons/add.png/" id="inputAdd"
title="Adicionar perfil">
</td>
<td>
<input type="image" src="../../App_Themes/Theme/Images/AppIcons/add_document.png"
id="inputAddSimple" title="Adicionar indicación" />
</td>
<td>
<input type="image" src="../../App_Themes/Theme/Images/AppIcons/edit.png" id="inputEdit"
title="Editar perfil" />
</td>
<td>
<asp:ImageButton runat="server" ID="imbRemoveProfile" ToolTip="Eliminar perfil" ImageUrl="~/App_Themes/Theme/Images/AppIcons/delete.png" />
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
</table>
</td>
</tr>
</table>
</asp:Panel>
<act:ModalPopupExtender ID="mpeIndications" runat="server" PopupControlID="pnlIndications"
BackgroundCssClass="modalBackground" TargetControlID="btnIndicationsHidden" CancelControlID="imbCloseIndications"
BehaviorID="mpeIndications">
</act:ModalPopupExtender>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
Then try this approach:
Add a hidden link for ModalPopup Extender to attach to(which will NEVER be used)
<a href="#" style="display:none;visibility:hidden;"
onclick="return false" ID="dummyLink" runat="server">dummy</a>
Add the ID of the hidden link to the ModalPopupExtender
<act:ModalPopupExtender ID="mpeIndications" runat="server" PopupControlID="pnlIndications"
BackgroundCssClass="modalBackground"
TargetControlID="dummyLink"
CancelControlID="imbCloseIndications"
BehaviorID="mpeIndications">
Showing the modal popup
$find('MyMPE').show();
http://www.geekzilla.co.uk/View38736C2B-BAD3-418A-A5B0-DAC4F1A5A83A.htm
Model Dialog Asp.Net With Jquery

Javascript with ASP:TextBox inside Repeater

Okay so I've got a little problem with combining my own Javascript with the ASP server controls.
The picture: I've got a couple of ASP:TextBoxes on my page who are created by a repeater. My goal is to sum all the values the user types into these textboxes. This must happen whenever the user changes something to the content of the textboxes. (On the bottom of the page I got a little price calculator, which works with server side code but I want to make it more dynamic, I'm talking about txtTeam and txtPart)
<asp:Content ID="Content3" ContentPlaceHolderID="contentPlaceHolder" runat="Server">
<script type="text/javascript">
</script>
<div id='inputDiv'>
<h1>
Students per team</h1>
<table>
<tr>
<td>
Team
</td>
<td>
Actual
</td>
<td>
Maximum
</td>
</tr>
<asp:Repeater ID="Repeater2" runat="server" DataSourceID="odsTeams">
<ItemTemplate>
<tr>
<td id='td<%# Eval("team_id") %>'>
<%# Eval("name") %>
</td>
<td id='txtTeam<%# Eval("team_id") %>'>
<asp:TextBox ID="txtTeam" runat="server"></asp:TextBox>
<asp:RangeValidator EnableClientScript="true" ID="rgvTeams" runat="server" ErrorMessage="*"
MinimumValue="0" MaximumValue='<%# Eval("st_max") %>' ControlToValidate="txtTeam"></asp:RangeValidator>
</td>
<td id='lblTeam<%# Eval("team_id") %>'>
<asp:Label runat="server">
<%# Eval("st_max") %>
</asp:Label>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
<asp:ObjectDataSource ID="odsTeams" runat="server" OldValuesParameterFormatString="original_{0}"
SelectMethod="GetTeamsByDelegationID" TypeName="ERASTableAdapters.tbl_teamTableAdapter"
OnSelecting="odsTeams_Selecting">
<SelectParameters>
<asp:Parameter Name="delegation_id" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>
<h1>
Additional Participants</h1>
<table>
<tr>
<td>
Category
</td>
<td>
Actual
</td>
<td>
Maximum
</td>
</tr>
<asp:Repeater ID="Repeater1" runat="server" DataSourceID="odsParticipantsCat">
<ItemTemplate>
<tr>
<td id='<%# Eval("participant_category_id") %>'>
<%# Eval("name") %>
</td>
<td id='txtPart<%# Eval("participant_category_id") %>'>
<asp:TextBox ID="txtPart" runat="server" Enabled='<%# getMax(Eval("key").ToString()) > 0 %>'></asp:TextBox>
<asp:RangeValidator EnableClientScript="true" ID="rgvPart" runat="server" ErrorMessage="*"
MinimumValue="0" MaximumValue='<%# getMax(Eval("key").ToString())%>' ControlToValidate="txtPart"></asp:RangeValidator>
</td>
<td id='lblPart<%# Eval("participant_category_id") %>'>
<asp:Label runat="server">
<%# getMax(Eval("key").ToString())%>
</asp:Label>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
<asp:ObjectDataSource ID="odsParticipantsCat" runat="server" OldValuesParameterFormatString="original_{0}"
SelectMethod="GetAdditionalParticipantCategories" TypeName="ERASTableAdapters.tbl_participant_categoryTableAdapter">
</asp:ObjectDataSource>
</table>
</div>
<h1>
Advance to be paid</h1>
<table>
<tr>
<td>
Number of participants
</td>
<td>
Days
</td>
<td>
Price
</td>
<td>
Total
</td>
</tr>
<tr>
<td runat="server" id="tdNumberPart1">
0
</td>
<td runat="server" id="tdDays1">
0
</td>
<td runat="server" id="tdPrice1">
0
</td>
<td runat="server" id="tdTotal1">
0
</td>
</tr>
<tr>
<td runat="server" id="tdNumberPart2">
0
</td>
<td>
N/A
</td>
<td runat="server" id="tdPrice2">
0
</td>
<td runat="server" id="tdTotal2">
0
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
<td>
</td>
<td runat="server" id="tdGrandTotal" style="font-weight: bold">
0
</td>
</tr>
</table>
<asp:Button runat="server" ID="btnConfirm" Text="Confirm" OnClick="btnConfirm_Click"
Style="height: 29px" />
<asp:Label runat="server" ID="lblInfo"></asp:Label>
Give your tables ids, eg <table id="students"> and <table id="additional">. Then, iterate the rows, find the input element in each row, and sum the values as you go:
function sumTable(id)
{
var count = 0;
var studentTable = document.getElementById(id);
for (var i=1; i in studentTable.rows; i++)
{
var r = studentTable.rows[i];
var input = r.getElementsByTagName("input")[0];
var n = parseFloat(input.value);
if (isFinite(n)) count += n;
}
return count;
}
var totalParticipants = sumTable("students") + sumTable("additional");
Using a library like jquery you can easily select all input boxes within a particular div (say your repeater div) or you can add a class specifically to those input boxes and grab them that way.
Attach the function call to the onblur method so that when they move away from the textboxes you can sum them up.

Categories