Jump to content

[SOLVED] How do I output data in order... Does that even make sense... It's not hard....


bobleny

Recommended Posts

I have a question, I'm do something sort of, kind of, maybe, not really, like this:

<html>
<head>
	<script type="text/javascript">
		<!--
			function ButtonOne()
			{
				document.getElementById("foo").innerHTML = "Button One";
			}

			function ButtonTwo()
			{
				document.getElementById("foo").innerHTML = "Button Two";
			}
		-->
	</script>
</head>
<body>
	<input type='button' value='Button One' onclick="ButtonOne()">
	<input type='button' value='Button Two' onclick="ButtonTwo()">
	<br /><br />
	<div id="foo"></div>
</body>
</html>

 

 

If you press button one, the output is this:

Button One

 

If you immediately press button two, the output is this:

Button Two

 

 

 

Thats fine and all, but I want it to work like this instead.

If you press button one:

Button One

 

If you then press button two:

Button One
Button Two

 

And if you then press button one again:

Button One
Button Two
Button One

 

And so on and so forth.

 

How do I do that? I know there is a way to do it.....

Link to comment
Share on other sites

here you go - it took me a while and there my be a better way to do this, but this will work; it's not that pretty, but it's functional.

 

here it is:

 

<script type="text/javascript">
function tester(addin,content)
{
var str1 = content;
var str2 = addin;
  document.getElementById('foo').innerHTML = document.getElementById('test').value = str1.concat(str2);
  document.getElementById('btn1').onclick=function() {
  javascript:tester('<br>Button 1',document.getElementById('test').value);
}
  document.getElementById('foo').innerHTML = document.getElementById('test2').value = str1.concat(str2);
  document.getElementById('btn2').onclick=function() {
  javascript:tester('<br>Button 2',document.getElementById('test2').value)
}
}
window.onload=function() {
document.myForm.myFirstBtn.value="";
document.myForm.mySecondBtn.value="";
}
</script>

<br><br>

<form name="myForm">

<input type="button" id="btn1" value="Button 1" onclick="javascript:tester('Button 1',document.getElementById('test').value)">
<input type="button" id="btn2" value="Button 2" onclick="javascript:tester('Button 2',document.getElementById('test2').value)">


<!--Hidden Form Fields-->

<input type="hidden" name="myFirstBtn" id="test" value="Button 1">
<input type="hidden" name="mySecondBtn" id="test2" value="Button 2">

</form>

<div id="foo"></div>

Link to comment
Share on other sites

A subtle change in the Javascript should do it:

	<script type="text/javascript">
		<!--
			function ButtonOne()
			{
				document.getElementById("foo").innerHTML += "Button One";
			}

			function ButtonTwo()
			{
				document.getElementById("foo").innerHTML += "Button Two";
			}
		-->
	</script>

Link to comment
Share on other sites

roopurt18 code is alot cleaner then mine - your best bet is to go with his, but be sure to add your line breaks in there, too get the effect you want; like so:

 

	<script type="text/javascript">
		<!--
			function ButtonOne()
			{
				document.getElementById("foo").innerHTML += "<br>Button One";
			}

			function ButtonTwo()
			{
				document.getElementById("foo").innerHTML += "<br>Button Two";
			}
		-->
	</script>

</head>
<body>
	<input type='button' value='Button One' onclick="ButtonOne()">
	<input type='button' value='Button Two' onclick="ButtonTwo()">
	<br /><br />
	<div id="foo"></div>
</body>
</html>

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.