I am building a website, the function of which I cannot be specific about because it is an original idea (does not matter to the question).
This is my first experience with Javascript (I used solely PHP and HTML on pervious projects), so I am figuring things out as I go along.
To start to build my website and get a feel for javascript, i am trying to simply get text at the bottom of my page to dynamically change based on the content of a text box. I do not care if the text mirrors the box live or if the user has to click a button to update (currently I am attempting the latter method).
First of all, here is the form in question:
<form action=”” method=”GET” name=”form” class=”CrunchForm”>
<p>
<input name=”inputbox” type=”text” class=”CrunchBox” value=”Text goes here…” id=”MyID” />
<input type=”button” class=”CrunchButton” value=”crunch” onclick=”getboxbutton(boxtext_element)” />
</p>
</form>
I defined a few functions at the top of the document, here is the code for those:
<script type=”text/javascript”>
<!–
function getbox(boxtext_element) {
var boxtext_element = document.getElementById(‘MyID’);
var boxtext = boxtext_element.value;
}
//–>
</script>
<script type=”text/javascript”>
<!–
function getboxbutton(boxtext_element) {
var boxtext_element = form.getElementById(‘MyID’);
var boxtext = boxtext_element.value;
}
//–>
</script>
My goal here was to get the text in the box to be stored as the variable boxtext when the button is clicked, and then be displayed at the bottom of the page by the following code:
<script type=”text/javascript”>
document.write(‘Typed: ‘ + boxtext);
</script>
For some reason unknown to me, I cannot get this to work at all. I know the html is sound, and clearly the Javascript is the problem.
If you need any more details to help me, I will be happy to provide them, although i suspect it is a simple problem in my code seeing as I am a first time JS user.