PDA

View Full Version : Load ID based AjaxTab From External Page



anderz
12-17-2006, 01:19 PM
1) Script Title: AJAX Tabs Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tent/index.htm

3) Describe problem:
Im using ajax tabs on the url /agenda/index.php now the problem is i work with ID's. One of the tabs is called nightlife.php and when i call an article its nightlife.php?ID=1. Inside linking in the ajaxtabs is no problem because then i use the expandtab function, now i want to link from my index.php to the tab agenda/nightlife.php?ID=1.
I already use this script


function linkjax(h, a, n)
{
ajaxpage(h,a,document.getElementById('maintab').getElementsByTagName('li')[n].firstChild);
}

<a href="agenda/index.php?sel=1">Link</a>


To load any tab of the ajaxtabscontent

Now somehow its got to be:

<a href="agenda/index.php?sel=1&ID=1">Link</a>

Is this possible? Have anyone expierince doing this? Tell me pleace.

Thanks! Anderz

jscheuer1
12-17-2006, 07:46 PM
<a href="agenda/index.php?sel=1&ID=1">Link</a>

That's valid and will pass two queries to index.php - is that what you want?

I remember the linkjax function, I think I wrote it. If it needs other code to parse the URL for its query (its 'n' parameter), adding another query could break that, depending upon how that is being done (there are ways to do it that will work). The code in your post doesn't show this part at all, so I'm not sure if this is even an issue.

Another potential problem would be if you were trying to pass a URL with its own query string as part of a query string of another page. This too can be done but, I'm thinking this is not what you are asking.

I'm thinking that you may just want to pass a second parameter all the way through to the new page whose content is being loaded via Ajax. If this is the case, can't the URL of the page you are loading be there already, with its query string, in the li on the 'top' page that your sel= query is activating?

In short, I'm not sure what the problem is, could you be more specific, provide a link, show all of the code?

anderz
12-17-2006, 08:35 PM
That's valid and will pass two queries to index.php - is that what you want?

I remember the linkjax function, I think I wrote it. If it needs other code to parse the URL for its query (its 'n' parameter), adding another query could break that, depending upon how that is being done (there are ways to do it that will work). The code in your post doesn't show this part at all, so I'm not sure if this is even an issue.

Another potential problem would be if you were trying to pass a URL with its own query string as part of a query string of another page. This too can be done but, I'm thinking this is not what you are asking.

I'm thinking that you may just want to pass a second parameter all the way through to the new page whose content is being loaded via Ajax. If this is the case, can't the URL of the page you are loading be there already, with its query string, in the li on the 'top' page that your sel= query is activating?

In short, I'm not sure what the problem is, could you be more specific, provide a link, show all of the code?

Thank you for your quick response. i posted some code here and explained a little what i mean.



[INDEX.PHP] [NO TABS!]

<script type="text/javascript">
startajaxtabs("maintab")
function linkjax(h, a, n){
ajaxpage(h,a,document.getElementById('maintab').getElementsByTagName('li')[n].firstChild);
}
</script>

<div align="center">
Klik <a href="javascript:linkjax('nightlife.php?sel=1&ID=1', 'ajaxcontentarea', 1)">hier</a>
</div>


[AGENDA/INDEX.PHP] [TAB 0]

<ul id="maintab" class="shadetabs">
<li class="selected"><a href="#default" rel="ajaxcontentarea"><img src="images/2do2day.jpg" /></a></li>
<li><a href="agenda/nightlife.php" rel="ajaxcontentarea"><img src="images/nightlife.jpg" /></a></li>
<li><a href="agenda/events.php" rel="ajaxcontentarea"><img src="images/events.jpg" /></a></li>
<li><a href="agenda/expos.php" rel="ajaxcontentarea"><img src="images/expos.jpg" /></a></li>
<li><a href="agenda/theater.php" rel="ajaxcontentarea"><img src="images/theater.jpg" /></a></li>
<li><a href="agenda/muziek.php" rel="ajaxcontentarea"><img src="images/muziek.jpg" /></a></li>
<li><a href="agenda/filmhuis.php" rel="ajaxcontentarea"><img src="images/filmhuis.jpg" /></a></li>
<li><a href="agenda/bios.php" rel="ajaxcontentarea"><img src="images/bios.jpg" /></a></li>
</ul>

[AGENDA/NIGHTLIFE.PHP] [TAB 1] & [AGENDA/INDEX.PHP?SEL=1]

All articles

[AGENDA/NIGHTLIFE.PHP?ID=1] [TAB 1]

One article



I want to link from:
[INDEX.PHP]

To
[AGENDA/NIGHTLIFE.PHP?ID=1] [TAB 1]
One article

--------------------------------------------

I think the link must be something like this:
<a href="javascript:linkjax('nightlife.php?sel=1&ID=1', 'ajaxcontentarea', 1)">hier</a>
But I donít know how to do it with javascript there must be a new function that can get and link to the sel (selected tab) & the ID of the page on the same time.

jscheuer1
12-17-2006, 09:29 PM
Forget everything I said so far. Have a look at this (especially post #3 in the thread):

http://www.dynamicdrive.com/forums/showthread.php?t=12105

If you want to pass more than one numeric query in the process, it needs some modification. Where it has:


if(location.search!=''){
document.getElementById('maintab').getElementsByTagName('li')[0].className=''
document.getElementById('maintab').getElementsByTagName('li')[parseInt(unescape(location.search).replace(/\D/g, ''))].className="selected"
}


Use:


function get(key_str) {
var query = window.location.search.substr(1);
var pairs = query.split("&");
for(var i = 0; i < pairs.length; i++) {
var pair = pairs[i].split("=");
if(unescape(pair[0]) == key_str)
return unescape(pair[1]);
}
return null;
}
if (location.search&&get('sel')!=null&&/^\d/.test(get('sel'))){
document.getElementById('maintab').getElementsByTagName('li')[0].className=''
document.getElementById('maintab').getElementsByTagName('li')[parseInt(get('sel'))].className="selected"
}

anderz
12-18-2006, 09:08 AM
John, Thank you very much! But i need one last thing, the link with the javascript function <a href="javascript:get( ???? )">Link</a>

jscheuer1
12-18-2006, 01:53 PM
If I understand what you are trying to do, you don't need to use that here. I think that what you want is to link to a page that has Ajax Tabs on it and have a given tab get selected and executed. To make that sort of link, once these other modifications have been made to nightlife.php with Ajax Tabs on it, all you need is (on -say, index.php):


<a href="agenda/nightlife.php?sel=1">Link Text</a>

And, if you want for whatever reason to pass the page an additional query value for the server to parse using PHP, you can do it in the normal fashion:


<a href="agenda/nightlife.php?sel=1&id=1">Link Text</a>