We Keep Coding

A simple javascript number onchange function

I have a simple bit of javascript code that I think should be working, but it isn't. The idea for now is basically just to change the content of a div when a number has been input to a box. I'll make it do something more complicated later, but I need it to work first.
So I have this HTML page:
<form>
<input type="text" name="here" onkeyup="revChange()" />
</form>
<div name="there"></div>
running with the following javascript:
var revChange = function () {
document.there.innerHTML = "<p>Thing</p>";
};
The result is that nothing happens when I enter anything in the input box, it just stays blank. I've tried using onchange, onkeypress, onblur, onkeyup, I've tried the function with brackets, without brackets, using arguments in the brackets (including this.value), I've tried putting several different things inside the function, I've even tried just calling the function directly from the script. No matter what I do, this function does not seem to want to do anything. I can not work out what is going on, so I would like some explanation if possible. Oh yea, and this is just pure javascript, not jQuery or anything.

document.there.innerHTML is not how you should reference a non form element. Give it an id, and use getElementById

You should change the name attribute on your div to an id, and use getElementById
<script type="text/javascript">
var revChange = function () {
document.getElementById("there").innerHTML = "<p>Thing</p>";
};
</script>
<form>
<input type="text" name="here" onkeyup="revChange()" />
</form>
<div id="there"></div>

this seems to be working at my end
<form>
<input type="text" name="here" onkeyup="revChange(this)" />
</form>
<div name="there" id="das"></div>
<script>
var revChange = function (abd) {
document.getElementById('das').innerHTML = abd.value;
};
</script>

Just change your function to:
var revChange = function (ref) {
document.getElementsByName("there")[0].innerHTML = ref.value;
};
Also change your html to:
<form>
<input type="text" name="here" onkeyup="revChange(this)" />
<div name="there"></div>
</form>
This should work.

Use of innerHTML in javascript form

I see in this example how I can change the id contents with an input button and it works fine:
Example:
<script type="text/javascript">
function changeText(){
document.getElementById('boldStuff').innerHTML = 'Fred Flinstone';
}
</script>
<p>Welcome to the site <b id='boldStuff'>dude</b> </p>
<input type='button' onclick='changeText()' value='Change Text'/>
When I try to use this to update a select or checkbox it does not work? What can I use to achieve this result with a form element?
Non-Working Example:
<script type="text/javascript">
function changeText(){
document.getElementById('boldStuff').innerHTML = '2';
}
</script>
<p>Welcome to the site
<input type="checkbox" id="boldStuff" value="1" /></p>
<input type='button' onclick='changeText()' value='Change'/>

innerHTML change the HTML between the opening and closing tag. Since the input tag is a self closing tag (tag that end with />, even though it is valid in HTML5 to leave the / behind), there is no innerHTML.
If you want to change the value, just target the value property :
document.getElementById('boldStuff').value = '2';

You should set the element's checked, not its innerHtml. Setting the innerHtml is equivalent to doing:
<input type="checkbox" id="boldStuff" value="1">2</input>
which is invalid HTML.
If you want to set the checkbox to checked, do this:
document.getElementById('boldStuff').checked = true;

If you want to set the value, set the value (and not innerHTML):
document.getElementById('boldStuff').value = '2';
Most attributes can be found in this way, tho some must be gotten from element.getAttribute and set with element.setAttribute.

to make changes via innerHTML you first need to have a innerHTML value to change
so
document.getElementById('***').innerHTML="2";
the corresponding HTML would need to look similar to this:
<p id="***">some text</p>

Call checkbox value if checked from html file in javascript function

I have two files: myPage.html and myCode.gs in google scripts. I have deployed the html file as a web app, and I have figured out (with help) how to make the onclick event for the 'submit' button to trigger the emailTech function from the myCode.gs file just fine. I have also been able to insert the value from the text box in the html file into the email that is called from the onClick event.
I also have two check boxes and if checked, I would like to have their values entered into the email triggered by the onClick event. I have tried various versions of 'if checked then' statements both in the script tage of the html file and in the emailTech function but neither seem to work. Any suggestions?
myPage.html file:
<head>
<title>Test Page</title>
</head>
<body>
<form>
<input type="text" value=" " name="techEmail" />
<input type="checkbox" name="checkone" value="checkone" />Checkone
<input type="checkbox" name="checktow" value="checktwo" />Checktwo
<input type="button" onClick="formSubmit()" value="Submit" />
</form>
</body>
<script type="text/javascript">
function formSubmit() {
google.script.run.emailTech(document.forms[0]);
}
</script>
myCode.gs file:
function doGet() {
return HtmlService.createHtmlOutputFromFile('myPage');
}
function emailTech(form){
//I want something along the lines of:
//if form.checkone == "checked"{
//var checkone = "checkone"
//}
//if form.checktwo == "checked"{
//var checktwo = "checktwo"
//}
var nameBox = form.techEmail;
var message = "This is the text box value" + nameBox + checkone + checktwo;
MailApp.sendEmail("email#somewhere.com", "This is the subject", message );
}
Also, is there a way to clear the textbox and checkboxes when the submit button is clicked? I don't want to have a seperate reset button, I'd like this to reset and send the email with one click if possible. Thanks in advance!

The checkbox input shouldn't be in a self-closing tag. (That's one that ends with />.) You also need to align your value setting with what you'll look for in your handler ('checked'). Change your html like this:
<input type="checkbox" name="checkone" value="checked" >Checkone
<input type="checkbox" name="checktow" value="checked" >Checktwo
Now in your server-side handler, you can just check for the presence of 'checkone' and/or 'checktwo', because they will only be delivered in the event when checked. You can alternatively check the value, as you were planning to.
Just remove the comments from your "wish", fix the syntax, and you're good!

How to run Javascript codes that are put in a textbox (in HTML5)

I have a textbox on my html page, I'd like to run the javascript code that people put it the textbox. How can I do that?

You can create a new script dynamically like found here
Here's a quick example you can copy and paste into an html file and see it work. You'll notice that once called, the page reloads and stalls out. This could be solved by using ajax and a seperate page the executes the code and returns a value or string or whatever it is your code should return.
<html>
<head>
</head>
<body>
<script>
function doIt() {
var headID = document.getElementsByTagName("head")[0];
var newScript = document.createElement("script");
newScript.type = "text/javascript";
newScript.innerHTML = document.getElementById("textarea").value;
headID.appendChild(newScript);
}
</script>
<textarea name="textarea" id="textarea">
alert("Alert");
</textarea>
<input type="button" value="Do It" onclick="doIt();" />
</body>
<html>

You can use document.getElementsByName
<input name="textbox" type="text" />
<input name="buttonExecute" onclick="execute(document.getElementsByName('textbox')[0].value)" type="button" value="Execute" />
something similar i found here

You could also create a JavaScript function to get the content using jQuery and execute the code you wanted but you must set an id to the textbox
<script>
$("#run").click(function () {
var element = $("input#textbox").val();
//code to execute
}
</script>
<input type="textbox" value="Type something" id="textbox"></input>
<button id="run">Run Code</button>

I think the easiest native JS way to do it is to use a textbox's value attribute and eval() its content, as it doesn't require to create any script elements (that would be sitting there until the page is reloaded) or big constructs:
function runIt() {
eval(document.getElementById('code-input').value);
console.log('Ran code from textbox!');
}
<textarea id="code-input" placeholder="Input any JS code here"></textarea>
<button onclick="runIt()">Run it!</button>
This example is a text box and with every click on the button "Run it!" the text that's inside of it is executed as JavaScript.
In fact this answer is just a complicated way to say: "Just eval() a textbox's value."

How to update an input text from javascript?

I have this simple code that speaks for itself.Here it is:
<script language='javascript">
function check() {}
</script>
<div id="a">input type="text" name="b">
<input type="button" onClick=" check(); ">
All i want is that when i press the button, the text field gets a value updated to it.
I tried using b.value=" C " but it doesnt seem to work.

<script language="javascript">
function check() {
document.getElementById('txtField').value='new value here'
}
</script>
<input id="txtField" type="text" name="b"> <input type="button" onClick=" check(); ">
This will do. I gave it an ID, and used getElementById('txtField') using the id, and updated it's value.

You seem to be thinking that giving a form input a name attribute makes it addressable as though it were a global variable. It doesn't. There is a syntax for that, and you would have to use something like:
document.forms[0].b.value = "C";
in order to get to address it successfully. You are putting your form elements inside a form, aren't you?
Do it that way, or use an ID along with the getElementById method, as mplacona suggests.