Page 1 of 2 12 LastLast
Results 1 to 10 of 16

Thread: Can someone check this JS and tell me why it isn't quite working (almost)?

  1. #1
    Join Date
    Nov 2004
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Can someone check this JS and tell me why it isn't quite working (almost)?

    I know very little about JavaScript but I found this snippit and I am trying to use it. I have 2 probelms - first, how to get all of the answers to be hidden on default (they currently display on default) and second how to make the view all work but in link form not checkbox (it is currently in checkbox form but does not work and I can't figure out why).

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script language="JavaScript">
                    window.onload = onLoad;
    
                    function onLoad()
                    {
                        var sa = document.getElementById("chkViewAll");
                        if(typeof(IsPrinterFriendly) == "undefined") sa.checked = false;
                        else sa.checked = true;
                    }
    
                  
    
                    function toggleQuestions(checked)
                    {
                        var secCount = 5;
                        var faqEntryCount = 37;
                        for(var j=1; j<=secCount; j++)
                        {
                            for (var i=1; i<=faqEntryCount; i++)
                            {
    	                        var title = document.getElementById("title" + j + i);
                                if(checked == true)
                                    expandQuestion("title" + j + i, "question" + j +i, "answer" + j + i);
                                else
                                    collapseQuestion("title" + j + i, "question" + j +i, "answer" + j + i);
                            }
                        }
                        if(checked == false)
                        {
                          var sa = document.getElementById("chkViewAll");
    	                    sa.checked = false;
                        }
                    }
    
                    function toggleQuestion(tName, qName, aName)
                    {
                        var title = document.getElementById(tName);
                        if (title == null) return;
                        var ans = document.getElementById(aName);
                        if (ans == null) return;
                        var que = document.getElementById(qName);
                        if (ans.style.display == '')
                        {
                          if (que != null) que.style.display = 'none';
    
    
    	                    ans.style.display = 'none';
    	                    var sa = document.getElementById("chkViewAll");
    	                    sa.checked = false;
                        }
                        else
                        {
                            if (que != null) que.style.display = '';
    	                    ans.style.display = '';
                        }
                    }
    
                    function expandQuestion(tName, qName, aName)
                    {
                        var title = document.getElementById(tName);
                        if (title == null) return;
                        var ans = document.getElementById(aName);
                        if (ans == null) return;
                        var que = document.getElementById(qName);
                        if (que != null) que.style.display = '';
                        ans.style.display = '';
                    }
    
                    function collapseQuestion(tName, qName, aName)
                    {
                        var title = document.getElementById(tName);
                        if (title == null) return;
                        var ans = document.getElementById(aName);
                        if (ans == null) return;
                        var que = document.getElementById(qName);
                        if (que != null) que.style.display = 'none';
                        ans.style.display = 'none';
                    }
    </script>
    </head>
    <body>
    <script language="Javascript">
          document.write('<div id="selectAll" style="margin-top:10px;"><table cellpadding="0" cellspacing="0" border="0"><tr><td align="right"><input id="chkViewAll" type="checkbox" onclick="toggleAll()"></td><td class="selectAll">View all answers</td></tr></table></div>');
        </script>	
    <div id="title10" class="body"><a href="javascript:toggleQuestion('title10', 'question10', 'answer10')">Question 1?</a></div>
    <div id="answer10" class="body">Answer 1.</div>
    <div id="title11" class="body"><a href="javascript:toggleQuestion('title11', 'question11', 'answer11')">Question 2?</a></div>
    <div id="answer11" class="body">Answer 2.</div>
    <div id="title12" class="body"><a href="javascript:toggleQuestion('title12', 'question12', 'answer12')">Question 3?</a></div>
    <div id="answer12" class="body">Answer 3</div>	
    </body>
    </html>
    Thanks in advance for any help!

  2. #2
    Join Date
    Sep 2004
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    well i see the prob with the check box.

    <input id="chkViewAll" type="checkbox" onclick="toggleAll()">

    you call the function toggleAll() but there is no toggleAll() function, so thats why that is not working

    ummm.... i'm looking over the rest of it right now, hope i can help you out, i'm new at JS too, lol

  3. #3
    Join Date
    Nov 2004
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    doh! I'm obviously an idiot. Here goes another shot:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script language="JavaScript">
                    window.onload = onLoad;
    
                    function onLoad()
                    {
                        var sa = document.getElementById("chkViewAll");
                        if(typeof(IsPrinterFriendly) == "undefined") sa.checked = false;
                        else sa.checked = true;
                    }
    
                    function toggleAll()
                    {
                        var sa = document.getElementById("chkViewAll");
                        var ch = sa.checked;
                        toggleQuestions(ch);
                    }
                  
                    function toggleQuestions(checked)
                    {
                        var secCount = 5;
                        var faqEntryCount = 37;
                        for(var j=1; j<=secCount; j++)
                        {
                            for (var i=1; i<=faqEntryCount; i++)
                            {
    	                        var title = document.getElementById("title" + j + i);
                                if(checked == true)
                                    expandQuestion("title" + j + i, "question" + j +i, "answer" + j + i);
                                else
                                    collapseQuestion("title" + j + i, "question" + j +i, "answer" + j + i);
                            }
                        }
                        if(checked == false)
                        {
                          var sa = document.getElementById("chkViewAll");
    	                    sa.checked = false;
                        }
                    }
    
                    function toggleQuestion(tName, qName, aName)
                    {
                        var title = document.getElementById(tName);
                        if (title == null) return;
                        var ans = document.getElementById(aName);
                        if (ans == null) return;
                        var que = document.getElementById(qName);
                        if (ans.style.display == '')
                        {
                          if (que != null) que.style.display = 'none';
    
    
    	                    ans.style.display = 'none';
    	                    var sa = document.getElementById("chkViewAll");
    	                    sa.checked = false;
                        }
                        else
                        {
                            if (que != null) que.style.display = '';
    	                    ans.style.display = '';
                        }
                    }
    
                    function expandQuestion(tName, qName, aName)
                    {
                        var title = document.getElementById(tName);
                        if (title == null) return;
                        var ans = document.getElementById(aName);
                        if (ans == null) return;
                        var que = document.getElementById(qName);
                        if (que != null) que.style.display = '';
                        ans.style.display = '';
                    }
    
                    function collapseQuestion(tName, qName, aName)
                    {
                        var title = document.getElementById(tName);
                        if (title == null) return;
                        var ans = document.getElementById(aName);
                        if (ans == null) return;
                        var que = document.getElementById(qName);
                        if (que != null) que.style.display = 'none';
                        ans.style.display = 'none';
                    }
    </script>
    </head>
    <body>
    <script language="Javascript">
          document.write('<div id="selectAll" style="margin-top:10px;"><table cellpadding="0" cellspacing="0" border="0"><tr><td align="right"><input id="chkViewAll" type="checkbox" onclick="toggleAll()"></td><td class="selectAll">View all answers</td></tr></table></div>');
        </script>	
    <div id="title11" class="body"><a href="javascript:toggleQuestion('title11', 'question11', 'answer11')">Question 1?</a></div>
    <div id="answer11" class="body">Answer 1.</div>
    <div id="title12" class="body"><a href="javascript:toggleQuestion('title12', 'question12', 'answer12')">Question 2?</a></div>
    <div id="answer12" class="body">Answer 2.</div>		
    <div id="title13" class="body"><a href="javascript:toggleQuestion('title13', 'question13', 'answer13')">Question 3?</a></div>
    <div id="answer13" class="body">Answer 3</div>		
    </body>
    </html>
    Any thoughts on how to get the answers to hide on default, and how to change the check box to a link that toggles the show all? My attempts have failed...
    Last edited by Edouble; 11-16-2004 at 06:01 AM.

  4. #4
    Join Date
    Sep 2004
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    lol, its ok

    ok now that works

    i'm still looking over and seeing how they made it, but i think i'm close on it, or maybe not at all, who knows!
    i'm new at javascript also

  5. #5
    Join Date
    Sep 2004
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    hmmm... so you only want a link? like a text link?

  6. #6
    Join Date
    Sep 2004
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    hmmm... i see what you mean

    the whole script is based on the check box, i tried a text link, and its all opposite now, it hides all instead of show all

  7. #7
    Join Date
    Sep 2004
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    well so far all i can see if you put the toggleAll() in the body like so

    <BODY OnLoad="toggleAll()">

    it hides them all, but, i'm still working on it

  8. #8
    Join Date
    Nov 2004
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    It hides them all on default?

  9. #9
    Join Date
    Sep 2004
    Posts
    66
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    yes, if you run the script that hides them when the page loads, it hides them.

    it works just as if you clicked on the check box, but it hides the answers when the page loads, instead of on default, but i'm still working on that one

  10. #10
    Join Date
    Nov 2004
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Right you are! Thanks for figuring that out (I couldn't!).

    Now I am just trying to figure out how to get this into an anchor tag (stripping out all the table stuff but making it a text link that does the same thing as the check box does).

    Code:
    <script language="Javascript">
          document.write('<div id="selectAll" style="margin-top:10px;"><table cellpadding="0" cellspacing="0" border="0"><tr><td align="right"><input id="chkViewAll" type="checkbox" onclick="toggleAll()"></td><td class="selectAll">View all answers</td></tr></table></div>');
    </script>

Bookmarks

Posting Permissions

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