Wrox Programmer Forums
Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript
|
Javascript General Javascript discussions.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old August 28th, 2008, 01:43 PM
Registered User
 
Join Date: Aug 2008
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via MSN to manishk73 Send a message via Yahoo to manishk73
Default Select Option's onclick,onchange events issue

Hi,
I am using asp.net for my website. My requirement is to provide a dropdown kind of control through which user can enter a new data and if data already exist then can select existing data from the list.

For this I am using following code using Ajax <Popup Control Extender>


<asp:Panel ID="AreaOfStore" runat="server" Visible="true">
<tr>
<td class="FieldLabel" align="right">Area of Store</td>
<td>
<asp:TextBox id="txtAreaOfStore" width="150px" runat="server" AutoCompleteType="None"/>
<asp:Panel ID="pnlAreaOfStore" runat="server" style="background-color:White;position:absolute;visibility:hidden;">
<asp:ListBox ID="lbAreaOfStore" runat="server" AutoPostback="false" width="154px"s>
<asp:ListItem Value="1" Text="Area Code 001"></asp:ListItem>
<asp:ListItem Value="2" Text="Area Code 002"></asp:ListItem>
<asp:ListItem Value="3" Text="Area Code 003"></asp:ListItem>
</asp:ListBox>
</asp:Panel> <ajaxToolkit:PopupCont****tender ID="AreaOfStorePopupControl" runat="server" TargetControlID="txtAreaOfStore" PopupControlID="pnlAreaOfStore" BehaviorID="pbAreaOfStore"
Position="Bottom" CommitProperty="value" CommitScript="e.value"/>
</td>
</tr>
</asp:Panel>

PopupCont****tender displays listbox control on focus of textbox.

In Page_Load event I am adding onclick event through attribute

lbAreaOfStore.Attributes.Add("onclick", "PutTextInTextbox('AreaOfStore');")

Following is javascript code on the page

<script language="javascript" type="text/jscript">
 function PutTextInTextbox(field)
    {
    var lbox = document.getElementById("ctl00_ContentPlaceHolder1 _ItemEdit_lb"+field) document.getElementById("ctl00_ContentPlaceHolder1 _ItemEdit_txt"+field).value = lbox[lbox.selectedIndex].text;
        $find("pb"+field).hidePopup();
    }

</script>

I have avoided handling OnSelectedIndexChanged of listbox and postback of page through updatepanel using above javascript.

Above code works perfect fine on IE7,Safar3.0 but It doesnt work on Firefox Mozial browser.

Problem is onclick event does not fire in mozila. I have checked it with adding an alert.
I have tried with onchange event also. It doesnt fires.
I have cheked viewSource of the page. I can see my event added in <Select><options>.....</Select> tag of the html control.

I have an update panel under which above asp.net code is running to avoid postback of complete page form other button clicks.
Plese help on locating the issue.


 
Old August 28th, 2008, 02:45 PM
Friend of Wrox
 
Join Date: Jun 2008
Posts: 1,649
Thanks: 3
Thanked 141 Times in 140 Posts
Default

Can you show us the HTML???

A simple test of onclick for a <select> works fine in FireFox for me.

Example:

Code:
<form>
<select name="foo" onclick="alert('foo clicked');" onchange="alert('foo changed');">
<option> one
<option> two
<option> three
<option> four
</select>
</form>
 
Old August 28th, 2008, 03:26 PM
Registered User
 
Join Date: Aug 2008
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via MSN to manishk73 Send a message via Yahoo to manishk73
Default

Below is the aspx page.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<html>
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div>
            <br />
            ToDo:
            <asp:TextBox ID="MyTextBox" runat="server" Width="538px"></asp:TextBox>
            <br />
            <asp:Panel ID="Panel1" runat="server" CssClass="popupControl">
                <%--<asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>--%>
                        <asp:ListBox ID="RadioButtonList1" runat="server" AutoPostBack="false" onClick="javascript:PutTextInTextbox();"
                            Width="146px">
                            <asp:ListItem Text="Scott Guthrie"></asp:ListItem>
                            <asp:ListItem Text="Simon Muzio"></asp:ListItem>
                            <asp:ListItem Text="Brian Goldfarb"></asp:ListItem>
                            <asp:ListItem Text="Joe Stagner"></asp:ListItem>
                            <asp:ListItem Text="Shawn Nandi"></asp:ListItem>
                        </asp:ListBox>
                    <%--</ContentTemplate>
                </asp:UpdatePanel>--%>
            </asp:Panel>
            <br />
            <ajaxToolkit:PopupCont****tender ID="PopupCont****tender1" runat="server" CommitProperty="value"
                CommitScript="e.value" PopupControlID="Panel1" BehaviorID=""
                Position="Bottom" TargetControlID="MyTextBox">
            </ajaxToolkit:PopupCont****tender>
        </div>

            <asp:ListBox ID="ListBox1" runat="server" onmouseover="javascript:PutTextInTextbox('Test')"
                            Width="146px">
                            <asp:ListItem Text="Scott Guthrie"></asp:ListItem>
                            <asp:ListItem Text="Simon Muzio"></asp:ListItem>
                            <asp:ListItem Text="Brian Goldfarb"></asp:ListItem>
                            <asp:ListItem Text="Joe Stagner"></asp:ListItem>
                            <asp:ListItem Text="Shawn Nandi"></asp:ListItem>
           </asp:ListBox>

    </form>
</body>
</html>
<script language="javascript" type="text/jscript">
function PutTextInTextbox(field)
    { alert('Test');
        //var lbox = document.getElementById("ctl00_ContentPlaceHolder1 _ItemEdit_lb"+field);
        //document.getElementById("ctl00_ContentPlaceHolder1 _ItemEdit_txt"+field).value = lbox[lbox.selectedIndex].text;
        //$find("pb"+field).hidePopup();
        //return true;
    }
    </script>


 
Old August 28th, 2008, 05:32 PM
Friend of Wrox
 
Join Date: Jun 2008
Posts: 1,649
Thanks: 3
Thanked 141 Times in 140 Posts
Default

Sorry, I asked for the HTML.

I really don't want to try to bring up a project in VS and debug and and and...

If you show us the HTML that results, I can just try that immediately in a browser.

You can get the HTML by clicking on the VIEW menu and then on the SOURCE or PAGESOURCE menu item, depending on browser.
 
Old August 28th, 2008, 05:51 PM
Friend of Wrox
 
Join Date: Jun 2008
Posts: 1,649
Thanks: 3
Thanked 141 Times in 140 Posts
Default

Despite what I said in last msg, I *did* try running that.

*WOW*! Weird!

At first I thought it was because you had specified 4 rows visible, but nope, not true!

You are so right, it simply doesn't work in FireFox.

Bizarre, to say the least. Sorry!

Won't have a chance to play with it more in next day or so.
 
Old August 29th, 2008, 01:33 AM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Isn't that simply because the <script> block is defined outside of the <html> instead of in the <head> or at least in the page? I think Firefox just plays by the rules and ignores that script block.

Cheers,

Imar


---------------------------------------
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Everyone is unique, except for me.
Author of Beginning ASP.NET 3.5 : in C# and VB, ASP.NET 2.0 Instant Results and Dreamweaver MX 2004
Want to be my colleague? Then check out this post.
 
Old August 29th, 2008, 12:27 PM
Registered User
 
Join Date: Aug 2008
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via MSN to manishk73 Send a message via Yahoo to manishk73
Default

Thanks all for trying to help me.
I did silly mistake here.
type="text/jscript" should be "text/javascript".
Mozila doesnt understand jscript.
In my application when I tried it on fresh aspx page and rewritten a fresh code it worked fine and then got the reason.

 
Old August 29th, 2008, 01:20 PM
Friend of Wrox
 
Join Date: Jun 2008
Posts: 1,649
Thanks: 3
Thanked 141 Times in 140 Posts
Default

LOL! And to think I didn't notice that!

WONDERFUL! Thanks for telling us what was going on.





Similar Threads
Thread Thread Starter Forum Replies Last Post
OnChange issue kdyer Beginning PHP 2 October 4th, 2006 06:45 AM
Onchange event with select box athanatos ASP.NET 1.0 and 1.1 Basics 1 April 16th, 2006 11:29 PM
dynamically create table rows onChange of select crmpicco Classic ASP Basics 0 August 18th, 2005 07:01 AM
OnClick events examples badgolfer ASP.NET 1.0 and 1.1 Basics 5 July 21st, 2004 02:30 AM
onchange() cancelling onclick()! Eric95 Javascript 3 October 9th, 2003 08:03 AM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.