Forum Moderators: open
For example, if the user leaves one of the fields blank, I don't want there to be a possibility of displaying just a blank space instead of an actual text.
Here's my Javascript (generate.js):
(function () {
var generate = document.getElementById('generate');
generate.onclick = function () {
var name1 = document.getElementById('Text').value;
var name2 = document.getElementById('Text2').value;
var name3 = document.getElementById('Text3').value;
var name4 = document.getElementById('Text4').value;
var name5 = document.getElementById('Text5').value;
var name6 = document.getElementById('Text6').value;
var name7 = document.getElementById('Text7').value;
var name8 = document.getElementById('Text8').value;
var text = [
name1,
name2,
name3,
name4,
name5,
name6,
name7,
name8,
],
inc = Math.floor(Math.random() * text.length);
document.getElementById('result').innerHTML = text[inc];
}
})();
And here is the relevant HTML:
<html>
<body>
<form>
<input id="Text" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/>
<input id="Text2" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/>
<input id="Text3" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/>
<input id="Text4" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/><br>
<input id="Text5" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/>
<input id="Text6" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/>
<input id="Text7" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/>
<input id="Text8" style="font-size:13px; font-weight:bold" onKeyDown="if(event.keyCode==13) return false;"/><br>
<input value="Generate!" type="button" style="font-size:16px; font-weight:bold" id="generate"/>
</div><br>
<span style="border-top:1px solid #000000" id="result" align="center"></span>
</form>
<script type="text/javascript" src="generate.js"></script>
</body>
</html>
Thanks in advance!
PS, I know I've been pretty demanding on this forum lately, but I'm still really new to this stuff and this all really helps. Someday, I'll get good at this and give back to the community :P.
(function () {
var generate = document.getElementById('generate');
generate.onclick = function () {
var name1 = document.getElementById('Text').value ? document.getElementById('Text').value: "";
var name2 = document.getElementById('Text2').value ? document.getElementById('Text1').value: "";
var name3 = document.getElementById('Text3').value ? document.getElementById('Text2').value: "";
var name4 = document.getElementById('Text4').value ? document.getElementById('Text3').value: "";
var name5 = document.getElementById('Text5').value ? document.getElementById('Text4').value: "";
var name6 = document.getElementById('Text6').value ? document.getElementById('Text5').value: "";
var name7 = document.getElementById('Text7').value ? document.getElementById('Text6').value: "";
var name8 = document.getElementById('Text8').value ? document.getElementById('Text7').value: "";
var text = [
name1,
name2,
name3,
name4,
name5,
name6,
name7,
name8,
],
inc = Math.floor(Math.random() * text.length);
document.getElementById('result').innerHTML = text[inc];
}
})();
or the second, just dosen't add it to the array if it is blank, again untested but the idea is sound.
(function () {
var generate = document.getElementById('generate');
generate.onclick = function () {
var text = [];
var name1 = document.getElementById('Text').value ? text[] = document.getElementById('Text').value : "";
var name2 = document.getElementById('Text2').value ? text[] = document.getElementById('Text1').value : "";
var name3 = document.getElementById('Text3').value ? text[] = document.getElementById('Text2').value : "";
var name4 = document.getElementById('Text4').value ? text[] = document.getElementById('Text3').value : "";
var name5 = document.getElementById('Text5').value ? text[] = document.getElementById('Text4').value : "";
var name6 = document.getElementById('Text6').value ? text[] = document.getElementById('Text5').value : "";
var name7 = document.getElementById('Text7').value ? text[] = document.getElementById('Text6').value : "";
var name8 = document.getElementById('Text8').value ? text[] = document.getElementById('Text7').value : "";
inc = Math.floor(Math.random() * text.length);
document.getElementById('result').innerHTML = text[inc];
}
})();
Hope this helps.
Alan
Anyways, I'll keep trying to figure it out. Thanks again!
I used the push() method and 8 if statements to make it work.
Here's the final code:
(function () {
var generate = document.getElementById('generate');
generate.onclick = function () {
var name1 = document.getElementById('Text').value;
var name2 = document.getElementById('Text2').value;
var name3 = document.getElementById('Text3').value;
var name4 = document.getElementById('Text4').value;
var name5 = document.getElementById('Text5').value;
var name6 = document.getElementById('Text6').value;
var name7 = document.getElementById('Text7').value;
var name8 = document.getElementById('Text8').value;
var text = [];
if (name1.length > 0)
{text.push(name1);}
if (name2.length > 0)
{text.push(name2);}
if (name3.length > 0)
{text.push(name3);}
if (name4.length > 0)
{text.push(name4);}
if (name5.length > 0)
{text.push(name5);}
if (name6.length > 0)
{text.push(name6);}
if (name7.length > 0)
{text.push(name7);}
if (name8.length > 0)
{text.push(name8);}
inc = Math.floor(Math.random() * text.length);
document.getElementById('result').innerHTML = text[inc];
}
})();
Guess I'm not so bad after all huh?
:P thanks for the help!
var text = [];
var el;
while ( var inc=1; (el=document.getElementById('Text'+inc)); inc++ ) {
if ( el.value.length > 0 ) { text.push(el.value); }
}
change the first id 'Text' to 'Text1'.
Also cater for case of all blank
if ( text.length > 0 )) {
inc = Math.floor(Math.random() * text.length);
document.getElementById('result').innerHTML = text[inc];
}
