hi,
I have text box called "userInput" and one submit button.I want to print the value of the text box which is entered by user like a stack(previous values also,not just the current value).
any idea..??
<input type="text" name="userInput"/>
<input type="button" name="sub" value="submit">
Thank in advance!
var stack = [];
$("input [name=userInput]").change(function () { stack.push(this.value); });
You can change that event to blur, focus, etc. depending on when you want the values recorded.
A submit button usually is for submitting a form. Submitting a form is sending a request to the server and refreshing the page. So in your server side script you could read the posted values and show them in the resulting page (you don't need javascript for this).
If you don't want to redirect you could handle the submit event and cancel the default submission:
var values = [];
$(function() {
$('#id_of_form').submit(function() {
// get the entered value:
var userInput = $(':input[name=userInput]').val();
// add the current value to the list
values.push(userInput);
// show the values
alert(values.join(", "));
// cancel the default submission
return false;
});
});
Tested solution:
<html>
<head>
<script type="text/javascript">
function AddToStack() {
var userInput = document.getElementById('userInput');
var stack = document.getElementById('stack');
stack.innerHTML += '<p>' + userInput.value + '</p>';
//clear input an refocus:
userInput.value = '';
userInput.focus();
}
</script>
</head>
<body>
<div id="stack"></div>
<input type="text" name="userInput" id="userInput"/>
<button type="button" name="sub" onclick="AddToStack();">Submit</button>
</body>
</html>