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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16

Thread: Newbie kinda

  1. #1
    New Coder
    Join Date
    Mar 2008
    Location
    Australia
    Posts
    36
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Newbie kinda

    Ok I think I'm on the right track but can get this working (yet again I could be way off lol)

    What I have is a page with jQuery Tabs and on one of these Tabs I have a Questionnaire and at the end of the quiz they click an ok button and then I want them redirected.

    Code I have (which works):
    Code:
    alert(answerText);
    window.location="elearn.htm";
    But I need it to go to the id="learntab"

    This is what I tried and it didn't work:
    Code:
    alert(answerText);
    window.location="document.getElementById('learntab').click()";
    Also thanks in advance... Cheers

  • #2
    Regular Coder low tech's Avatar
    Join Date
    Dec 2009
    Posts
    852
    Thanks
    173
    Thanked 94 Times in 94 Posts
    Hi doogie73

    I'm not sure what you mean exactly.

    LT
    "The greatest revenge is to accomplish what others say you cannot do."
    ~ Unknown

    I used to be indecisive, but now I'm not so sure.

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,701
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    I understand that you want to activate a different tab on the same page by clicking the button? If that’s the case, and the jQuery plugin is written properly there should be a method to do that in that script. But you need to give us more info/code. What’s the tab script you are using?

  • #4
    New Coder
    Join Date
    Mar 2008
    Location
    Australia
    Posts
    36
    Thanks
    5
    Thanked 0 Times in 0 Posts
    OK thanks guys yes I probably didn't explain it that well... I've removed the button and trying to just work with jQuery TABS.

    The current issue seems to be the fact I want to swap between two pages the both have jQuery Tabs; The PAGE1 TAB code:
    Code:
    <ul class="tabs">
                      <li id="introtab"><a href="#tab1">&raquo;</a></li>
                      <li id="anatomytab"><a href="#tab2">Anatomy</a></li>
                      <li id="swallowtab"><a href="#tab3">Unit 1</a></li>
                      <li id="screeningtab"><a href="#tab4">Screening Tool</a></li>
                      <li><a href="learnsup.htm">Learning Supplement</a></li>
                       <li id="helptab"><a href="#tab6">Help</a></li>
                      <li id="atoztab"><a href="#tab7">A to Z</a></li>
                    </ul>
    And the Code for the TABS on PAGE2:
    Code:
    <ul class="tabs">
                      <li id="hometab"><a href="dysphagia-elearn.htm">&raquo; e-Learning home</a></li>
                      <li id="learntab"><a href="#tab2">Learning Supplement</a></li>
                      <li id="selfassesstab"><a href="#tab3">Self Assessment</a></li>           
                    </ul>
    So for the above I need is TAB 5 on Page1 to link to Page2 and then TAB 1 on Page2 to link to Page1. For some reason because they are in jQuery Tabs they are ignoring links to other pages and trying to find a tab???

    For both pages I'm linking to Standard jQuery script. And the TABs are all working fine.

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,701
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    OK, that’s clear now but there is no way to help you if you don’t tell us what the tab script is called and/or post or link to that code?

  • #6
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    i think its like this (assuming you are using jquery ui tabs)

    Code:
    $("#tabs").tabs("select", "#sample-tab-1");

  • Users who have thanked DanInMa for this post:

    doogie73 (07-26-2013)

  • #7
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    If you are using jQuery UI Tabs, are you using the new one or the old one? They completely rewrote the API of all the jQuery UI widgets starting version 1.9. Version 1.8 has the old API.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #8
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    really tough to help when people dont provide feedback...

  • #9
    New Coder
    Join Date
    Mar 2008
    Location
    Australia
    Posts
    36
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Hi guys, and sorry for the lack of reply my Boss is on 4 weeks stress leave and I'm currently doing 3 jobs pffft.... Anyway enough of my issues and back to the code.


    Ok the overall jQuery we are pointing to are /js/jquery-1.4.2.min.js and /js/jquery-ui.min.js

    And on the page is:

    Code:
    	$(".tab_content").hide(); //Hide all content
    	$("ul.tabs li:first").addClass("active").show(); //Activate first tab
    	$(".tab_content:first").show(); //Show first tab content
    	
    	//On Click Event
    	$("ul.tabs li").click(function() {
    		$("ul.tabs li").removeClass("active"); //Remove any "active" class
    		$(this).addClass("active"); //Add "active" class to selected tab
    		$(".tab_content").hide(); //Hide all tab content
    		var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
    		$(activeTab).fadeIn(); //Fade in the active content
    		return false;
    	});
     if (jQuery.browser.msie) {
            try { 
                document.execCommand("BackgroundImageCache", false, true); 
            } catch(err) {}
        }
    
    })
    Hope this help you to help me lol

    Cheers
    Dougie (Aussie)

  • #10
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,701
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Oh wow, what an ancient script (about three years old). Where did you get that? We’re currently at version 1.10, or 2.0, respectively (if you don’t care about IE < 9).

    OK, you just have to know the right keywords to search for, and I found something online which appears to work with the latest jQuery & UI after I modified it a little:
    Code:
    <div id="tabs">
      <ul>
        <li><a href="#tabs-1">First</a></li>
        <li><a href="#tabs-2">Second</a></li>
        <li><a href="#tabs-3">3rd</a></li>
          <li class="last"><a href="http://example.com">Learn more...</a></li>
      </ul>
      <div id="tabs-1">
        Tab panel 1
      </div>
      <div id="tabs-2">
        Tab panel 2  
      </div>
      <div id="tabs-3">
        Tab panel 3
      </div>
    </div>
    PHP Code:
    $("#tabs").tabs();
    $(
    "li.last a").unbind('click'); 

  • #11
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    much older versions are still available from jquery.com and are still available via cdn actually.

  • #12
    Senior Coder jerry62704's Avatar
    Join Date
    Oct 2007
    Location
    Springfield, IL
    Posts
    1,100
    Thanks
    13
    Thanked 87 Times in 87 Posts
    Quote Originally Posted by doogie73 View Post
    Ok I think I'm on the right track but can get this working (yet again I could be way off lol)

    What I have is a page with jQuery Tabs and on one of these Tabs I have a Questionnaire and at the end of the quiz they click an ok button and then I want them redirected.

    Code I have (which works):
    Code:
    alert(answerText);
    window.location="elearn.htm";
    But I need it to go to the id="learntab"

    This is what I tried and it didn't work:
    Code:
    alert(answerText);
    window.location="document.getElementById('learntab').click()";
    Also thanks in advance... Cheers
    document.getElementById('myAnchor').focus();
    assuming you have <div id="myAnchor">.
    .
    .
    ...and gladly would he learn and gladly teach

    Visit www.LiberalsWin.com for humor and the unique Bush/Obama Approval Polls

  • Users who have thanked jerry62704 for this post:

    doogie73 (07-30-2013)

  • #13
    New Coder
    Join Date
    Mar 2008
    Location
    Australia
    Posts
    36
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Still not working

    Quote Originally Posted by VIPStephan View Post
    Oh wow, what an ancient script (about three years old). Where did you get that? We’re currently at version 1.10, or 2.0, respectively (if you don’t care about IE < 9).

    OK, you just have to know the right keywords to search for, and I found something online which appears to work with the latest jQuery & UI after I modified it a little:
    Code:
    <div id="tabs">
      <ul>
        <li><a href="#tabs-1">First</a></li>
        <li><a href="#tabs-2">Second</a></li>
        <li><a href="#tabs-3">3rd</a></li>
          <li class="last"><a href="http://example.com">Learn more...</a></li>
      </ul>
      <div id="tabs-1">
        Tab panel 1
      </div>
      <div id="tabs-2">
        Tab panel 2  
      </div>
      <div id="tabs-3">
        Tab panel 3
      </div>
    </div>
    PHP Code:
    $("#tabs").tabs();
    $(
    "li.last a").unbind('click'); 
    Hi and thanks for your help VIPStephan I think your option was close but I'm still not getting the "Learning Tab" to go to another page. This is what I tried and it didn't work.

    HTML CODE:
    Code:
     <ul class="tabs">
                      <li id="introtab"><a href="#tab1">&raquo;</a></li>
                      <li id="anatomytab"><a href="#tab2">Anatomy</a></li>
                      <li id="swallowtab"><a href="#tab3">Swallowing</a></li>
                      <li id="screeningtab"><a href="#tab4">Dysphagia Screening Tool</a></li>
                      <li class="newwindow"><a href="learnsup.htm">Learning Supplement</a></li>
                       <li id="helptab"><a href="#tab6">Helpful Links</a></li>
                      <li id="atoztab"><a href="#tab7">A to Z</a></li>
                    </ul>
    Javascript CODE:
    Code:
    $("ul.tabs li").click(function() {
    		$("ul.tabs").tabs();
    		$("li.newwindow a").unbind('click');
    })
    So frustrating that a simple link to another page is so hard lol

    Also FYI the moment it was close I put it into this code which sits at the top of the page:
    Code:
    	//On Click Event
    	$("ul.tabs li").click(function() {
    		$("ul.tabs li").removeClass("active"); //Remove any "active" class
    		$(this).addClass("active"); //Add "active" class to selected tab
    		$(".tab_content").hide(); //Hide all tab content
    		$("ul.tabs").tabs();
    		$("li.newwindow a").unbind('click');
    		var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
    		$(activeTab).fadeIn(); //Fade in the active content
    		return false;
    	});
     if (jQuery.browser.msie) {
            try { 
                document.execCommand("BackgroundImageCache", false, true); 
            } catch(err) {}
        }
    
    })
    It seemed to unbind but only from the CSS and not jump to another .htm page like I need??

  • #14
    New Coder
    Join Date
    Mar 2008
    Location
    Australia
    Posts
    36
    Thanks
    5
    Thanked 0 Times in 0 Posts
    I also gave this a try:

    Javascript Code:
    Code:
    $("#externallink").tabs({
        active: false,
        collapsible: true,
        beforeActivate: function (event, ui) {
            window.open($(ui.newTab).find('a').attr('href'), '_self');
            return false;
        }
    });
    HTML CODE:
    Code:
    <ul id="externallink" class="tabs">
                      <li id="introtab"><a href="#tab1">&raquo;</a></li>
                      <li id="anatomytab"><a href="#tab2">Anatomy</a></li>
                      <li id="swallowtab"><a href="#tab3">Swallowing</a></li>
                      <li id="screeningtab"><a href="#tab4">Dysphagia Screening Tool</a></li>
                      <li class="newwindow"><a href="learnsup.htm">Learning Supplement</a></li>
                       <li id="helptab"><a href="#tab6">Helpful Links</a></li>
                      <li id="atoztab"><a href="#tab7">A to Z</a></li>
                    </ul>
    And NO it didn't work either

  • #15
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    You seem to be using the latest jQuery UI 1.10 or 1.9. Those require jQuery 1.6+. You are only using 1.4.2.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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