We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now

x

JavaScript Array() Getting Prev/Next

interclubs
interclubs asked
on
Medium Priority
1,663 Views
Last Modified: 2012-06-27
So I have a large array that looks like this:
PhotoList[89725] = new Array();
PhotoList[89725]['ImageID'] = '89725';
PhotoList[89725]['ImageSize'] = '123';
PhotoList[89726] = new Array();
PhotoList[89726]['ImageID'] = '89726';
PhotoList[89726]['ImageSize'] = '234';
PhotoList[89727] = new Array();
PhotoList[89727]['ImageID'] = '89727';
PhotoList[89727]['ImageSize'] = '345';
Etc....

And what I want to do, is to be able to call a function, that when I pass it an id, it gives me the data before it, and after it.

So I would have something that looks like this:

<div id="current">Showing You ID: 89726</div>
<a href="#" onclick="GetPrev(89726);">Get Prev</a>
<a href="#" onclick="GetNext(89726);">Get Next</a>

And then when I click on the Next/Prev it updates the current div. I guess it would also have to update the prev/next links with the new IDs as well. If there is no prev/next it would just say 'no more data to display' or  something...
PhotoList[89725] = new Array(); 
PhotoList[89725]['ImageID'] = '89725'; 
PhotoList[89725]['ImageSize'] = '123';
PhotoList[89726] = new Array(); 
PhotoList[89726]['ImageID'] = '89726'; 
PhotoList[89726]['ImageSize'] = '234';
PhotoList[89727] = new Array(); 
PhotoList[89727]['ImageID'] = '89727'; 
PhotoList[89727]['ImageSize'] = '345';

Open in new window

Comment
Watch Question

Top Expert 2007

Commented:
Something like:


<script type="text/javascript">
 
function go(mode) {
	var cur = document.getElementById('current'),
	    cid = cur.innerHTML,
	    pid = 'Get Prev';
	    nid = 'Get Next';
	
	cid = cid.substr(cid.indexOf(':') + 16);
	
	if (mode === 'p') {
		if (cid > 1) {
			cid -= 1;
		}
		if (cid === 1) {
			pid = 'No previous data';
		}
	}
	else {
		if (id < 1000) {
			cid += 1;
		}
		if (cid === 1000) {
			nid = 'No more data';
		}
	}
	cur.innerHTML = 'Showing you ID: ' + cid;
	document.getElementById('a_prev').innerHTML = pid;
	document.getElementById('a_next').innerHTML = nid;
}
</script>
 
<body>
<div id="current">Showing You ID: 89726</div>
<a id="a_prev" href="#" onclick="go('p');">Get Prev</a>
<a id="a_next" href="#" onclick="go('n');">Get Next</a>
</body>

Open in new window

Unlock this solution with a free trial preview.
(No credit card required)
Get Preview
Top Expert 2007

Commented:
mudbuggle:
The Asker said, "I guess it would also have to update the prev/next links with the new IDs as well. If there is no prev/next it would just say 'no more data to display' or  something..."

What happens in your code when the previous number is less than 1? Greater than 1000 (or the number of records, or the count of the stars in our galaxy)?

Author

Commented:
I guess I should have said that the IDs are sequential, so we actually need to look them up in the array....
my apologies... I must have been out of it this morning... this is the second question where I've completely missed the point... not my day i guess...

Author

Commented:
I meant to say, the IDs are NOT sequential.... Guess I was out of it as well.
Top Expert 2007

Commented:
As long as the items themselves are in numerical order, returning the sequence of the image ID is not an issue.

The snippet below shows such a scenario:


PhotoList[89725] = new Array();
PhotoList[89725]['ImageID'] = '89725';
PhotoList[89725]['ImageSize'] = '123';
PhotoList[89726] = new Array();
PhotoList[89726]['ImageID'] = '97268';
PhotoList[89726]['ImageSize'] = '234';
PhotoList[89727] = new Array();
PhotoList[89727]['ImageID'] = '72789';
PhotoList[89727]['ImageSize'] = '345';

Open in new window

Top Expert 2007

Commented:
But really, you should clean up your JavaScript.

Do you really want  a separate array for EACH IMAGE? I don't think so. I would use an object for the details, as well (see the following snippet). Then you can easily get the properties for each image like this:

alert('image id# = ' + PhotoList[89726].ImageID + ', size = ' + PhotoList[89726].ImageSize);

Something like this:


var PhotoList = [];
 
PhotoList[89725] = {'ImageID':'89725', 'ImageSize':'123'};
PhotoList[89726] = {'ImageID':'97258', 'ImageSize':'234'};
PhotoList[89727] = {'ImageID':'72589', 'ImageSize':'345'};

Open in new window

Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a free trial preview!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.