...

View Full Version : Need help updating user submitted text...



Mr.
09-16-2011, 06:15 AM
What am I doing wrong here? I am trying to make it where the user can name the link whatever he/she wants.... I think it might be this part... links[i] = name.linkPosition.value; Where linkPosition is a variable. Can I do this? Or is there another way?





<div id="navBar">
<ul>
<li><a href="#" id="link0"><script>document.write(links[0]);</script></a></li>
<li><a href="#" id="link1"><script>document.write(links[1]);</script></a></li>
<li><a href="#" id="link2"><script>document.write(links[2]);</script></a></li>
<li><a href="#" id="link3"><script>document.write(links[3]);</script></a></li>
<li><a href="#" id="link4"><script>document.write(links[4]);</script></a></li>
</ul>

</div><!--end navBar -->


<form>
<label style="color: #FFF;">Change name of links! You can only change them once!</label><br />
<input type="text" class="customLink" size="15" name="link0" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>

<input type="text" class="customLink" size="15" name="link1" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>

<input type="text" class="customLink" size="15" name="link2" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>

<input type="text" class="customLink" size="15" name="link3" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>

<input type="text" class="customLink" size="15" name="link4" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>

<input type="button" onclick="replaceLinks(this.form)" value="Replace Link Names!" />
</form>





<script>

var links = new Array("home", "portfolio", "stuff", "about me", "contact");

function replaceLinks(name){

for (var i=0; i<=4; i++) {
var linkPosition = "link"+i;
links[i] = name.linkPosition.value;
changeLink(i);
}

}

function changeLink(number) {

document.getElementById("link"+number).innerHTML="<span style=\"text-transform: capitalize;\">" + links[number] + "</span>";
}
</script>


ANY HELP WOULD BE AWESOME!!!

I just replaced the functions to look like this...



function replaceLinks(name){

for (var i=0; i<=4; i++) {
links[i] = name.linker+i.value;
changeLink(i);
}

}

function changeLink(linkNumber) {

document.getElementById("link"+linkNumber).innerHTML="<span style=\"text-transform: capitalize;\">" + links[linkNumber] + "</span>";
}


Now the links are updating but I get NaN for each link.

Mr.
09-16-2011, 07:11 AM
instead of using a loop I just did this...



function replaceLinks(name){

links[0] = name.linker0.value;
changeLink(0);

links[1] = name.linker1.value;
changeLink(1);

links[2] = name.linker2.value;
changeLink(2);

links[3] = name.linker3.value;
changeLink(3);

links[4] = name.linker4.value;
changeLink(4);
}


function getLinker(){
name.linker0.value;
}

function changeLink(linkNumber) {

document.getElementById("link"+linkNumber).innerHTML="<span style=\"text-transform: capitalize;\">" + links[linkNumber] + "</span>";
}




still sucks though I couldn't figure it out... :mad:

xelawho
09-16-2011, 03:51 PM
not sure why the links were made with document write initially, or where you want them to point to, but maybe this is a start...



<!DOCTYPE html>
<html>
<head>
<title>blank</title>
<meta charset="UTF-8">
</head>
<body onload="document.forms[0].reset()">
<div id="navBar">
<ul>
<li><div id="link0"><a href="#0">Home</a></div></li>
<li><div id="link1"><a href="#1">Portfolio</a></div></li>
<li><div id="link2"><a href="#2">Stuff</a></div></li>
<li><div id="link3"><a href="#3">About me</a></div></li>
<li><div id="link4"><a href="#4">Contact</a></div></li>
</ul>
</div><!--end navBar -->
<form>
<div id="label" style="color:#FFFF">Change name of links! You can only change them once! (actually, this isn't true - if you want it that way just "uncomment" the first line of the replaceLinks function)<br />
<input type="text" class="customLink" size="15" name="link0" onblur="value=removeSpaces(this.value)" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link1" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link2" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link3" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="text" class="customLink" size="15" name="link4" onblur="this.value=removeSpaces(this.value);" maxlength="8"/>
<input type="button" onclick="replaceLinks()" value="Replace Link Names!" />
</form></div>
<script type="text/javascript">
//var links = new Array("home", "portfolio", "stuff", "about me", "contact");
var inps =[];
function removeSpaces(str){
if (str[0]==" ") {
newstr=str.replace(" ","")
} else {
newstr=str.replace(/[" "]/g,"_")
}
return newstr;
}

function replaceLinks(){
//document.getElementById('label').style.display="none";
inps.length=0;
var node_list = document.getElementsByTagName('input');
for (var i = 0; i < node_list.length; i++) {
var node = node_list[i];
if (node.getAttribute('type') == 'text') {
inps.push(node);
}
}
for (var i=0; i<=inps.length-1; i++) {
name=inps[i].value;
if (name!=="") {
changeLink(i,name);
}
}
}

function changeLink(number,newname) {
document.getElementById("link"+number).innerHTML="<span style='text-transform: capitalize;'><a href=#"+number+">" + newname + '</a></span>'
}</script>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum