Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Jan 2012
    Posts
    17
    Thanks
    8
    Thanked 0 Times in 0 Posts

    It worked using Buttons But does not work with URLs, Please help!!!

    I got this code to WORK with Buttons... But, i can NOT get it to work with URLs/LINKs... dose anyone have any suggestions? The URL alternative LINKs are placed below the buttons... but like i have said, they don't work. Help Pleeeeese. Thanks.


    ****HEAD
    <script language="javascript" type="text/javascript">

    function getCheckedValue() {

    document.getElementById("presentationsNavBars").style.display = 'block';
    document.getElementById("proposalsNavBars").style.display = 'none';
    document.getElementById("postingsNavBars").style.display = 'none';
    document.getElementById("myaccountNavBars").style.display = 'none';
    }

    function getCheckedValue2() {

    document.getElementById("presentationsNavBars").style.display = 'none';
    document.getElementById("proposalsNavBars").style.display = 'block';
    document.getElementById("postingsNavBars").style.display = 'none';
    document.getElementById("myaccountNavBars").style.display = 'none';
    }
    function getCheckedValue3() {

    document.getElementById("presentationsNavBars").style.display = 'none';
    document.getElementById("proposalsNavBars").style.display = 'none';
    document.getElementById("postingsNavBars").style.display = 'block';
    document.getElementById("myaccountNavBars").style.display = 'none';

    }
    function getCheckedValue4() {

    document.getElementById("presentationsNavBars").style.display = 'none';
    document.getElementById("proposalsNavBars").style.display = 'none';
    document.getElementById("postingsNavBars").style.display = 'none';
    document.getElementById("myaccountNavBars").style.display = 'block';

    }
    </script>



    ****** BODY

    <div class="student_text">
    <asp:RadioButton ID="RadioButton1" GroupName="reg" Text="presentations" runat="server" OnClick="return getCheckedValue();" />
    <br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
    <a href="navPageTest2.aspx" runat="server" onclick="getClickedValue();">Presentations_link_ex</a><br />
    </div>
    <br /><br />
    <div class="student_text">
    <asp:RadioButton ID="RadioButton2" GroupName="reg" Text="proposals" runat="server" onclick="return getCheckedValue2();" />
    <br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
    <a href="navPageTest2.aspx" onclick="getClickedValue2();">Proposals_link_ex</a><br />
    </div>
    <br /><br />
    <div class="student_text">
    <asp:RadioButton ID="RadioButton3" GroupName="reg" Text="postings" runat="server" onclick="return getCheckedValue3();" />
    <br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
    <a href="navPageTest2.aspx" onclick="getClickedValue3();">Postings_link_ex</a><br />
    </div>
    <br /><br />
    <div class="student_text">
    <asp:RadioButton ID="RadioButton4" GroupName="reg" Text="myaccount" runat="server" onclick="return getCheckedValue4();" />
    <br /> <%--OR how do i get it to work when using a URL as shown below for example--%>
    <a href="navPageTest2.aspx" onclick="getClickedValue4();">Myaccount_link_ex</a><br />
    </div>
    <br /><br />
    ****************************** start display *****************************
    <br /><br />
    <div id="presentationsNavBars" style="display: none;">
    SOME HTML HERE ..........presentations nav bar............
    </div>
    <div id="proposalsNavBars" style="display: none;" >
    SOME HTML HERE 44444444 proposals nav bar 44444444444
    </div>
    <div id="postingsNavBars" style="display: none;" >
    SOME HTML HERE 2222222 postings nav bar 2222222222222
    </div>
    <div id="myaccountNavBars" style="display: block;" >
    SOME HTML HERE 33333333 myaccount nav bar 33333333
    </div>
    <br /><br />
    ****************************** end *****************************

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,549
    Thanks
    80
    Thanked 4,617 Times in 4,581 Posts
    That's because when you click on an <a> link, the URL in the HREF *will* be invoked, thus cancelling out any onclick work you do. *UNLESS* you suppress the default action of the <a> tag.

    Which happens to be easy:
    Code:
    <a href="navPageTest2.aspx" onclick="getClickedValue4();return false;">Myaccount_link_ex</a>
    Just add that return false to each onclick. Presto.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,549
    Thanks
    80
    Thanked 4,617 Times in 4,581 Posts
    May I simplify your code?

    (1) Instead of 4 separate functions, one function where the value passed to the function determines the actions.
    (2) Have the function do the return false.
    (3) Have the onclick then return the result of calling that function, which will of course be false.
    (4) No reason to use a REAL URL for the HREF, since you aren't ever going to allow that HREF to be used.
    (5) No reason to use runat="server"

    Code:
    <script language="javascript" type="text/javascript">
    function getCheckedValue(value)
    {
        document.getElementById("presentationsNavBars").style.display = 
            value == 1 ? 'block' : 'none';
        document.getElementById("proposalsNavBars").style.display = 
            value == 2 ? 'block' : 'none';
        document.getElementById("postingsNavBars").style.display = 
            value == 3 ? 'block' : 'none';
        document.getElementById("myaccountNavBars").style.display = 
            value == 4 ? 'block' : 'none';
        return false;
    }
    </script>
    ...
    <a href="#" onclick="return getClickedValue(1);">Presentations_link_ex</a>
    <a href="#" onclick="return getClickedValue(2);">Proposals_link_ex</a><br />
    <a href="#" onclick="return getClickedValue(3);">Postings_link_ex</a><br />
    <a href="#" onclick="return getClickedValue(4);">Myaccount_link_ex</a><br />
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    robuc (01-27-2012)

  • #4
    New Coder
    Join Date
    Jan 2012
    Posts
    17
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Cool

    Thanks for all the help Old Pedant... i really appreciate it!!!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •