I want to have an alert confirmation box and display the price for the user to see, however, the alert is not coming not, not sure where I went wrong. Please help
This is the method i tried.
This is the javascript
<script>
function showCFMRenewPlan() {
var renewedPlanPrice = document.getElementById("renewedPlanPrice_HD");
return confirm('Do you want to renew your plan for $' + renewedPlanPrice.innerHTML);
}
</script>
This is my button and the hiddenfield im displaying the price.
<asp:HiddenField runat="server" ID="renewedPlanPrice_HD" />
<asp:Button class="btn-primary btn-md" Font-Size="Medium" runat="server" ID="renewPlanButton" CausesValidation="false" OnClientClick="showCFMRenewPlan()" OnClick="renewPlanButton_Click1" Text="Renew Plan" />
in c# backend i added this to set the value of my hidden field
renewedPlanPrice_HD.Value = Convert.ToString(planPrice);
Related
I have few textboxes and asp.net validation controls on a page. The validation fires when I click on "Submit" button. Is there anyway to fire the validation as soon as I leave the textbox? I would like to do the same validation for other 20+ fields in the form. However, only validating specific textbox when leaving it.
<asp:TextBox ID="txtclass" runat="server"></asp:TextBox>
<asp:RangeValidator ID="rvclass"
runat="server" ControlToValidate="txtclass"
ErrorMessage="Enter your class (6 - 12)" MaximumValue="12"
MinimumValue="6" Type="Integer">
</asp:RangeValidator>
<asp:Button ID="btnsubmit" runat="server" onclick="btnSubmit_Click" Text="Submit" />
Create a js function to perform the validating, then for each textbox you want to validate set the onblur and call that function. (I'm just free writing below so excuse the syntax error but you should get the gist)
function validateClass(val)
{
if(val.value > 5 && val.value < 13)
{
//alert(good!)
}
else
{
//alert(show error?)
}
}
call it in your textbox
<asp:TextBox ID="txtclass" runat="server" onblur="validateClass(this);"></asp:TextBox>
I know it has been asked several times and I found many solutions but no solution worked for me.
I am working on IE
<asp:RadioButtonList ID="rbtnView" runat="server" OnSelectedIndexChanged="rbtnView_SelectedIndexChanged"
AutoPostBack="True" TabIndex="7" RepeatDirection="Horizontal">
<asp:ListItem Selected="True" Value="0">Show Pending</asp:ListItem>
<asp:ListItem Value="1">Show Processed</asp:ListItem>
</asp:RadioButtonList>
here is the button code from where I am calling the function:
<asp:Button ID="btnPrint" runat="server" CssClass="myButton" OnClick="btnPrint_Click"
Text="Print" ValidationGroup="validationgroup2" TabIndex="9" OnClientClick="doPrint()" />
here is the javascrit function
function doPrint() {
debugger;
var rad = $('#<%=rbtnView.ClientID %> input[type=radio]:checked').val();
}
Any help would be appreciated.
var radioValue = $("input[name='YOURVALUEFORTHEGROUP']:checked").val();
replace YOURVALUEFORTHEGROUP
The javascript function works just fine. But you are doing a form post (PostBack) when pressing the btnPrint button.
You can use a regular button instead of an asp.net Control. Or if you need a PostBack to execute the btnPrint_Click method. But then you can get the value there. It all depends why you need the value client side.
<input type="button" value="Get value" onclick="doPrint()" />
Or add return false to the aspnet button.
OnClientClick="doPrint(); return false;"
I have an ASP.NET 4.5 web form with inputs for a physical and mailing address. After entering a physical address, a user can tick a checkbox to fill in the mailing address if the information is the same.
This occurs via an OnClick function tied to the checkbox, which basically does this (I left out additional code):
document.getElementById("<%= txtMailAddressStreetNumber.ClientID%>").value = document.getElementById("<%= txtPermAddressStreetNumber.ClientID%>").value;
Each of the address textboxes has a RequiredFieldValidator. When I submit the form, it passes client-side validation and posts back to the server. There it fails (Page.IsValid is false). The textboxes that were populated by the OnClick function fail server-side validation unless I manually populate them.
I've tried calling Page_ClientValidate('FormGroup'); (FormGroup is the name of the validation group) after assigning values, and doing this doesn't trigger any validation error messages for the textboxes. However, when I submit the form (postback), the values inserted via Javascript are all cleared and I have to manually enter them.
Code in the .aspx page:
<asp:Label CssClass="mainlabel" ID="lblPermAddressZipCode" runat="server" Text="Zip Code" AssociatedControlID="txtPermAddressZipCode" />
<asp:RequiredFieldValidator ControlToValidate="txtPermAddressZipCode" ID="RequiredFieldValidator10" runat="server" ErrorMessage="*" Display="Dynamic" ValidationGroup="FormGroup" CssClass="formerror" />
<asp:TextBox ID="txtPermAddressZipCode" Width="100" onclick="openDialog(1)" ReadOnly="true" CssClass="readOnlyTextBox" runat="server" />
<asp:CheckBox ID="cbPermIsMailAddress" onclick="UsePermanentAsMailingAddress()" runat="server" /><small>(same as above)</small>
<asp:Label CssClass="mainlabel" ID="lblMailAddressZipCode" runat="server" Text="Zip code" AssociatedControlID="txtMailAddressZipCode" />
<asp:RequiredFieldValidator ControlToValidate="txtMailAddressZipCode" ID="RequiredFieldValidator15" runat="server" ErrorMessage="*" Display="Dynamic" ValidationGroup="FormGroup" CssClass="formerror" />
<asp:TextBox ID="txtMailAddressZipCode" ReadOnly="true" onclick="openDialog(2)" CssClass="readOnlyTextBox" Width="100" runat="server" />
Javascript:
function UsePermanentAsMailingAddress() {
//only copy if the address is complete
if (document.getElementById("<%= permCityStateZipId.ClientID %>").value != '') {
//exit if the box was unchecked
if (!$("#<%= cbPermIsMailAddress.ClientID%>").is(':checked')) {
return;
}
document.getElementById("<%= txtMailAddressZipCode.ClientID%>").value = document.getElementById("<%= txtPermAddressZipCode.ClientID%>").value;
//the ID value is the answer
document.getElementById("<%= mailCityStateZipId.ClientID%>").value = document.getElementById("<%= permCityStateZipId.ClientID %>").value;
//Page_ClientValidate('FormGroup');
}
else {
$("#<%= cbPermIsMailAddress.ClientID%>").removeAttr('checked');
alert("Please enter a complete permanent address first.");
}
}
Since the ReadOnly property is set in the .aspx, any changes made to it client-side will be ignored when it's posted back. If you absolutely need to have the textboxes read-only, then remove the property from your .aspx and set it with JavaScript on page load:
$(document).ready(function () {
$('#<%= txtMailAddressZipCode.ClientID%>').prop('readonly', true);
});
This way the user won't be able to directly change the textbox (I assume you have some other way of filling the textbox), but any changes will be posted back rather than the original (empty) values.
I have a button:
<asp:Button Text="Reset" runat="server" ID="ResetButton" OnClientClick="ResetClick()"/>
that runs the following JavaScript function when it gets clicked:
function ResetClick() {
document.getElementById("<%=lblError.ClientId%>").innerHTML = "";
}
That changes the text on this label:
<asp:Label ID="lblError" runat="server" Style="color: Red;" Text=""></asp:Label>
Unfortunately, my code behind also changes the label text to an error message using the following code:
lblError.Text = "No data is available"
When I click the reset button, the text is momentarily cleared and then it fills again with the error message. Is there any way to have the code behind set a message in the label and let the JavaScript clear the message?
If you do not want the button to post back then you should add return false; to the OnClientClick attribute:
<asp:Button Text="Reset" runat="server" ID="ResetButton" OnClientClick="ResetClick(); return false;"/>
PS: adding as an answer since it sounds like it was helpful.
I have a GridView in this GridView there is a column which I use to select date with the use of asp:CalendarExtender. I have multiple rows in GridView which are dynamically generated.
When I click the image button calender pops up and I choose my date.
In some rows I want the User to select date when he clicks image button of that row. sometime I don't want to allow him to select date.
When he tries to change the date or click on the image button, he should get alert message saying that you are not allowed to change the date.
I want to handle it from client side. So please suggest me how to do this.
this is the aspx code.
<asp:TextBox runat="server" ID="StartDateTime" CssClass="search_area_text_vm_small" onclick = "javascript:DateClick(this.id);"></asp:TextBox>
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/image3.jpg" />
<asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="StartDateTime" PopupButtonID="Image1" Format="yyyy-MM-dd" ></asp:CalendarExtender>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="StartDateTime"
ErrorMessage="*" SetFocusOnError="True"></asp:RequiredFieldValidator>
You can make use of the OnClientDateSelectionChanged event of the CalendarExtender.
Use below code:
<asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="StartDateTime" PopupButtonID="Image1" Format="yyyy-MM-dd" OnClientDateSelectionChanged="checkIfDateSelected()" >
</asp:CalendarExtender>
<javascript>
function checkIfDateSelected(){
var dateTextBox=document.getElementByid('StartDateTime');
if(dateTextBox!='')
{
alert ('Date once selected cannot be changed');
return false;
}
</javascript>
This will show the info pop up and prevent the form submission if the date has been selected already.