Menu
Im really stuck with this one.
I have an array with 5 elements : [word1,word2,word3,word4,word5]
when the user presses a button:SHOWINFO it needs to show the 5 words with buttons next to it. like this.
BUTTON: SHOW INFO
TABLE
WORD1 | BUTTON1
WORD2 | BUTTON2
WORD3 | BUTTON3
WORD4 | BUTTON4
WORD5 | BUTTON5
I have something like
function showInfo(){
var a = new Array(word1,word2,word3,word4,word5)
var button1 = document.createElement(“button”);
button1.innerHTML = a[1];
button1.id = a[1]
var button2 = document.createElement(“button”);
button2.innerHTML = a[1];
button2.id = a[1]
div.appendChild(button1,button2)
}
for(var i=0; i<ar.length; i++) {
var divTag = document.createElement("div");
var button = document.createElement("button");
divTag.id = "div"+i;
button.id = "button"+i
divTag.setAttribute("align","left");
divTag.style.margin = "0px auto";
divTag.className ="dynamicDiv";
divTag.innerHTML = ar[i];
button.innerHTML = "Press Me";
document.body.appendChild(button);
document.body.appendChild(divTag);
} }<i>
</i>button.[color='sienna']onclick[/color] = function(){alert(this.id)};
I would go with a slightly different method that might give you more granularity. The code below is shows a separation of the information, and allows you to use any size array that you want, doesn't matter. You can take it further by passing in the array instead of hard-coding it, and well there's lots of stuff you can do here. Hope this helps:
//Create a button row class that holds the info
function ButtonRow(word) {
this.word = word;
this.a = word;
this.b = new WordButton(word).value;
this.lineval = '<div><span>' + this.a + '</span><span>' + this.b + '</span></div>'
}
//Create a button maker
function WordButton(word) {
this.value = '<button onclick="alert('' + word + '');" > click</button>';
}
//iterate over your array and you get your name/button pairings.
function buildButtons() {
var a = new Array("Bill", "Bob", "Hal", "Carl", "Lenny")
for(var i=0; i<a.length;i++){
var btn = new ButtonRow(a[i]);
document.write(btn.lineval);
}
}
Finally, here's the stuff on for the HTML
<div>
<button onclick="buildButtons();">BUILD</button>
</div>[/QUOTE]
[CODE]<html>
<head>
<script type="text/javascript" src="showButtonsScript.js"></script>
</head>
<body>
<input type=button value=press me onclick = showButtons()>
<div id = "buttonsDiv"</div>
</body>
</html>[/CODE][CODE]
function showButtons(){
var ar = new Array ()
ar = ["one","two","three","four","five"];
alert(ar);
createButtons(ar);
}
function createButtons(ar){
for(var i=1; i<ar.length; i++) {
var spanTag = document.createElement("span");
spanTag.setAttribute("align","left");
spanTag.style.margin = "0px auto";
spanTag.className ="dynamicDiv";
spanTag.innerHTML = ar[i];
spanTag.id = "span"+i;
var button = document.createElement("button");
button.id = ar[i];
button.innerHTML = "Press Me";
button.onclick = function(){alert(this.id)};
document.getElementById("buttonsDiv").appendChild(button);
document.getElementById("buttonsDiv").appendChild(spanTag);
}
}
[/CODE]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>DOM</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function showButtons(){
var ar = ["one","two","three","four","five"];
alert(ar);
createButtons(ar);
}
function createButtons(ar){
for(var i=1; i<ar.length; i++) {
var labelTag = document.createElement("label");
labelTag.className ="dynamicDiv";
labelTag.setAttribute('for', ar[i]);
<i> </i> var button = document.createElement("button");
<i> </i> button.setAttribute('type', 'button');
<i> </i> button.id = ar[i];
<i> </i> button.appendChild(document.createTextNode('Press Me'));
<i> </i> button.onclick = function(){alert(this.id)};
<i> </i> document.getElementById("buttonsDiv").appendChild(labelTag);
<i> </i> labelTag.appendChild(button);
<i> </i> labelTag.appendChild(document.createTextNode(ar[i]));
<i> </i>}
}
</script>
<style type="text/css">
label {display:block;}
</style>
</head>
<body>
<div>
<input type="button" value="press me" onclick="showButtons();">
</div>
<div id="buttonsDiv"></div>
</body>
</html>
[CODE]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>DOM</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function showButtons(){
var ar = ["one","two","three","four","five"];
test(ar);
}
function test(ar){
for(var i=0; i<ar.length; i++){
var table = document.createElement("table");
var tr = table.insertRow(0);
var td = tr.insertCell(0);
td.innerHTML = ar[i];
td = tr.insertCell(1);
var button = document.createElement("button");
button.id = ar[i];
button.appendChild(document.createTextNode('Press Me'));
button.onclick = function(){alert(this.id)};
td.appendChild(button);
document.getElementById("buttonsDiv").appendChild(table);
}
}
</script>
</head>
<body>
<div>
<input type="button" value="press me" onclick="showButtons();">
</div>
[/CODE]function createButtons(ar){
for(var i=1; i<ar.length; i++) {
var divTag = document.createElement("div");
divTag.className ="dynamicDiv";
<i> </i> var button = document.createElement("button");
<i> </i> button.setAttribute('type', 'button');
<i> </i> button.id = ar[i];
<i> </i> button.appendChild(document.createTextNode('Press Me'));
<i> </i> button.onclick = function(){alert(this.id)};
<i> </i> document.getElementById("buttonsDiv").appendChild(divTag);
<i> </i> divTag.appendChild(button);
<i> </i> divTag.appendChild(document.createTextNode(ar[i]));
<i> </i>}
}
var surf = document.evaluate(surfTable, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
var container = document.createElement('div');
container.appendChild(document.createElement('br'));
container.appendChild(document.createElement('br'));
container.appendChild(document.createElement('br'));
var button = document.createElement('button');
button.innerHTML = basla;
button.addEventListener('click', processLink, false);
container.appendChild(button);
var clear = document.createElement('button');
clear.innerHTML = temizle;
clear.addEventListener('click', clearDebug , false);
container.appendChild(clear);
//var dilsec = document.createE
var ver = document.createElement('button');
ver.innerHTML = versiyon;
ver.setAttribute('disabled', 'disabled');
container.appendChild(ver);
container.appendChild(document.createElement('br'));
var progress = document.createElement('textarea');
progress.style.width = "100%";
progress.style.height = "20em";
progress.setAttribute('readonly', 'true');
container.appendChild(progress);
surf.parentNode.insertBefore(container, surf);
startSurf();var strike = document.createElement('strike');
strike.innerHTML = currentElement.innerHTML;
currentElement.parentNode.replaceChild(strike, currentElement);
setTimeout(function(){
currentWindow.close();
processLink();
}, 2000);//currentWindow.onLoad.apply(currentWindow,[]);
watcher = setInterval(function(){
var frames = currentWindow.document.getElementsByName('success');
var frame = frames[0];
debug(kontrol + frame.contentWindow.location.href);
if(frame.contentWindow.location.href.match(basari))
{
adwatchDone();
clearInterval(watcher);
}
}, 5000);
currentWindow.currentElement = currentElement;if(element){
debug(aciliyor + element.href);
currentElement = element;
var url = element.getAttribute('href');
currentWindow = window.open(url);
currentWindow.addEventListener('DOMContentLoaded', watchLocation, false);
debug(bekleniyor);
}else{
yenile(sure);
}var links2= document.evaluate(linksx2, document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
for(var i=0;i<links2.snapshotLength;i++){
var item = links2.snapshotItem(i);
//Anti Anti Cheat
if (aac(item) && filtre(item)){work.push(item);}
}
for(var i=0;i<links.snapshotLength;i++){
var item = links.snapshotItem(i);
//Anti Anti Cheat
if (aac(item) && filtre(item)){work.push(item);}
}
return work;var kon1=new RegExp(kont1);
var kon2=new RegExp(kont2);
var kon3=new RegExp(kont3);
var k1=kon1.test(baglanti);
var k2=kon2.test(baglanti);
var k3=kon3.test(baglanti);
if (k1 && k2 && k3){return true;}
else {return false;}0.1.9 — BETA 5.20