PDA

View Full Version : Displaying information from a javascript array randomly.



max_power
07-22-2010, 07:44 AM
Hi all,

I want to display varying company information from a javascript array randomly each time the page is refreshed. My problem is that the each piece of company information must be split up into 3-4 array elements since I have set up spans in the body where the information go accordingly and as such I don't how to randomize that.

The relevant code is (I will only give two company examples as it's a long list):



<script type="text/javascript" language='javascript'>
function compInfo(comp){
var companyInfo = new Array();
if(comp == document.getElementById('test').innerHTML)
{
//insert business name here.
companyInfo[0] = 'Test';
//insert business type here.
companyInfo[1] = 'Media';
//insert street name here.
companyInfo[2] = 'Test Road.';
//insert actual opening time here.
companyInfo[3] = '5am - 10pm';
//insert actual closing time here.
companyInfo[4] = 'Christmas';
//insert contact info here.
companyInfo[5] = 'test';
//insert web address here.
companyInfo[6] = '<a href="http://www.test.com" style="color: #0092DD; text-decoration: none;">test.com</a>';
//insert image link here.
companyInfo[7] = 'images/test.jpg';
}

if(comp == document.getElementById('test1').innerHTML)
{
//insert business name here.
companyInfo [0] = 'Test1';
//insert business type here.
companyInfo [1] = 'Club';
//insert street name here.
companyInfo[2] = 'Test1 Road.';
//insert actual opening time here.
companyInfo[3] = '5am - 10pm';
//insert actual closing time here.
companyInfo[4] = 'Christmas';
//insert contact info here.
companyInfo[5] = 'test1';
//insert web address here.
companyInfo[6] = '<a href="http://www.test1.com" style="color: #0092DD; text-decoration: none;">test1.com</a>';
//insert image link here.
companyInfo[7] = 'images/test1.jpg';
}

document.getElementById('title').innerHTML =companyInfo[0];
document.getElementById('name').innerHTML = companyInfo[1];
document.getElementById('street').innerHTML = companyInfo[2];
document.getElementById('open').innerHTML = 'Open';
document.getElementById('otime').innerHTML = companyInfo[3];
document.getElementById('close').innerHTML = 'Closed'
document.getElementById('ctime').innerHTML = companyInfo[4];
document.getElementById('contact').innerHTML = 'Contact';
document.getElementById('cinfo').innerHTML = companyInfo[5];
document.getElementById('web').innerHTML = companyInfo[6];
document.getElementById('image').style.display = 'block';
document.getElementById('image').src = companyInfo[7];


}
</script>
</head>
<body>
<SPAN ID='test' onclick="compInfo(document.getElementById('test').innerHTML);"><b>Test</b></SPAN>
<SPAN ID='test1' onclick="compInfo(document.getElementById('test1').innerHTML);"><b>Test1</b></SPAN>

//info shown here:
<div style='text-overflow: ellipsis;'>
<table cellpadding='0' cellspacing='0' border='0' style='height:178px; width:185px;'>

<tr>


<td align="left" style='height:25px;'>

<b><SPAN ID='title' ></SPAN></b>
</td>

</tr>

<tr>


<td align="left" >



<SPAN ID='name' ></SPAN>

<br />


<SPAN ID='street'></SPAN>

<div style='height:8px;'>


</div>

<SPAN ID='open'></SPAN>

<br />

<SPAN ID='otime'></SPAN>

<br />

<SPAN ID='close'></SPAN>

<br />

<SPAN ID='ctime'></SPAN>

<br />

<div style='height:8px;'>


</div>

<SPAN ID='contact'></SPAN>

<br />

<SPAN ID='cinfo'></SPAN>

<SPAN ID='web'></SPAN>

<img ID='image' style='display:none;'></img>


</td>



</tr>



</table>


</div>

</body>


So essentially the process is:
1. The person clicks on the company name.
2. Relevant information from the array is shown in the div.

But what I want is that on startup, information about a random company is shown automatically. How can I achieve this?

Thanks.