Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Code Project
  1. Home
  2. Web Development
  3. ASP.NET
  4. ASP user control and client scripting

ASP user control and client scripting

Scheduled Pinned Locked Moved ASP.NET
toolsquestion
12 Posts 2 Posters 0 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • W Offline
    W Offline
    wilf57
    wrote on last edited by
    #1

    Is it possible to check the value of a user control, used on a website by means of a client script on that website. I think it should be of cource, but the 'element.value' notation doesn't work. My user control contains a listbox, initialized in the user control's code. What I'm doing wrong? Wilfried

    G W 2 Replies Last reply
    0
    • W wilf57

      Is it possible to check the value of a user control, used on a website by means of a client script on that website. I think it should be of cource, but the 'element.value' notation doesn't work. My user control contains a listbox, initialized in the user control's code. What I'm doing wrong? Wilfried

      G Offline
      G Offline
      Guffa
      wrote on last edited by
      #2

      View the source of the page, and you will see that the id of the element is not just "element", but the name of other controls has been prepended to the name. Use the ClientID property to get the full id that you can use in client code. I recommend that you use the document.getElementById method instead of just referring to the elements as if they were global variables. It works in most browser in most of the cases, but not always. A common shorthand for the getElementById is the $ function: function $(id) { return document.getElementById(id); }

      --- single minded; short sighted; long gone;

      W 1 Reply Last reply
      0
      • G Guffa

        View the source of the page, and you will see that the id of the element is not just "element", but the name of other controls has been prepended to the name. Use the ClientID property to get the full id that you can use in client code. I recommend that you use the document.getElementById method instead of just referring to the elements as if they were global variables. It works in most browser in most of the cases, but not always. A common shorthand for the getElementById is the $ function: function $(id) { return document.getElementById(id); }

        --- single minded; short sighted; long gone;

        W Offline
        W Offline
        wilf57
        wrote on last edited by
        #3

        Thanks for answering. Sorry probably my description was not precise. I used the normal access methods already. My user control has the ID sodatum, so I try to access it by: sodatum.value or document.getElementById("sodatum").value but it both returns null. There is another textbox on the same page, named 'artnr' and even another listbox too, both of them accessible. It must be, because it's a user control. It's implemented in the following way:

        <%@ Register TagPrefix="ucSod" TagName="sodat" Src="~/uc/sodatum.ascx" %>
        <%@ Page Language="VB" CodeFile="Suche.aspx.vb" Inherits="Suche" %>

        alert(document.getElementById("artnr").value;
        alert(document.getElementById("sodatum").value;
        

        |asp:TextBox ID="artnr" runat="server"
        |ucSod:sodat ID="sodatum" runat="server"/>

        I used '|' instead of '<' here, because otherwise it's not properly displayed in this forum message. In the code there are '<' of course. The first alert works, the second doesn't. Wilfried

        G 1 Reply Last reply
        0
        • W wilf57

          Is it possible to check the value of a user control, used on a website by means of a client script on that website. I think it should be of cource, but the 'element.value' notation doesn't work. My user control contains a listbox, initialized in the user control's code. What I'm doing wrong? Wilfried

          W Offline
          W Offline
          wilf57
          wrote on last edited by
          #4

          So I found the shit myself asp.net renders a user control differnt than a normal control. The ID of a user control on the webpage is a combination of the ID used on the page and that in the user control HTML code. Best way: look at the source code of the page created by asp.net and wich ID asp.net used to address the specific control. Ex. If the user control is implemented the following way:

          |ucSod:sodat ID="sodatum" runat="server"/>

          client script access is thru: formxxx.sodatum_sodat.value (there's a '<' instead of the '|', but then it's not displayed in the forum, why??? -- modified at 9:36 Monday 26th February, 2007

          G 1 Reply Last reply
          0
          • W wilf57

            So I found the shit myself asp.net renders a user control differnt than a normal control. The ID of a user control on the webpage is a combination of the ID used on the page and that in the user control HTML code. Best way: look at the source code of the page created by asp.net and wich ID asp.net used to address the specific control. Ex. If the user control is implemented the following way:

            |ucSod:sodat ID="sodatum" runat="server"/>

            client script access is thru: formxxx.sodatum_sodat.value (there's a '<' instead of the '|', but then it's not displayed in the forum, why??? -- modified at 9:36 Monday 26th February, 2007

            G Offline
            G Offline
            Guffa
            wrote on last edited by
            #5

            wilf57 wrote:

            So I found the sh*t myself asp.net renders a user control differnt than a normal control. The ID of a user control on the webpage is a combination of the ID used on the page and that in the user control HTML code.

            I told you so. Didn't you read my post before you replied to it?

            Best way: look at the source code of the page created by asp.net and wich ID asp.net used to address the specific control.

            No, the best way is to use the ClientID property, just as I wrote in my previous post. The way that the id is created may change with the version of framework, but the ClientID property will always return the correct id.

            --- single minded; short sighted; long gone;

            W 1 Reply Last reply
            0
            • W wilf57

              Thanks for answering. Sorry probably my description was not precise. I used the normal access methods already. My user control has the ID sodatum, so I try to access it by: sodatum.value or document.getElementById("sodatum").value but it both returns null. There is another textbox on the same page, named 'artnr' and even another listbox too, both of them accessible. It must be, because it's a user control. It's implemented in the following way:

              <%@ Register TagPrefix="ucSod" TagName="sodat" Src="~/uc/sodatum.ascx" %>
              <%@ Page Language="VB" CodeFile="Suche.aspx.vb" Inherits="Suche" %>

              alert(document.getElementById("artnr").value;
              alert(document.getElementById("sodatum").value;
              

              |asp:TextBox ID="artnr" runat="server"
              |ucSod:sodat ID="sodatum" runat="server"/>

              I used '|' instead of '<' here, because otherwise it's not properly displayed in this forum message. In the code there are '<' of course. The first alert works, the second doesn't. Wilfried

              G Offline
              G Offline
              Guffa
              wrote on last edited by
              #6

              wilf57 wrote:

              The first alert works, the second doesn't.

              No, neither of them works. The first alert shows the value of the 'artnr' textbox in the page, not the 'artnr' textbox in the user control.

              --- single minded; short sighted; long gone;

              1 Reply Last reply
              0
              • G Guffa

                wilf57 wrote:

                So I found the sh*t myself asp.net renders a user control differnt than a normal control. The ID of a user control on the webpage is a combination of the ID used on the page and that in the user control HTML code.

                I told you so. Didn't you read my post before you replied to it?

                Best way: look at the source code of the page created by asp.net and wich ID asp.net used to address the specific control.

                No, the best way is to use the ClientID property, just as I wrote in my previous post. The way that the id is created may change with the version of framework, but the ClientID property will always return the correct id.

                --- single minded; short sighted; long gone;

                W Offline
                W Offline
                wilf57
                wrote on last edited by
                #7

                the last one is an argument, but still: if there is a user control on the page like this: then document.getElementById("sodatum").value doesn't work what works is: document.getElementById("sodatum_sodat").value try it (I'm using ie6) for me it seems logical, because if the control's ID in the server produced HTML code is 'sodatum_sodat' any javascript cannot access the control by 'sodatum'

                G 1 Reply Last reply
                0
                • W wilf57

                  the last one is an argument, but still: if there is a user control on the page like this: then document.getElementById("sodatum").value doesn't work what works is: document.getElementById("sodatum_sodat").value try it (I'm using ie6) for me it seems logical, because if the control's ID in the server produced HTML code is 'sodatum_sodat' any javascript cannot access the control by 'sodatum'

                  G Offline
                  G Offline
                  Guffa
                  wrote on last edited by
                  #8

                  You are completely missing the point. Use the ClientID property to get the name to use in the client code. If you hard code the name, your code only works with the exact structure that your page has. If anything changes in that structure, the name changes. Also, you can only use the code for that single page, you can't put the user control in another page if it doesn't have the exact same structure. Also, if you deply the application to a web server, it's not certain that it will use the same pattern to create the name. An update of IIS or the framework may also change the way that the name is constructed.

                  --- single minded; short sighted; long gone;

                  W 1 Reply Last reply
                  0
                  • G Guffa

                    You are completely missing the point. Use the ClientID property to get the name to use in the client code. If you hard code the name, your code only works with the exact structure that your page has. If anything changes in that structure, the name changes. Also, you can only use the code for that single page, you can't put the user control in another page if it doesn't have the exact same structure. Also, if you deply the application to a web server, it's not certain that it will use the same pattern to create the name. An update of IIS or the framework may also change the way that the name is constructed.

                    --- single minded; short sighted; long gone;

                    W Offline
                    W Offline
                    wilf57
                    wrote on last edited by
                    #9

                    Ok I got that. I read about it in the help too.

                    Now I tried this in the client script: document.getElementById("<%=artnr.ClientID%>").value document.getElementById("<%=sodatum.ClientID%>").value the first statement with the textbox works fine, the second one with the user control doesn't it says: document.getElementById("<%=sodatum.ClientID%>")is not an object. and indeed when I execute on the server side (in page_load() or even aftzer loading in a button event: Msgbox me.sodatum.ClientID it always prints 'sodatum' and not 'sodatum_sodat' as I'd have expected. any explainations? Thanks for your patience Wilfried

                    G 1 Reply Last reply
                    0
                    • W wilf57

                      Ok I got that. I read about it in the help too.

                      Now I tried this in the client script: document.getElementById("<%=artnr.ClientID%>").value document.getElementById("<%=sodatum.ClientID%>").value the first statement with the textbox works fine, the second one with the user control doesn't it says: document.getElementById("<%=sodatum.ClientID%>")is not an object. and indeed when I execute on the server side (in page_load() or even aftzer loading in a button event: Msgbox me.sodatum.ClientID it always prints 'sodatum' and not 'sodatum_sodat' as I'd have expected. any explainations? Thanks for your patience Wilfried

                      G Offline
                      G Offline
                      Guffa
                      wrote on last edited by
                      #10

                      Is the client script inside the user control? Otherwise you can not reference the controls in that way, you have to specify that they are in the user control. You also have to change their accessibility to public, or expose them through public properties in the user control. Are you sure that the first one works correctly? Do you get the value from the field in the user control and not the field in the page?

                      --- single minded; short sighted; long gone;

                      W 1 Reply Last reply
                      0
                      • G Guffa

                        Is the client script inside the user control? Otherwise you can not reference the controls in that way, you have to specify that they are in the user control. You also have to change their accessibility to public, or expose them through public properties in the user control. Are you sure that the first one works correctly? Do you get the value from the field in the user control and not the field in the page?

                        --- single minded; short sighted; long gone;

                        W Offline
                        W Offline
                        wilf57
                        wrote on last edited by
                        #11

                        The first one is simply a textbox on the page. Thats why it works fine. The client script is on the page, not in the user control. I wrote a public property (Text) in the user control, so I can read and write the listbox(the one in the user control) on the server side but that doesn't help on the page client side, right?! So you say in the page client script I cannot access the listbox inside the user control by its ClientID property , only by the hard coded ID. Ok next week I'm going skiing, I have do deal with that thing after that. Thanks again Wilfried

                        G 1 Reply Last reply
                        0
                        • W wilf57

                          The first one is simply a textbox on the page. Thats why it works fine. The client script is on the page, not in the user control. I wrote a public property (Text) in the user control, so I can read and write the listbox(the one in the user control) on the server side but that doesn't help on the page client side, right?! So you say in the page client script I cannot access the listbox inside the user control by its ClientID property , only by the hard coded ID. Ok next week I'm going skiing, I have do deal with that thing after that. Thanks again Wilfried

                          G Offline
                          G Offline
                          Guffa
                          wrote on last edited by
                          #12

                          wilf57 wrote:

                          I wrote a public property (Text) in the user control, so I can read and write the listbox(the one in the user control) on the server side but that doesn't help on the page client side, right?!

                          The property is not for use on the client side, but on the server side.

                          wilf57 wrote:

                          So you say in the page client script I cannot access the listbox inside the user control by its ClientID property , only by the hard coded ID.

                          You can never access a control from the client side, regardless of where it is. The control only exists on the server side, the only thing that is left of it on the client side is the html elements that it renders. The concept of a user control doesn't exist on the client side. You can access any element in the page, regardless of how the code for it is created on the server. What you have to do is simply get access to the right control so that you can get the ClientID for it, then you can use that in the client code to access the control without problem.

                          --- single minded; short sighted; long gone;

                          1 Reply Last reply
                          0
                          Reply
                          • Reply as topic
                          Log in to reply
                          • Oldest to Newest
                          • Newest to Oldest
                          • Most Votes


                          • Login

                          • Don't have an account? Register

                          • Login or register to search.
                          • First post
                            Last post
                          0
                          • Categories
                          • Recent
                          • Tags
                          • Popular
                          • World
                          • Users
                          • Groups