I am using javascript for customValidator to validate textboxes in ASP.Net.
The code works perfectly when I am using a normal page, but as soon as I put that inside a MasterPage, the code doesn't work.
Below is the code for my aspx page. If I put this code inside a MasterPage it doesn't work.
Could you guys advise me how to make this work inside a MasterPage
Thanks,
Abhi.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<script type="text/javascript">
function validateOrFields(source, args){
var sUser = document.getElementById('TextBox1');
if (sUser.value == "")
{
args.IsValid = false;
}
else
{
args.IsValid = true;
}
return;
}
<div>
<asp:TextBox ID="TextBox1"
runat="server"></asp:TextBox>
<asp:CustomValidator ID="FieldValidator"
runat="server"
Text="Enter either a user name"
ClientValidationFunction="validateOrFields" onservervalidate="FieldValidator_ServerValidate"/>
<asp:Button ID="Button1" runat="server" Text="Button" />
</div>
</form>
</body>
</html>
The problem is the ID of the TextBox. When placed in the Master Page, it gets a different ClientID.
var sUser = document.getElementById('<%= TextBox1.ClientID %>');
you need to get the id by using ClientID
Replace your code by
var sUser = document.getElementById('<%= TextBox1.ClientID %>');
Try document.getElementById('ct100_TextBox1').value. It is just a temporary fix!! But anyone please suggest how to get this ID dynamically using code. I got this by viewing source of the page generated. I have also posted the same question here
link text
Related
So just starting out with asp.net... I want to display my textbox when my checkbox is checked, but this doesn't seem to be working. I also tried with the visible property, but that didn't work either. What am I doing wrong exactly?
Code:
protected void checked_CheckedChanged(object sender, EventArgs e)
{
text.Style["display"] = "block";
}
Layout:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<p>gehuwd/samenwonend<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged"></asp:checkbox>
</p>
<asp:TextBox runat="server" ID="text" style="display:none"></asp:TextBox>
</form>
</body>
</html>
Use the AutoPostBack property for checkbox and set it to true:
<asp:checkbox runat="server" ID="checked" OnCheckedChanged="checked_CheckedChanged" AutoPostBack="true"></asp:checkbox>
You can use add css property of textbox in c# as given below. If your checkbox OnCheckedChanged is not working then you can set property AutoPostBack is true in checkbox.
protected void checked_CheckedChanged(object sender, EventArgs e)
{
text.Attributes.Add("display","block");
}
You can also do this completely client side, using jQuery or javascript.Making a post back to the server everytime you need to change the visual appearance of your HTML can put unnecessary strain on the server and have a negative effect on the user experience by slowing down the overall performance of your site.
<head runat="server">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var id = "<%: text.ClientID %>";
id = "#" + id;
$(id).hide();
$("#chkShowHide").change(function () {
if (this.checked) {
$(id).show();
}
else{
$(id).hide();
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="chkShowHide" type="checkbox" /> Show\Hide<br />
<asp:TextBox runat="server" ID="text"></asp:TextBox>
</form>
</body>
I have a checkbox, label and button control.
If the checkbox is not checked and button is clicked, I need to display a message in label stating to check the checkbox first.
If the checkbox is checked and then the button clicked, it should allow me to proceed.
This is very similar to the terms and conditions screens,where if you dont check the checkbox - you are not allowed to proceed.
I am using the below javascript. Please let me know how do I accomplish this functionality?
<script type="text/javascript">
function testCheckbox() {
var obj = document.getElementById('<%= chkTerms.ClientID %>');
if (obj.checked == false) {
document.getElementById("lblCheck").style.visibility = "visible";
return false;
}
}
</script>
<asp:Label ID="lblTerms" runat="server" Text="I agree to the Terms and Conditions"> </asp:Label>
<asp:Label ID="lblCheck" runat="server" Text="Please agree to the terms and conditions to proceed"></asp:Label>
<asp:Button ID="btnProceed" runat="server" OnClientClick ="return testCheckbox()" OnClick="btnProceed_Click" Text="Submit" />
ASPX:
<%# 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>
<script src="js/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#lblCheck').hide();
$('#btnProceed').click(function () {
var $this = $('#chkTerms')
if ($this.is(':checked')) {
$('#lblCheck').hide();
return true;
} else {
$('#lblCheck').show();
return false;
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:CheckBox ID="chkTerms" runat="server" Text="I agree to the Terms and Conditions"/><br />
<asp:Label ID="lblCheck" runat="server" Text="Please agree to the terms and conditions to proceed"/><br />
<asp:Button ID="btnProceed" runat="server" Text="Submit" onclick="btnProceed_Click1" />
</form>
</body>
</html>
Code behind:
protected void btnProceed_Click1(object sender, EventArgs e)
{
Response.Write("DD");
//your proceed
}
I have done searches for this but could not find an answer that worked.
I am trying to access the asp:TextBox ID="wordList" node details and its keep return count = 0. I have tried two alternate methods as can be seen below in the javascript and do not understand why its not working. Can anyone see the reason?
Many Thanks
Jaie
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Week3.WebForm1" Theme="Theme1"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Grid Details</title>
</head>
<body>
<script lang="javascript" type="text/javascript" >
function ValidateWordList() {
var x = document.getElementById("wordList").innerHTML;
x += "Length" + x.length;
alert(x);
var z = document.getElementById('<%= wordList.ClientID %>').innerHTML;
alert(z);
return false;
}
</script>
<form id="form1" runat="server">
<div class="form1Box">
<br />
<asp:Label ID="lblWord" runat="server" Text="Word(s) of Puzzle:"><asp:TextBox ID="wordList" runat="server" ClientIDMode="Static"/></asp:Label>
<asp:RequiredFieldValidator ID="RequiredFieldValidatorWordList" ControlToValidate="wordList"
CssClass="Validation" runat="server" Text="(Required)" />
<asp:RegularExpressionValidator ID="RegularExpressionValidatorWordList" ControlToValidate="wordList" runat="server" CssClass="Validation"
ValidationExpression="(^[a-zA-Z ,]*$)" ErrorMessage="(The word(s) can only be letters, space or comma's!)"/>
<asp:Button ID="btnSubmit" OnClick="btnSubmit_Click" Text="Generate Puzzle" runat="server" OnClientClick="return ValidateWordList()"/>
</div>
</form>
</body>
</html>
Are you trying to retrieve whatever value user has entered in the textbox? If so, you are probably looking for:
var x = document.getElementById("wordList").value;
Text fields do not define any inner markup, and their property innerHtml in most cases is just an empty string.
I have a dropDownlist in my project and i am adding items to it in javascript. Now i want to get selected index in C# (on a button click event). But i am unable to do this because it seems to be a problem that viewstate is not maintained.
Further more i have
EnableEventValidation="false"
in my Page
Please tell me how can i achieve this functionality? Right Now i am adding selected values in a hidden field and then accessing that hidden field in C#. Its working but i want "cleanliness".
Regards
When ASP.NET performs a form POST the drop down options need to be passed through to the server and be recreated there for further processing.This is achieved through ViewState.
I'm not aware of any other way of doing this, what you can do however is retrieve the selected value of the drop down using Request.Form[ddlProducts.UniqueID] if you can figure out the item index based on the selected value, great! Else I think hidden fields are your only option
Here's a complete example:
<head runat="server">
<title></title>
<script type="text/javascript">
window.onload = function () {
var select = document.getElementById("ddlProducts");
select.options[select.options.length] = new Option('Product 1', 'Value 1');
select.options[select.options.length] = new Option('Product 2', 'Value 2');
select.options[select.options.length] = new Option('Product 3', 'Value 3');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="ddlProducts" runat="server">
</asp:DropDownList>
<asp:Button ID="btnOK" runat="server" Text="OK" OnClick="Process" /> <span id="output"
runat="server" />
</div>
</form>
</body>
</html>
protected void Process(object sender, EventArgs e)
{
int selectedIndex = ddlProducts.SelectedIndex;
output.InnerHtml = Request.Form[ddlProducts.UniqueID];
}
I have one dropdownlist in my asp.net web application. I want to set visibility for that dropdownlist in the Client side javascript such as visible=true or false. Can any one know solution for that means it will really appreciated.
Thank you..
Use jquery .show() and .hide() methods. You will need to find the dropdownlist using the clientid value like so:
$('#<%= myDropDown.ClientID %>').show() // shows dropdown
$('#<%= myDropDown.ClientID %>').hide() // hides dropdown
This is a sample with Javascript alone:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript">
function doToggle() {
var ddl = document.getElementById("<%Response.Write(DropDownList1.ClientID.ToString()); %>");
if (ddl.style.display == "none") {
ddl.style.display = "block";
}
else {
ddl.style.display = "none";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="DropDownList1" runat="server">
</asp:DropDownList>
<input id="Button1" onclick="doToggle();" type="button" value="Toggle" />
</div>
</form>
</body>
</html>
Good luck!