I am getting the following javascript error when changing the value in the dropdownlist. The error only occurs when using IE8, it works fine in IE6 and IE7. The error is: 'value' is null or not an object
Here is the code.
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
<table cellpadding="3" cellspacing="1">
<tr>
<td style="text-align: right">* Who is reporting the issue:</td>
<td>
<asp:DropDownList ID="ddlWhoReportedIssue" runat="server"
CausesValidation="false">
<asp:ListItem></asp:ListItem>
<asp:ListItem>Self</asp:ListItem>
<asp:ListItem>Agent's Office</asp:ListItem>
<asp:ListItem>Other Employee In Dept.</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
<tr id = "Row1" style="display:none">
<td style="text-align: right">* State Agent Code:</td>
<td>
<asp:TextBox ID="txtStateAgentCode" runat="server" Columns="20" MaxLength="50"></asp:TextBox>
</td>
</tr>
<tr id = "Row2" style="display:none">
<td style="text-align: right">* Name of Caller:</td>
<td>
<asp:TextBox ID="txtNameOfCaller" runat="server"></asp:TextBox>
</td>
</tr>
<tr id = "Row3" style="display:none">
<td style="text-align: right">* Name & Alias of Other Employee:</td>
<td>
<asp:TextBox ID="txtNameAndAlias" runat="server" Columns="30" MaxLength="50"></asp:TextBox>
</td>
</tr>
</table>
<script type="text/javascript">
function fcnShowHide1() {
if (aspnetForm.ctl00_ContentPlaceHolder2_ddlWhoReportedIssue.value == "Self") {
document.all.Row1.style.display = "none"
document.all.Row2.style.display = "none"
document.all.Row3.style.display = "none"
} else if (aspnetForm.ct100_ContentPlaceHolder2_ddlWhoReportedIssue.value == "Agent's Office") {
document.all.Row1.style.display = ""
document.all.Row2.style.display = ""
document.all.Row3.style.display = "none"
} else if (aspnetForm.ct100_ContentPlaceHolder2_ddlWhoReportedIssue.value == "Other Employee In Dept.") {
document.all.Row1.style.display = "none"
document.all.Row2.style.display = "none"
document.all.Row3.style.display = ""
}
}
</script>
</asp:Content>
Change the function to this:
function fcnShowHide1() {
var oDDL = document.getElementById("<%=ddlWhoReportedIssue.ClientID%>");
var sValue = oDDL.value;
if (sValue == "Self") {
document.getElementById("Row1").style.display = "none";
document.getElementById("Row2").style.display = "none";
document.getElementById("Row3").style.display = "none";
} else if (sValue == "Agent's Office") {
document.getElementById("Row1").style.display = "";
document.getElementById("Row2").style.display = "";
document.getElementById("Row3").style.display = "none";
} else if (sValue == "Other Employee In Dept.") {
document.getElementById("Row1").style.display = "none";
document.getElementById("Row2").style.display = "none";
document.getElementById("Row3").style.display = "";
}
}
Hard coding the dynamically generated ID is really bad idea - get the real ID using ClientID.
Plus document.all is even worse, use document.getElementById instead.
Related
i am having trouble in finding the problem. I was inserting product record via ado.net and it worked fine. Now i tried ajax for doing it in a more better way . but i am having trouble since the code never runs the function intended to run when i click button via ajax. so need ur help. Thanks. here is the code:
//this is my home.aspx page
$(document).ready(function () {
$("#submit").click(function () {
alert("you clicked");
$.ajax({
type: "POST",
contentType: "application/json",
url: "home.aspx/insert",
dataType: "json",
// data: "{'Name':'" + document.getElementById('name').value + "'}",
data:"{}",
//async: false,
success: function (response) {
alert("User has been added successfully.");
window.location.reload();
}
});
})
});
</script>
//////////////////////////////////
<form id="form1" runat="server">
<div>
<table>
<tr>
<td><label>Product Name</label></td>
<td> <asp:TextBox runat="server" id="name"></asp:TextBox></td>
</tr>
<tr>
<td><label>Product Code</label></td>
<td><asp:TextBox runat="server" id="code"></asp:TextBox></td>
</tr>
<tr>
<td><label>Product Category</label></td>
<td><asp:DropDownList ID="DropDownList1" runat="server">
<asp:ListItem>Gadgets</asp:ListItem>
<asp:ListItem>Vehicles</asp:ListItem>
<asp:ListItem>Garments</asp:ListItem>
<asp:ListItem>Eatables</asp:ListItem>
<asp:ListItem>Furniture</asp:ListItem>
</asp:DropDownList></td>
</tr>
<tr>
<td><label>Expiry date</label></td>
<td><asp:TextBox runat="server" TextMode="Date" id="dt"></asp:TextBox></td>
</tr>
<tr>
<td><label>Product price</label></td>
<td><asp:TextBox runat="server" id="price"></asp:TextBox></td>
</tr>
<tr>
<td><label>Product Image</label></td>
<td> <asp:FileUpload ID="file_image" runat="server" /></td>
<td> </td>
<td><asp:Label runat="server" id="showtext"></asp:Label></td>
</tr>
<tr></tr>
<tr></tr>
<tr>
<td></td>
<%--<asp:Button runat="server" OnClick="submit" Text="Submit" BackColor="White" Width="100px" />--%>
<td> <input type="button" style=" width:100px;" value="Submit" id="submit" /> </td>
</tr>
</table>
</div>
<asp:Label ID="res" runat="server"></asp:Label>
</form>
///////////////////////////////////////////////
//this is my home.aspx.cs page :
public void insert()
{
if (file_image.HasFile)
{
string ext = System.IO.Path.GetExtension(file_image.FileName);
if (!ext.Equals(".jpg"))
{
showtext.Text = "Please select correct file format i.e jpg or jpeg";
showtext.ForeColor = System.Drawing.Color.Purple;
}
else
{
file_image.SaveAs(Server.MapPath("~/Uploads/" + file_image.FileName));
showtext.Text = "File uploaded";
showtext.ForeColor = System.Drawing.Color.Green;
productclass pc = new productclass();
pc.Pr_name = name.Text;
pc.Code = code.Text;
pc.Category = DropDownList1.SelectedValue;
pc.Expiry = Convert.ToDateTime(dt.Text);
pc.Price = Convert.ToInt32(price.Text);
pc.Pr_image = file_image.FileName;
dalinsert di = new dalinsert();
bool flag = di.insert(pc);
if (flag.Equals(true))
{
res.Text = "data inserted";
//Thread.Sleep(10000);
// Response.Redirect("home.aspx");
}
else
{
res.Text = "issue in inserting data";
}
}
}
else
{
showtext.Text = "Please select file";
showtext.ForeColor = System.Drawing.Color.Red;
}
}
Ive got an issue where the MaxLength field doesnt seem to adhere to the value being set in code-behind.
MaxLength='<%#Convert.ToInt32(Eval("AdditionalOptionInfo.MaxFieldLength"))%>'
If I set the MaxLength="10" for example it seems to work fine.
EDIT: Whole code
<asp:Repeater ID="rptList" runat="server">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li>
<div class="asdf">
<asp:LinkButton ID="adsf" CssClass="asdf" CommandArgument='<%#Eval("OptionAvailable")%>' runat="server" OnDataBinding="lnkList_OnDataBinding" OnClientClick="contactDetailOptionClick(this); return false;">
<%#Eval("DisplayText")%>
<table class="tbox" runat="server" visible='<%#Eval("IsAdditionalInfoApplicable")%>'>
<tbody>
<tr>
<td>
<asp:Label runat="server" CssClass="asdf" Text='<%#Eval("AdditionalOptionInfo.InstructionText")%>' />
<br />
<asp:TextBox placeholder='<%#Eval("AdditionalOptionInfo.PlaceHolderText")%>' RetainValueAfterPostback="true" ellipsis="true" AutoComplete="Off" runat="server" MaxLength='<%#Convert.ToInt32(Eval("AdditionalOptionInfo.MaxFieldLength"))%>' />
</td>
</tr>
</tbody>
</table>
</asp:LinkButton>
</div>
</li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
My implementation after Andrew's suggestion:
public int GetMaxLength(object additionalOptionInfo)
{
var option = additionalOptionInfo as TypeXYZ<string>;
return option != null ? option.MaxFieldLength : 0;
}
The max lenth eval is still going to be hit if the parent table's visibility is false because all this code is sitting on the front end.
I'd do something like this:
MaxLength='<%# GetMaxLength(Eval("AdditionalOptionInfo.MaxFieldLength"))%>'
public string GetMaxLength(object optionInfo)
{
TypeOfOptionInfo option = (TypeOfOptionInfo) optionInfo;
if (option != null)
{
return optionInfo.MaxFieldLength;
}
else
{
return "0";
}
}
I have a repeater. And i want to hide and display a particular column for a particular condition. I have three types of subjects and their ids are 0,1,2 respectively. Now i want to show that particular column when the subject will be 2 only..
My code is :-
<table id="table1" class="yui" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>
EmpID #
</th>
<th>Edit</th>
</tr>
</thead>
<tbody>
<asp:Repeater ID="Repaddressorbbl" runat="server" OnItemCommand="Repaddressorbbl_ItemCommand">
<ItemTemplate>
<tr id="gh" style="cursor: pointer" onclick="Select(this);">
<td style="text-align: center;">
<%#Eval("empid")%>
</td>
<td>
<asp:LinkButton ID="lknumber" runat="server" Text="Edit" CommandName="subjectid" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
<tfoot>
</tfoot>
</table>
You could catch the OnItemDataBound event of the repeater and hide the column there if the (subject) item id is 2.
In order you can get a reference to the column, make it a server control:
<td style="text-align: center;" id="COL_TO_HIDE" runat="server"><%#Eval("empid")%></td>
Then in the repeater event you can simply look for the control and hide it:
protected void YourRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
var subject = (Subject)e.Item.DataItem;
if (subject.Id == 2)
{
var col = e.Item.FindControl("COL_TO_HIDE");
col.Visible = false;
}
}
}
Please note, this is just a simplified example which should you get started.
I think you should start by using <HeaderTemplate></HeaderTemplate> and <FooterTemplate></FooterTemplate> to define the start and end of your table just to tidy it up.
You can get the table to run on the server by adding a runat="server" and give the column <td> an id and a runat="server" attribute so you can program server code against it. I'd then eval bind the visible attribute of the cell based on your field value or use attributes.add("display:none") or just use a grid view as suggested in the link.
<asp:Repeater ID="Repaddressorbbl" runat="server"
OnItemCommand="Repaddressorbbl_ItemCommand">
<ItemTemplate>
<tr id="gh" style="cursor: pointer" onclick="Select(this);">
<td style="text-align: center;">
<%#Eval("empid")%>
</td>
<% if (false){ %>
<td>
<asp:LinkButton ID="lknumber" runat="server"
Text="Edit" CommandName="subjectid" />
</td>
<% } %>
</tr>
</ItemTemplate>
</asp:Repeater>
I have a master page and based on that master page I created a page with a TextBox and two Validation controls for RequiredValidator and RegularExpressionValidator and one ValidationSummary.
when pressing the enter key in TextBox, I expected that both validator show their errorMessage on validationSummary but thats not what happening it only works when I press the button on page.
According to this page I wrapped my code with <asp:panel> and a DefaultButton attribute but it didn't solve the problem.
http://www.codeproject.com/KB/aspnet/aspnet_Enter_key_problem.aspx
I want to know what the problem here is and whether there is any workaround?
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
**<asp:Panel runat="server" DefaultButton="EmailSend">**
<table style="width: 100%">
<tr>
<asp:ValidationSummary ID="EmailValidation" runat="server" CssClass="failureNotification"
ValidationGroup="EmailValidation" />
</tr>
<tr>
<td style="width: 76px">
Email:
</td>
<td class="style1">
<asp:TextBox ID="EmailForget" runat="server" Width="244px"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidator ID="EmailRequiered" runat="server" ControlToValidate="EmailForget"
CssClass="failureNotification" ErrorMessage="RequiredFieldValidator" ValidationGroup="EmailValidation">*</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="EmailRegular" runat="server" ControlToValidate="EmailForget"
CssClass="failureNotification" ErrorMessage="email required"
ValidationGroup="EmailValidation">*</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td style="width: 76px">
</td>
<td class="style1">
<asp:Button ID="EmailSend" runat="server" Text="send" Width="56px" ClientIDMode="Static" />
</td>
<td>
</td>
</tr>
</table>
**<asp:Panel>**
</asp:Content>
Try adding this code
<script type="text/javascript">
if (document.addEventListener) {//if Firefox
document.addEventListener("keypress", fireFoxHandler, true);
} else {
document.attachEvent("onkeyup", ieHandler);
}
function fireFoxHandler(evt) {
if (evt.keyCode == 13) {
document.getElementById("EmailSend").click();
}
}
function ieHandler(evt) {
if (evt.keyCode == 13) {
document.getElementById("EmailSend").click();
}
}
</script>
Found this solution here.
(I didn't check this in MasterPage scenario, please check...)
If you are using IE then according to the answers on these two pages:
ASP.NET enter key and form submit with no javascript
Enter button does not submit form (IE ONLY) ASP.NET
you only need to add the following to your form
<!-- Fix for IE bug submit on pressing "Enter") -->
<div style="display:none">
<input type="text" name="hiddenText"/>
</div>
I solved this problem like this:
protected void Page_Load(object sender, EventArgs e)
{
textboxusername.Attributes.Add("onKeyPress", "javascript:if (event.keyCode == 13) __doPostBack('" + LinkButton1.UniqueID + "','')");
textboxpassword.Attributes.Add("onKeyPress", "javascript:if (event.keyCode == 13) __doPostBack('" + LinkButton1.UniqueID + "','')");
}
and this is the link..
<asp:LinkButton ID="LinkButton1" runat="server" class="btn" OnClick="LinkButton1_Click">
I am getting an error: 'share' is not a member of 'ASP.default2_aspx'.
OnClick of Button1, I need this data TxtLocation, TxtDistance, Date to be shared on Facebook. Its very similar to 'Run with friends app' Simulate the same as Run with friends app'. So would it be possible to use a fb.ui stream_publish method on click of Button1 with all the three text box vales.
This is what I have in default.aspx
//stream publish method
function streamPublish(name, description, hrefTitle, hrefLink, userPrompt) {
FB.ui(
{
method: 'stream.publish',
message: '',
attachment: {
name: name,
caption: '',
description: (description),
href: hrefLink
},
action_links: [
{ text: hrefTitle, href: hrefLink }
],
user_prompt_message: userPrompt
},
function (response) {
});
}
function share() {
var share = {
method: 'stream.share',
u: 'http://thinkdiff.net/'
};
FB.ui(share, function (response) { console.log(response); });
}
</script>
<p><fb:login-button autologoutlink="true" perms="email,user_birthday,status_update,publish_stream"></fb:login-button></p>
<form id = "form1" runat="server">
<div id="Event" runat="server">
<h1>
Add your event</h1>
<table>
<tr>
<td>
Where did you go
</td>
<td>
<asp:TextBox ID="TxtLocation" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
Number of miles
</td>
<td>
<asp:TextBox ID="TxtDistance" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
Date(MM/DD/YYYY)
</td>
<td>
<asp:TextBox ID="TxtDate" runat="server">TxtDate</asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="Button1" runat="server" Text="Add Distance" onclick="share();return false" BackColor="Blue" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Maybe it's because share is already the name of the function.
Try changing the name of the var inside the function share.
Bye ;)