I have some code inside of an asp:UpdatePanel that after clicking a button. it'll will hide a Label and replace that with an editable Textbox. This functionality all works fine within the UpdatePanel, however after clicking this button to make the call (which is also inside of the UpdatePanel), it causes asp:LinkButtons that appear after and outside of the UpdatePanel not to work anymore. These links work prior to interacting with controls inside of the UpdatePanel, but stop working after the fact. It's worth noting that these linkbuttons are dynamically created and appended to an existing div that follows and is not inside the UpdatePanel causing this issue. For good measure I tried calling the method that dynamically creates and appends these controls whenever the update panel made a callback to the server, but to no avail.
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<label class="reportModeLabel">Primary Mode: </label>
<div id="divShowMode" runat="server" class="inlineItem">
<asp:Label ID="lblPrimaryMode" runat="server"></asp:Label>
<asp:LinkButton ID="lnkPrimaryMode" runat="server" CssClass="clickOnce" OnClick="lnkPrimaryMode_Click">
<asp:Image ID="imgChangePrimaryMode" runat="server" CssClass="imgReportUpdateMenuItem" ImageUrl="~/Images/Edit.png" />
</asp:LinkButton>
</div>
<div id="divUpdateMode" runat="server" class="inlineItem" >
<asp:DropdownList ID="ddlModeOfTransmission" runat="server" Width="40%" CssClass="metaItemDropdown">
<asp:ListItem Text="Food" Value="1"></asp:ListItem>
<asp:ListItem Text="Water" Value="2"></asp:ListItem>
<asp:ListItem Text="Animal" Value="3"></asp:ListItem>
<asp:ListItem Text="Person to Person" Value="4"></asp:ListItem>
<asp:ListItem Text="Environmental" Value="5"></asp:ListItem>
<asp:ListItem Text="Other/Unknown" Value="6"></asp:ListItem>
</asp:DropdownList>
<asp:LinkButton ID="lnkPrimaryModeSave" runat="server" CssClass="clickOnce" OnClick="lnkPrimaryModeSave_Click">
<asp:Image ID="imgPrimaryModeSave" runat="server" ImageUrl="~/Images/Check-Selected.png" />
</asp:LinkButton>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="divWizardMenu">
//The link button controls that no longer work after using the
//UpdatePanel are dynamically created on server and added here
<ul id="ulMainMenu" runat="server"/>
</div>
//UpdatePanel ajax calls
protected void lnkPrimaryMode_Click(object sender, EventArgs e)
{
divShowMode.Visible = false;
divUpdateMode.Visible = true;
ddlModeOfTransmission.SelectedValue = Record.PrimaryModeOfTransmissionID.ToString();
}
protected void lnkPrimaryModeSave_Click(object sender, EventArgs e)
{
divUpdateMode.Visible = false;
divShowMode.Visible = true;
}
Are you assigning your dynamically created LinkButtons an ID when you create them?
I think they will need the ID to be set so that Events can be rewired up on Postback.
Related
I tryed trigger the TextChange event with ajax but it dosnt realy work how i do it. Hope you guys can help me.
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:ScriptManager ID="ScriptManager1" runat="server" AsyncPostBackTimeout="0">
</asp:ScriptManager>
<asp:TextBox ID="TextBox1" runat="server" AutoCompleteType="Disabled" AutoPostBack="True" OnTextChanged="TextBox1_TextChanged"></asp:TextBox>
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="TextBox1" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
The ScriptManager should appear before the UpdatPanel, not inside of it. And you don't need to define TextBox1 as a trigger. The TextBox being inside the UpdatePanel and the property ChildrenAsTriggers being true by default, the panel will be updated when TextBox1 loses focus after its content has been modified.
UPDATE
I originally misread the question. The following posts describes a method to trigger a postback and refresh the UpdatPanel every time a key is pressed in the TextBox: How do I make a Textbox Postback on KeyUp?.
I would like to know if it is possible to do requiredfieldvalidator purely in javascript.
I do not want my button click which processes the page to perform a postback, as postback completely resets my styling and there is too much to reload on ispostback.
I will however do the postback to the server to update SQL once all the fields have been completed.
<asp:UpdatePanel id="PurGradeUpdate" runat="server" RenderMode="Inline">
<ContentTemplate>
<telerik:RadComboBox ID="PURGrade" runat="server" Width="100" EmptyMessage=" ---" Font-Bold="true"></telerik:RadComboBox>
<asp:RequiredFieldValidator ID="PurGradeValidate" runat="server" Display="Dynamic" ControlToValidate="PURGrade" ErrorMessage="!!!" Font-Italic="true" Font-Bold="true" ForeColor="Red" InitialValue=" ---" EnableClientScript="true"></asp:RequiredFieldValidator>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="PURProduct" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
<telerik:RadButton ID="PurCreate" runat="server" AutoPostBack="false" OnClientClicked="PerformValidation"></telerik:RadButton>
I have the above in an update panel as the comboboxes are populated via SQL read, based on other comboboxes selected index changes.
I would now like to call that "PerformValidation" on my process button click and here the validation must happen, and if not valid, display the errormessage.
Thanks for the assistance.
Ok man i checked it on my VS and this works for sure:
<asp:UpdatePanel id="PurGradeUpdate" runat="server" RenderMode="Inline">
<ContentTemplate>
<asp:DropDownList ID="PURGrade" runat="server" Width="100" Font-Bold="true"></asp:DropDownList>
<asp:RequiredFieldValidator ID="PurGradeValidate" runat="server" Display="Dynamic" ControlToValidate="PURGrade" ErrorMessage="!!!" Font-Italic="true" Font-Bold="true" ForeColor="Red" InitialValue="---" EnableClientScript="true"></asp:RequiredFieldValidator>
<asp:DropDownList ID="PURProduct" runat="server" Width="100" Font-Bold="true"></asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="PURProduct" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>
<Asp:Button ID="PurCreate" runat="server" AutoPostBack="true"></Asp:Button>
In aspx.cs file I added default value:
PURGrade.Items.Insert(0, "---");
So as i told you before you don't need to use custom JavaScript commands to validate on client side cuz asp required field validator runs on client side by default. The only think that can cause problems in your code is custom controls you use. Be sure that your combo box empty value is what is really added to the select list as a default value.
I have a page with an editable field and several required fields. The problem is that whenever I click on a button to activate the editable field for making changes, or when applying/cancelling those changes, it causes my Javascript to fire again which appends yet another "required field" indicator to my required fields. I want the indicator to ONLY be appended on the first load, and not to be affected by buttons clicked on the interface. How can I accomplish this? I believe I just need the right condition for my Javascript "if" statement, but have no idea what that might be. I've researched it and come up dry.
Here's my markup. You can safely ignore entire UpdatePanel region. The only thing you need to know, is that the buttons within it are causing the Javascript to run again for each click.
Thanks! ;)
<asp:Content runat="server" ContentPlaceHolderID="HeadContent">
<script type="text/javascript">
function contentPageLoad() {
// Add "Required Field" Indicators
if (/*NEED CONDITION*/) {
$("h4.required").append(" <span class=\"r\">*</span>");
}
}
</script>
</asp:Content>
<asp:Content runat="server" ContentPlaceHolderID="MainContent">
<!-- This is an updatable textfield. -->
<!-- PROBLEM!: LinkButtons here cause the double firing of the javascript above. -->
<!-- Remember that "ChildrenAsTriggers" defaults to True for UpdatePanel. -->
<asp:UpdatePanel ID="RequestorNameUpdatePanel" runat="server">
<ContentTemplate>
<asp:MultiView ID="RequestorName_mv" runat="server" ActiveViewIndex="0">
<asp:View ID="RequestorNameNormalView" runat="server">
<div class="rightCol">
<asp:LinkButton ID="editRequestorName" runat="server" />
<h6 class="inlineH">Requestor's Name: <asp:Label ID="RequestorName_lbl" runat="server"></asp:Label></h6>
</div>
</asp:View>
<asp:View ID="RequestorNameEditView" runat="server">
<div class="rightCol">
<asp:LinkButton ID="updateRequestorName" runat="server" />
<asp:LinkButton ID="cancelRequestorName" runat="server" />
<h6 class="inlineH">Requestor's Name: </h6>
<asp:DropDownList ID="RequestorName_ddl" runat="server" ViewStateMode="Inherit" AutoPostBack="False" ></asp:DropDownList>
<asp:TextBox ID="RequestorName_cb" runat="server" EnableViewState="True" AutoPostBack="False"></asp:TextBox>
<button id="RequestorName_btn" type="button" class="toggle ui-button"></button>
</div>
</asp:View>
</asp:MultiView>
</ContentTemplate>
</asp:UpdatePanel>
<!-- "REQUIRED" indicator from javascript appended here -->
<h4 class="required">First Name</h4>
<asp:TextBox ID="tbFirstName" runat="server"></asp:TextBox>
</asp:Content>
Put this code on document ready.
$(document).ready(function() {
$("h4.required").append(" <span class=\"r\">*</span>");
});
Then it will not be called when your update panels load.
I need to call a javasript function when a button is clicked in my GridView. Is it possible to do this, and if so does somebody have an example?
<asp:TemplateField>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="javascript:alert('hello');" />
</asp:TemplateField>
I wanted to create a pop-up with option buttons and textbox..
check my codes..
<form id="frmInsuranceCarrier" runat="server">
<div>Enter a New Insurance Carrier Code</div>
<div>
<asp:RadioButton ID="optAutoAssign" runat="server" />
Auto Assign</div>
<div>
<asp:RadioButton ID="optManual" runat="server" />
Manual</div>
<div>
<asp:TextBox ID="txtManual" runat="server"></asp:TextBox>
</div>
<asp:Button ID="cmdOk" runat="server" Text="Ok" onclick="cmdOk_Click" />
<asp:Button ID="cmdCancel" runat="server" Text="Cancel"
onclick=
"cmdCancel_Click" />
there's not much code here in dealing with a popup : )
Do you want an ajax modal popup? in that case check out:
http://www.asp.net/ajax/ajaxcontroltoolkit/samples/modalpopup/modalpopup.aspx
Jquery model is a good choice.
How to use jquery dialog in asp.net
jQuery UI Dialog
you can use the RegisterStartupScript
to execute every javascript/jQuery Code Serverside
public void AnyButton_Click(Object sender, EventArgs e)
{
string script = "$('#theid').dialog('open');";
ClientScript.RegisterStartupScript(GetType(), "popup", script, true);
}