Disable Button With Javascript

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Joey

    Disable Button With Javascript

    Hello,

    In my C# asp.net 2.0 application, I have a webform with a button server
    control on it. The webform, like most others in the site, subscribes to
    a master page. I have determined that the button always renders with an
    id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
    Firefox browsers.

    I created the following javascript code segment to disable it when the
    page loads. I have reasons for not wanting to do this with server side
    code...

    document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;

    Now, when I view this in IE, the button is disabled. But when I view it
    in Firefox, it's not. Also, there are no javascript errors returned by
    either browser. Also, I have already updated my browserCaps section in
    web.config, if that is relevant.

    Why does the button remain enabled when viewing the page with Firefox?

  • Cowboy \(Gregory A. Beamer\)

    #2
    Re: Disable Button With Javascript

    YOu need to actually query, in code behind, to determine what the postback
    event is for the control and emit the JavaScript accordingly. I am not sure
    this conquers all Firefox issues, but it guarantees a proper path down the
    rabbit hole even if you rename the control for some reason. I do not have a
    sample for this.

    If you have to go absolutely generic, you can get the control that posted
    from Request["EVENTTARGE T"], but this does not work with all controls.

    --
    Gregory A. Beamer
    MVP; MCP: +I, SE, SD, DBA

    *************** *************** *************** ****
    Think outside of the box!
    *************** *************** *************** ****
    "Joey" <joey.powell@to pscene.comwrote in message
    news:1158761838 .874393.207660@ h48g2000cwc.goo glegroups.com.. .
    Hello,
    >
    In my C# asp.net 2.0 application, I have a webform with a button server
    control on it. The webform, like most others in the site, subscribes to
    a master page. I have determined that the button always renders with an
    id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
    Firefox browsers.
    >
    I created the following javascript code segment to disable it when the
    page loads. I have reasons for not wanting to do this with server side
    code...
    >
    document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;
    >
    Now, when I view this in IE, the button is disabled. But when I view it
    in Firefox, it's not. Also, there are no javascript errors returned by
    either browser. Also, I have already updated my browserCaps section in
    web.config, if that is relevant.
    >
    Why does the button remain enabled when viewing the page with Firefox?
    >

    Comment

    • Brennan Stehling

      #3
      Re: Disable Button With Javascript

      Joey,

      This code works for me. Be sure to declare your DTD as XHTML 1.1
      Transitional. You may find that helps because the way the disabled
      attribute was handled has changed since the HTML 3.2 spec.

      <script type="text/javascript">
      <!--
      function disableButton(b uttonId) {
      if (document.all) {
      var btn = document.all[buttonId; btn.disabled = 'true';
      }
      else {
      var btn = document.getEle mentById(button Id); btn.disabled = 'true';
      }
      }
      // -->
      </script>

      ....

      <!-- After button is defined -->
      <script type="text/javascript">
      disableButton(' ct100_ContentPl aceHolder1_btnC ontinue');
      </script>


      Brennan Stehling


      Joey wrote:
      Hello,
      >
      In my C# asp.net 2.0 application, I have a webform with a button server
      control on it. The webform, like most others in the site, subscribes to
      a master page. I have determined that the button always renders with an
      id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
      Firefox browsers.
      >
      I created the following javascript code segment to disable it when the
      page loads. I have reasons for not wanting to do this with server side
      code...
      >
      document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;
      >
      Now, when I view this in IE, the button is disabled. But when I view it
      in Firefox, it's not. Also, there are no javascript errors returned by
      either browser. Also, I have already updated my browserCaps section in
      web.config, if that is relevant.
      >
      Why does the button remain enabled when viewing the page with Firefox?

      Comment

      • bruce barker \(sqlwork.com\)

        #4
        Re: Disable Button With Javascript

        document.all is an IE only collection, it does not exist in the w3c
        standard, so it works in ie only. use the w3c standard:

        document.getEle mentById('ct100 _ContentPlaceHo lder1_btnContin ue').disabled =
        true;

        -- bruce (sqlwork.com)

        "Joey" <joey.powell@to pscene.comwrote in message
        news:1158761838 .874393.207660@ h48g2000cwc.goo glegroups.com.. .
        Hello,
        >
        In my C# asp.net 2.0 application, I have a webform with a button server
        control on it. The webform, like most others in the site, subscribes to
        a master page. I have determined that the button always renders with an
        id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
        Firefox browsers.
        >
        I created the following javascript code segment to disable it when the
        page loads. I have reasons for not wanting to do this with server side
        code...
        >
        document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;
        >
        Now, when I view this in IE, the button is disabled. But when I view it
        in Firefox, it's not. Also, there are no javascript errors returned by
        either browser. Also, I have already updated my browserCaps section in
        web.config, if that is relevant.
        >
        Why does the button remain enabled when viewing the page with Firefox?
        >

        Comment

        • Joey

          #5
          Re: Disable Button With Javascript

          Can you provide a simple example as to how to query, in code behind,
          for the correct id?

          Cowboy (Gregory A. Beamer) wrote:
          YOu need to actually query, in code behind, to determine what the postback
          event is for the control and emit the JavaScript accordingly. I am not sure
          this conquers all Firefox issues, but it guarantees a proper path down the
          rabbit hole even if you rename the control for some reason. I do not have a
          sample for this.
          >
          If you have to go absolutely generic, you can get the control that posted
          from Request["EVENTTARGE T"], but this does not work with all controls.
          >
          --
          Gregory A. Beamer
          MVP; MCP: +I, SE, SD, DBA
          >
          *************** *************** *************** ****
          Think outside of the box!
          *************** *************** *************** ****
          "Joey" <joey.powell@to pscene.comwrote in message
          news:1158761838 .874393.207660@ h48g2000cwc.goo glegroups.com.. .
          Hello,

          In my C# asp.net 2.0 application, I have a webform with a button server
          control on it. The webform, like most others in the site, subscribes to
          a master page. I have determined that the button always renders with an
          id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
          Firefox browsers.

          I created the following javascript code segment to disable it when the
          page loads. I have reasons for not wanting to do this with server side
          code...

          document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;

          Now, when I view this in IE, the button is disabled. But when I view it
          in Firefox, it's not. Also, there are no javascript errors returned by
          either browser. Also, I have already updated my browserCaps section in
          web.config, if that is relevant.

          Why does the button remain enabled when viewing the page with Firefox?

          Comment

          • Joey

            #6
            Re: Disable Button With Javascript

            Okay, I changed it to...

            document.getEle mentById('ct100 _ContentPlaceHo lder1_btnContin ue').disabled=t rue

            Now it still works fine in IE, and it still doesn't work in Firefox.

            Any other ideas, anyone?


            bruce barker (sqlwork.com) wrote:
            document.all is an IE only collection, it does not exist in the w3c
            standard, so it works in ie only. use the w3c standard:
            >
            document.getEle mentById('ct100 _ContentPlaceHo lder1_btnContin ue').disabled =
            true;
            >
            -- bruce (sqlwork.com)
            >
            "Joey" <joey.powell@to pscene.comwrote in message
            news:1158761838 .874393.207660@ h48g2000cwc.goo glegroups.com.. .
            Hello,

            In my C# asp.net 2.0 application, I have a webform with a button server
            control on it. The webform, like most others in the site, subscribes to
            a master page. I have determined that the button always renders with an
            id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
            Firefox browsers.

            I created the following javascript code segment to disable it when the
            page loads. I have reasons for not wanting to do this with server side
            code...

            document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;

            Now, when I view this in IE, the button is disabled. But when I view it
            in Firefox, it's not. Also, there are no javascript errors returned by
            either browser. Also, I have already updated my browserCaps section in
            web.config, if that is relevant.

            Why does the button remain enabled when viewing the page with Firefox?

            Comment

            • Joey

              #7
              Re: Disable Button With Javascript

              Okay, nevermind. I cleared the cache in Firefox, and now it works.
              Thanks a lot!
              Joey wrote:
              Okay, I changed it to...
              >
              document.getEle mentById('ct100 _ContentPlaceHo lder1_btnContin ue').disabled=t rue
              >
              Now it still works fine in IE, and it still doesn't work in Firefox.
              >
              Any other ideas, anyone?
              >
              >
              bruce barker (sqlwork.com) wrote:
              document.all is an IE only collection, it does not exist in the w3c
              standard, so it works in ie only. use the w3c standard:

              document.getEle mentById('ct100 _ContentPlaceHo lder1_btnContin ue').disabled =
              true;

              -- bruce (sqlwork.com)

              "Joey" <joey.powell@to pscene.comwrote in message
              news:1158761838 .874393.207660@ h48g2000cwc.goo glegroups.com.. .
              Hello,
              >
              In my C# asp.net 2.0 application, I have a webform with a button server
              control on it. The webform, like most others in the site, subscribes to
              a master page. I have determined that the button always renders with an
              id of "ct100_ContentP laceHolder1_btn Continue" in both the IE and
              Firefox browsers.
              >
              I created the following javascript code segment to disable it when the
              page loads. I have reasons for not wanting to do this with server side
              code...
              >
              document.all['ct100_ContentP laceHolder1_btn Continue'].disabled = true;
              >
              Now, when I view this in IE, the button is disabled. But when I view it
              in Firefox, it's not. Also, there are no javascript errors returned by
              either browser. Also, I have already updated my browserCaps section in
              web.config, if that is relevant.
              >
              Why does the button remain enabled when viewing the page with Firefox?
              >

              Comment

              • Mark Rae

                #8
                Re: Disable Button With Javascript

                "Joey" <joey.powell@to pscene.comwrote in message
                news:1158768097 .842019.240380@ h48g2000cwc.goo glegroups.com.. .
                Okay, nevermind. I cleared the cache in Firefox, and now it works.
                BTW, you could make your HTML more readable by giving your MasterPage(s) and
                ContentPages meaningful IDs... E.g. in the code behind your MasterPage:

                protected void Page_Init(objec t sender, EventArgs e)
                {
                this.ID = "MyMasterPa ge";
                }

                And then explicitly name every ContentPage in its HTML e.g.

                <asp:Content ContentPlaceHol derID="MyConten tPage" runat="server">
                <asp:TextBox ID="MyTextBox" runat="server" />
                </<asp:Content>

                Then, client side, your control will ALWAYS be called
                MyMasterPage_My ContentPage_MyT extBox- this makes your life massively easier
                because it means you don't have to ask ASP.NET to tell you the controls'IDs,
                as you already know them.

                In this way, you can use client-side JavaScript to refer to your controls in
                two ways:

                document.aspnet Form.MyMasterPa ge_MyContentPag e_MyTextBox

                or

                document.getEle mentById('MyMas terPage_MyConte ntPage_MyTextBo x')

                Also, don't forget that no matter what ID you give the <formtag in your
                MasterPage, ASP.NET will ALWAYS rename it to aspnetForm :-)


                Comment

                • Edwin Knoppert

                  #9
                  Re: Disable Button With Javascript

                  Forget that , use inline aspx code to pass the control's .ClientID property.
                  This is the most reliable.


                  "Mark Rae" <mark@markNOSPA Mrae.comschreef in bericht
                  news:e4xK1dN3GH A.1060@TK2MSFTN GP04.phx.gbl...
                  "Joey" <joey.powell@to pscene.comwrote in message
                  news:1158768097 .842019.240380@ h48g2000cwc.goo glegroups.com.. .
                  >
                  >Okay, nevermind. I cleared the cache in Firefox, and now it works.
                  >
                  BTW, you could make your HTML more readable by giving your MasterPage(s)
                  and ContentPages meaningful IDs... E.g. in the code behind your
                  MasterPage:
                  >
                  protected void Page_Init(objec t sender, EventArgs e)
                  {
                  this.ID = "MyMasterPa ge";
                  }
                  >
                  And then explicitly name every ContentPage in its HTML e.g.
                  >
                  <asp:Content ContentPlaceHol derID="MyConten tPage" runat="server">
                  <asp:TextBox ID="MyTextBox" runat="server" />
                  </<asp:Content>
                  >
                  Then, client side, your control will ALWAYS be called
                  MyMasterPage_My ContentPage_MyT extBox- this makes your life massively
                  easier because it means you don't have to ask ASP.NET to tell you the
                  controls'IDs, as you already know them.
                  >
                  In this way, you can use client-side JavaScript to refer to your controls
                  in two ways:
                  >
                  document.aspnet Form.MyMasterPa ge_MyContentPag e_MyTextBox
                  >
                  or
                  >
                  document.getEle mentById('MyMas terPage_MyConte ntPage_MyTextBo x')
                  >
                  Also, don't forget that no matter what ID you give the <formtag in your
                  MasterPage, ASP.NET will ALWAYS rename it to aspnetForm :-)
                  >

                  Comment

                  • Brennan Stehling

                    #10
                    Re: Disable Button With Javascript

                    I agree. You never know what the hiearchy will be when your pages and
                    controls are used. Hard-coding the names in Javascript will ensure
                    they break sooner or later.

                    What I normally do is declare Javascript variables in a static .js file
                    with the major of the Javascript behavior. And then with the ASP.NET
                    controls, I insert script blocks which set those variables.

                    <script ...>
                    var buttonId;

                    functions...
                    </script>

                    <!-- later from the ASP.NET control -->

                    <script ...>
                    buttonId = 'Page_Button1';
                    </script>

                    Search for RegisterScriptB lock on MSDN.

                    Brennan Stehling


                    Edwin Knoppert wrote:
                    Forget that , use inline aspx code to pass the control's .ClientID property.
                    This is the most reliable.
                    >
                    >
                    "Mark Rae" <mark@markNOSPA Mrae.comschreef in bericht
                    news:e4xK1dN3GH A.1060@TK2MSFTN GP04.phx.gbl...
                    "Joey" <joey.powell@to pscene.comwrote in message
                    news:1158768097 .842019.240380@ h48g2000cwc.goo glegroups.com.. .
                    Okay, nevermind. I cleared the cache in Firefox, and now it works.
                    BTW, you could make your HTML more readable by giving your MasterPage(s)
                    and ContentPages meaningful IDs... E.g. in the code behind your
                    MasterPage:

                    protected void Page_Init(objec t sender, EventArgs e)
                    {
                    this.ID = "MyMasterPa ge";
                    }

                    And then explicitly name every ContentPage in its HTML e.g.

                    <asp:Content ContentPlaceHol derID="MyConten tPage" runat="server">
                    <asp:TextBox ID="MyTextBox" runat="server" />
                    </<asp:Content>

                    Then, client side, your control will ALWAYS be called
                    MyMasterPage_My ContentPage_MyT extBox- this makes your life massively
                    easier because it means you don't have to ask ASP.NET to tell you the
                    controls'IDs, as you already know them.

                    In this way, you can use client-side JavaScript to refer to your controls
                    in two ways:

                    document.aspnet Form.MyMasterPa ge_MyContentPag e_MyTextBox

                    or

                    document.getEle mentById('MyMas terPage_MyConte ntPage_MyTextBo x')

                    Also, don't forget that no matter what ID you give the <formtag in your
                    MasterPage, ASP.NET will ALWAYS rename it to aspnetForm :-)

                    Comment

                    • Edwin Knoppert

                      #11
                      Re: Disable Button With Javascript

                      I meant:

                      var o = document.getEle mentById('<%=tx t_Index.ClientI D%>');
                      o.value = ....


                      "Brennan Stehling" <offwhite@gmail .comschreef in bericht
                      news:1158847610 .560289.229050@ m7g2000cwm.goog legroups.com...
                      >I agree. You never know what the hiearchy will be when your pages and
                      controls are used. Hard-coding the names in Javascript will ensure
                      they break sooner or later.
                      >
                      What I normally do is declare Javascript variables in a static .js file
                      with the major of the Javascript behavior. And then with the ASP.NET
                      controls, I insert script blocks which set those variables.
                      >
                      <script ...>
                      var buttonId;
                      >
                      functions...
                      </script>
                      >
                      <!-- later from the ASP.NET control -->
                      >
                      <script ...>
                      buttonId = 'Page_Button1';
                      </script>
                      >
                      Search for RegisterScriptB lock on MSDN.
                      >
                      Brennan Stehling

                      >
                      Edwin Knoppert wrote:
                      >Forget that , use inline aspx code to pass the control's .ClientID
                      >property.
                      >This is the most reliable.
                      >>
                      >>
                      >"Mark Rae" <mark@markNOSPA Mrae.comschreef in bericht
                      >news:e4xK1dN3G HA.1060@TK2MSFT NGP04.phx.gbl.. .
                      "Joey" <joey.powell@to pscene.comwrote in message
                      news:1158768097 .842019.240380@ h48g2000cwc.goo glegroups.com.. .
                      >
                      >Okay, nevermind. I cleared the cache in Firefox, and now it works.
                      >
                      BTW, you could make your HTML more readable by giving your
                      MasterPage(s)
                      and ContentPages meaningful IDs... E.g. in the code behind your
                      MasterPage:
                      >
                      protected void Page_Init(objec t sender, EventArgs e)
                      {
                      this.ID = "MyMasterPa ge";
                      }
                      >
                      And then explicitly name every ContentPage in its HTML e.g.
                      >
                      <asp:Content ContentPlaceHol derID="MyConten tPage" runat="server">
                      <asp:TextBox ID="MyTextBox" runat="server" />
                      </<asp:Content>
                      >
                      Then, client side, your control will ALWAYS be called
                      MyMasterPage_My ContentPage_MyT extBox- this makes your life massively
                      easier because it means you don't have to ask ASP.NET to tell you the
                      controls'IDs, as you already know them.
                      >
                      In this way, you can use client-side JavaScript to refer to your
                      controls
                      in two ways:
                      >
                      document.aspnet Form.MyMasterPa ge_MyContentPag e_MyTextBox
                      >
                      or
                      >
                      document.getEle mentById('MyMas terPage_MyConte ntPage_MyTextBo x')
                      >
                      Also, don't forget that no matter what ID you give the <formtag in
                      your
                      MasterPage, ASP.NET will ALWAYS rename it to aspnetForm :-)
                      >
                      >

                      Comment

                      • Mark Rae

                        #12
                        Re: Disable Button With Javascript

                        "Edwin Knoppert" <news@hellobasi c.comwrote in message
                        news:4513e47b$0 $2029$ba620dc5@ text.nova.plane t.nl...
                        var o = document.getEle mentById('<%=tx t_Index.ClientI D%>');
                        o.value = ....
                        Yes, I agree that is more robust...


                        Comment

                        Working...