trying to use dynamically added jscript for ddlist onchange event

Discussion in 'ASP .Net Web Controls' started by Zeebra3, Aug 6, 2003.

  1. Zeebra3

    Zeebra3 Guest

    Here goes: I have a web form with several asp:dropdownlists, with
    which, when selection is changed I want to fire an event defined in
    some clientside js.

    The content of the clientside code is dependant on data collected in
    the code behind on the server. I have set AutoPostback to false for
    the controls and added lines such as
    cboMyCombo1.Attributes.Add("onchange", "MyCombos_OnChange('1')");
    in the Page_Load event, which is rendered OK when I view the source of
    the page.
    I wanted to use RegisterClientScriptBlock to get the client js into
    the page, but found that it didn't put the code into the <head> tag,
    but into the <form> tag. After some research I deemed it necessary to
    get the js into the <head> tag and so I added an id and runat=server
    to the head tag.
    At design time I have some script already declared in the head tag so
    I got the InnerHtml property of the head tag in the Page_Load event
    and appended some more script within additional <script> tags.

    When rendered and looking at the source, everything appears to be
    where I want it to be on the page. The onchange attributes are there
    and the 'MyCombos_OnChange' js function is within the head tag.
    However, you've guessed it, I get the good old message
    "Microsoft JScript runtime error: Object expected" suggesting that the
    'MyCombos_OnChange' function called from the onchange attribute is not
    defined.
    Interestingly, if I change the cboMyCombo1.Attributes.Add call in
    Page_Load to add the attribute onchange and call a function that is
    already hard coded into the page, this function is called OK. I have
    also tried swapping round the order in which hard coded client js and
    dynamic js appears, even taken out all hard coded client js. I just
    can't get my onchange event to call a dynamically created js function
    even when it is within the head tag.
    I may be overlooking something, but I've exhausted all posts similar
    to this problem and am now seeking inspiration.
    Thanks for any help with this
     
    Zeebra3, Aug 6, 2003
    #1
    1. Advertising

  2. Hi Dave,

    I played with this for a while and it *seems* to work okay. Not quite sure that
    I understand your issue so I may have missed the point.

    In the code below, I insert the script into the head tag as a generic control.
    I insert the onchange event as an attribute to the dropdown list control. The
    script is in place and is being called.

    Perhaps you can see if this is what you're after and if not, post some code
    that fails for you?

    Ken
    MVP [ASP.NET]


    Public Class jscrpt
    Inherits System.Web.UI.Page

    #Region " Web Form Designer Generated Code "

    'This call is required by the Web Form Designer.
    <System.Diagnostics.DebuggerStepThrough()> Private Sub
    InitializeComponent()

    End Sub
    Protected WithEvents cboMyCombo1 As System.Web.UI.WebControls.DropDownList
    Protected Head1 As System.Web.UI.HtmlControls.HtmlGenericControl

    'NOTE: The following placeholder declaration is required by the Web Form
    Designer.
    'Do not delete or move it.
    Private designerPlaceholderDeclaration As System.Object

    Private Sub Page_Init(ByVal sender As System.Object, ByVal e As
    System.EventArgs) Handles MyBase.Init
    'CODEGEN: This method call is required by the Web Form Designer
    'Do not modify it using the code editor.
    InitializeComponent()
    End Sub

    #End Region

    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
    System.EventArgs) Handles MyBase.Load
    cboMyCombo1.Attributes.Add("onchange", "MyCombos_OnChange('1')")
    Head1.InnerHtml = " <script>function
    MyCombos_OnChange(strText){alert(strText);}</script>"
    End Sub

    End Class


    <%@ Page Language="vb" AutoEventWireup="false" Codebehind="jscrpt.aspx.vb"
    Inherits="p733workev.jscrpt"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head runat="server" id="head1">
    </head>
    <body ms_positioning="FlowLayout">
    <form id="Form1" method="post" runat="server">
    <p>
    <asp:dropdownlist id="cboMyCombo1" runat="server">
    <asp:listitem value="red">red</asp:listitem>
    <asp:listitem value="green">green</asp:listitem>
    <asp:listitem value="blue">blue</asp:listitem>
    </asp:dropdownlist></p>
    <p>
    </form>
    </P>
    </body>
    </html>

    "Zeebra3" <> wrote in message
    news:...
    Here goes: I have a web form with several asp:dropdownlists, with
    which, when selection is changed I want to fire an event defined in
    some clientside js.

    The content of the clientside code is dependant on data collected in
    the code behind on the server. I have set AutoPostback to false for
    the controls and added lines such as
    cboMyCombo1.Attributes.Add("onchange", "MyCombos_OnChange('1')");
    in the Page_Load event, which is rendered OK when I view the source of
    the page.
    I wanted to use RegisterClientScriptBlock to get the client js into
    the page, but found that it didn't put the code into the <head> tag,
    but into the <form> tag. After some research I deemed it necessary to
    get the js into the <head> tag and so I added an id and runat=server
    to the head tag.
    At design time I have some script already declared in the head tag so
    I got the InnerHtml property of the head tag in the Page_Load event
    and appended some more script within additional <script> tags.

    When rendered and looking at the source, everything appears to be
    where I want it to be on the page. The onchange attributes are there
    and the 'MyCombos_OnChange' js function is within the head tag.
    However, you've guessed it, I get the good old message
    "Microsoft JScript runtime error: Object expected" suggesting that the
    'MyCombos_OnChange' function called from the onchange attribute is not
    defined.
    Interestingly, if I change the cboMyCombo1.Attributes.Add call in
    Page_Load to add the attribute onchange and call a function that is
    already hard coded into the page, this function is called OK. I have
    also tried swapping round the order in which hard coded client js and
    dynamic js appears, even taken out all hard coded client js. I just
    can't get my onchange event to call a dynamically created js function
    even when it is within the head tag.
    I may be overlooking something, but I've exhausted all posts similar
    to this problem and am now seeking inspiration.
    Thanks for any help with this
     
    Ken Cox [Microsoft MVP], Aug 8, 2003
    #2
    1. Advertising

  3. Zeebra3

    Zeebra3 Guest

    Many thanks for your response Ken.
    What you have done will indeed work. I have now found out what my
    problem was. The block of script that I was trying to add into the
    head was something like
    <script language="javascript><!--function doThis(arg){window.alert("Hi
    There");}--></script>
    My problem was the <!-- --> comment tags which I had failed to put
    line breaksd around. This was causing problems when it was rendered to
    the page.
    I realised this when I appended my dynamic javascript to existing
    javascript that I hard hardcoded into the page at design time. This
    existing javascript had the comment tags on separate lines and so I
    didn't need to add in any more, and the function worked OK.
    As an addition, once I knew that the comment tags were causing my
    problem, I tried using RegisterClientScriptBlock to add my dynamic
    function into the form tag on the page again and that worked too. So
    the script doesn't need to be put into the Head element after all.
    Thanks again for your response

    "Ken Cox [Microsoft MVP]" <> wrote in message news:<>...
    > Hi Dave,
    >
    > I played with this for a while and it *seems* to work okay. Not quite sure that
    > I understand your issue so I may have missed the point.
    >
    > In the code below, I insert the script into the head tag as a generic control.
    > I insert the onchange event as an attribute to the dropdown list control. The
    > script is in place and is being called.
    >
    > Perhaps you can see if this is what you're after and if not, post some code
    > that fails for you?
    >
    > Ken
    > MVP [ASP.NET]
    >
    >
    > Public Class jscrpt
    > Inherits System.Web.UI.Page
    >
    > #Region " Web Form Designer Generated Code "
    >
    > 'This call is required by the Web Form Designer.
    > <System.Diagnostics.DebuggerStepThrough()> Private Sub
    > InitializeComponent()
    >
    > End Sub
    > Protected WithEvents cboMyCombo1 As System.Web.UI.WebControls.DropDownList
    > Protected Head1 As System.Web.UI.HtmlControls.HtmlGenericControl
    >
    > 'NOTE: The following placeholder declaration is required by the Web Form
    > Designer.
    > 'Do not delete or move it.
    > Private designerPlaceholderDeclaration As System.Object
    >
    > Private Sub Page_Init(ByVal sender As System.Object, ByVal e As
    > System.EventArgs) Handles MyBase.Init
    > 'CODEGEN: This method call is required by the Web Form Designer
    > 'Do not modify it using the code editor.
    > InitializeComponent()
    > End Sub
    >
    > #End Region
    >
    > Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
    > System.EventArgs) Handles MyBase.Load
    > cboMyCombo1.Attributes.Add("onchange", "MyCombos_OnChange('1')")
    > Head1.InnerHtml = " <script>function
    > MyCombos_OnChange(strText){alert(strText);}</script>"
    > End Sub
    >
    > End Class
    >
    >
    > <%@ Page Language="vb" AutoEventWireup="false" Codebehind="jscrpt.aspx.vb"
    > Inherits="p733workev.jscrpt"%>
    > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    > <html>
    > <head runat="server" id="head1">
    > </head>
    > <body ms_positioning="FlowLayout">
    > <form id="Form1" method="post" runat="server">
    > <p>
    > <asp:dropdownlist id="cboMyCombo1" runat="server">
    > <asp:listitem value="red">red</asp:listitem>
    > <asp:listitem value="green">green</asp:listitem>
    > <asp:listitem value="blue">blue</asp:listitem>
    > </asp:dropdownlist></p>
    > <p>
    > </form>
    > </P>
    > </body>
    > </html>
    >
     
    Zeebra3, Aug 8, 2003
    #3
  4. Glad to hear you got things going!

    Ken

    "Zeebra3" <> wrote in message
    news:...
    Many thanks for your response Ken.
    What you have done will indeed work. I have now found out what my
    problem was. The block of script that I was trying to add into the
    head was something like
    <script language="javascript><!--function doThis(arg){window.alert("Hi
    There");}--></script>
    My problem was the <!-- --> comment tags which I had failed to put
    line breaksd around. This was causing problems when it was rendered to
    the page.
    I realised this when I appended my dynamic javascript to existing
    javascript that I hard hardcoded into the page at design time. This
    existing javascript had the comment tags on separate lines and so I
    didn't need to add in any more, and the function worked OK.
    As an addition, once I knew that the comment tags were causing my
    problem, I tried using RegisterClientScriptBlock to add my dynamic
    function into the form tag on the page again and that worked too. So
    the script doesn't need to be put into the Head element after all.
    Thanks again for your response

    "Ken Cox [Microsoft MVP]" <> wrote in message
    news:<>...
    > Hi Dave,
    >
    > I played with this for a while and it *seems* to work okay. Not quite sure

    that
    > I understand your issue so I may have missed the point.
    >
    > In the code below, I insert the script into the head tag as a generic

    control.
    > I insert the onchange event as an attribute to the dropdown list control. The
    > script is in place and is being called.
    >
    > Perhaps you can see if this is what you're after and if not, post some code
    > that fails for you?
    >
    > Ken
    > MVP [ASP.NET]
    >
    >
    > Public Class jscrpt
    > Inherits System.Web.UI.Page
    >
    > #Region " Web Form Designer Generated Code "
    >
    > 'This call is required by the Web Form Designer.
    > <System.Diagnostics.DebuggerStepThrough()> Private Sub
    > InitializeComponent()
    >
    > End Sub
    > Protected WithEvents cboMyCombo1 As System.Web.UI.WebControls.DropDownList
    > Protected Head1 As System.Web.UI.HtmlControls.HtmlGenericControl
    >
    > 'NOTE: The following placeholder declaration is required by the Web Form
    > Designer.
    > 'Do not delete or move it.
    > Private designerPlaceholderDeclaration As System.Object
    >
    > Private Sub Page_Init(ByVal sender As System.Object, ByVal e As
    > System.EventArgs) Handles MyBase.Init
    > 'CODEGEN: This method call is required by the Web Form Designer
    > 'Do not modify it using the code editor.
    > InitializeComponent()
    > End Sub
    >
    > #End Region
    >
    > Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
    > System.EventArgs) Handles MyBase.Load
    > cboMyCombo1.Attributes.Add("onchange", "MyCombos_OnChange('1')")
    > Head1.InnerHtml = " <script>function
    > MyCombos_OnChange(strText){alert(strText);}</script>"
    > End Sub
    >
    > End Class
    >
    >
    > <%@ Page Language="vb" AutoEventWireup="false" Codebehind="jscrpt.aspx.vb"
    > Inherits="p733workev.jscrpt"%>
    > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    > <html>
    > <head runat="server" id="head1">
    > </head>
    > <body ms_positioning="FlowLayout">
    > <form id="Form1" method="post" runat="server">
    > <p>
    > <asp:dropdownlist id="cboMyCombo1" runat="server">
    > <asp:listitem value="red">red</asp:listitem>
    > <asp:listitem value="green">green</asp:listitem>
    > <asp:listitem value="blue">blue</asp:listitem>
    > </asp:dropdownlist></p>
    > <p>
    > </form>
    > </P>
    > </body>
    > </html>
    >
     
    Ken Cox [Microsoft MVP], Aug 8, 2003
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Jon Maz
    Replies:
    4
    Views:
    1,282
    Jon Maz
    Sep 9, 2004
  2. Maxwell2006
    Replies:
    5
    Views:
    2,414
    Steven Cheng[MSFT]
    Mar 7, 2006
  3. deepak kumar

    simple question(ddlist and javascript)

    deepak kumar, Oct 30, 2004, in forum: ASP .Net Web Controls
    Replies:
    1
    Views:
    112
    deepak kumar
    Oct 30, 2004
  4. deepak

    DropDownList(ddlist) and TextBox(tbox)

    deepak, Dec 12, 2005, in forum: ASP .Net Web Controls
    Replies:
    1
    Views:
    154
    Sundar.k
    Dec 12, 2005
  5. John Bentley
    Replies:
    14
    Views:
    366
    Jim Ley
    Feb 5, 2004
Loading...

Share This Page