Skip to main content

Javascript Question

  • In my first and previous post in this game dev log entry, I had written that I wanted to do a game which was a collection of simple retro games. Unity released a new major release (2019.3) while I was putting the initial project together, and I…

  • Well, I'm making a game . I'm spending the next few weeks on making a small game to showcase the gamedev log feature on tsumea where any member can create a game entry and other members can post journal posts with art, music or just development…

  • Just a test #2. Still working on the new section.

  • So, I got a Commodore 64 when I was in the 4th grade. It came bundled with a Rolf Harris picture building program on casette tape which never loaded properly but from what I could tell by its box cover, you could build pictures from a selection…

  • Yes, the site looks very different and I've had to prematurely switch to this new theme that I'm working on for a few reasons, the main one is that changing certain aspects of the site to fit the new theme will affect how the old one looks for…

  • (this is just a test, please ignore this entry)

    Here is some of my old work.. the first pic is of a 3d model of a human head I was working on about 2 years ago in 3dsmax, using nurbs. If I had to do it again, I wouldn't model a head with…

I currently work for

Submitted by souri on

Ok, I have a javascript question! This is the code I use for prototype to make a xmlhtml request and put the output in the content div. How do I go about putting more of these on one page (e.g another div called content2 with a set of links to call data there)? Would I have to duplicate var tabs, function getTabData(id), rename them and their references?

[code]

function init () {
var tabs = document.getElementsByClassName('tabs');
for (var i = 0; i < tabs.length; i++) {
$(tabs[i].id).onclick = function () {
getTabData(this.id);
}
}
}
function getTabData(id) {
var url = 'js/ajax_memberlist.asp';
var rand = Math.random(9999);
var pars = 'id=' + id + '&rand=' + rand;
var myAjax = new Ajax.Request( url, {method: 'get', parameters: pars, onLoading: showLoad, onComplete: showResponse} );
}
function showLoad () {
$('load').style.display = 'block';
}
function showResponse (originalRequest) {
var newData = originalRequest.responseText;
$('load').style.display = 'none';
$('content').innerHTML = newData;
}

Getting data...
Recent Posters

[/code]

Also, is there a way to make links in the content div to show whatever is linked in the content div again?

Submitted by redwyre on Mon, 18/09/06 - 12:46 PMPermalink

There is a good set of docs here, a direct link to the request stuff: http://www.sergiopereira.com/articles/prototype.js.html#UsingAjaxRequest

I think you want both the global handlers, and use the Updater class instead.

The global handler will replace those "$('load')." lines:
[code]

var myGlobalHandlers = {
onCreate: function(){
Element.show('load');
},

onComplete: function() {
if(Ajax.activeRequestCount == 0){
Element.hide('load');
}
}
};

Ajax.Responders.register(myGlobalHandlers);

[/code]

For the content stuff you could use something like this (btw, you don't need the random number on the end if the data doesn't change regularly):
[code]

function init ()
{
var tabs = document.getElementsByClassName('tabs');
for (var i = 0; i < tabs.length; i++)
{
$(tabs[i].id).onclick = function () {
getTabData(this.id, 'content');
}
}
}

function getTabData(id, destElemName)
{
var url = 'js/ajax_memberlist.asp';
var pars = 'id=' + id;

var myAjax = new Ajax.Updater(
destElemName,
url,
{
method: 'get',
parameters: pars
});
}

[/code]

Posted by souri on

Ok, I have a javascript question! This is the code I use for prototype to make a xmlhtml request and put the output in the content div. How do I go about putting more of these on one page (e.g another div called content2 with a set of links to call data there)? Would I have to duplicate var tabs, function getTabData(id), rename them and their references?

[code]

function init () {
var tabs = document.getElementsByClassName('tabs');
for (var i = 0; i < tabs.length; i++) {
$(tabs[i].id).onclick = function () {
getTabData(this.id);
}
}
}
function getTabData(id) {
var url = 'js/ajax_memberlist.asp';
var rand = Math.random(9999);
var pars = 'id=' + id + '&rand=' + rand;
var myAjax = new Ajax.Request( url, {method: 'get', parameters: pars, onLoading: showLoad, onComplete: showResponse} );
}
function showLoad () {
$('load').style.display = 'block';
}
function showResponse (originalRequest) {
var newData = originalRequest.responseText;
$('load').style.display = 'none';
$('content').innerHTML = newData;
}

Getting data...
Recent Posters

[/code]

Also, is there a way to make links in the content div to show whatever is linked in the content div again?


Submitted by redwyre on Mon, 18/09/06 - 12:46 PMPermalink

There is a good set of docs here, a direct link to the request stuff: http://www.sergiopereira.com/articles/prototype.js.html#UsingAjaxRequest

I think you want both the global handlers, and use the Updater class instead.

The global handler will replace those "$('load')." lines:
[code]

var myGlobalHandlers = {
onCreate: function(){
Element.show('load');
},

onComplete: function() {
if(Ajax.activeRequestCount == 0){
Element.hide('load');
}
}
};

Ajax.Responders.register(myGlobalHandlers);

[/code]

For the content stuff you could use something like this (btw, you don't need the random number on the end if the data doesn't change regularly):
[code]

function init ()
{
var tabs = document.getElementsByClassName('tabs');
for (var i = 0; i < tabs.length; i++)
{
$(tabs[i].id).onclick = function () {
getTabData(this.id, 'content');
}
}
}

function getTabData(id, destElemName)
{
var url = 'js/ajax_memberlist.asp';
var pars = 'id=' + id;

var myAjax = new Ajax.Updater(
destElemName,
url,
{
method: 'get',
parameters: pars
});
}

[/code]