I am using a JavaScript function called showDate() that is passed a parameter (called id). I am trying to get the function to display the date with the innerHTML property that is passed to the function in the function call.
Here is my code:
<!DOCTYPE html>
<html>
<head>
<title>My bored html</title>
<script type = "text/javascript">
function showDate(id)
{
document.getElementById(id).innerHTML = Date();
}
</script>
</head>
<p id = "Datepara" style = "font-family:comic sans ms;color:orange;text-align:center;font-size:25px;">
Date: 24/9/12 <br /><br /><br/>
</p>
<input type = "button" onclick = "showDate(Datepara)" value = "Display today's date" />
</body>
</html>
Change
showDate(Datepara)
by
showDate('Datepara')
Otherwise you're passing the html element and not just the id.
You need to quotes around the element's id string:
<!DOCTYPE html>
<html>
<head>
<title>My bored html</title>
<script type = "text/javascript">
function showDate(id)
{
document.getElementById(id).innerHTML = Date();
}
</script>
</head>
<p id = "Datepara" style = "font-family:comic sans ms;color:orange;text-align:center;font-size:25px;">
Date: 24/9/12 <br /><br /><br/>
</p>
<input type = "button" onclick = "showDate('Datepara')" value = "Display today's date" />
</body>
</html>
The best way to do it is:
<input type = "button" onclick = "show Date('Datepara')" value = "Display today's date" />
I hope this is helpful.
Related
So, I've copied this code and tried to run it. It supposed to take the input (in this case, name) and save it into a text file. But, it didn't work as I expected, can someone tell me what's wrong with this code?
<!DOCTPYE html>
<head>
<title>Web test</title>
</head>
<body>
<form onSubmit="WriteToFile(this)">
<label>Name please: </label>
<input type="text" name="nname" id="fname" size="18">
<br>
<br>
<input type="submit" value="submit">
</form>
<script>
function WriteToFile(passForm){
set fso = CreateObject("Scripting.FileSystemObject");
set s = fso.CeateTextFile("test.txt", True);
var firstName = document.getElementById('fname');
s.writeline(firstName);
s.writeline("");
s.Close();
}
</script>
</body>
<html>
There's a misspelling here var firstName = document.geteElementById('fname'); it's supposed to be var firstName = document.getElementById('fname');
i'm trying to create a simple app on google app script
i want that when a user will insert a value to one field
it will Immediately will be shown on the disabled textbox below as in the picture i've uploaded
this my code,its not working
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script>
document.getElementById("one").addEventListener("input",Check);
function Check(){
var Code = document.getElementById("one").value;
document.getElementById("two").value = Code;
}
</script>
</head>
<body>
three:<input type = "text" id="one"/>
four:<input disabled type = "text" id="two"/>
</body>
</html>
textbox
three:<input oninput='document.getElementById("two").value = this.value' type = "text" id="one"/>
four:<input disabled type = "text" id="two"/>
firstval = document.getElementById("one").value;
secondval = document.getElementById("two").value = firstval
HTMLElement: input event
document.getElementById("one").addEventListener("input", updateValue);
function updateValue(e) {
document.getElementById("two").value = e.target.value;
}
three:
<input type="text" id="one" />
four:
<input disabled type="text" id="two" />
And put the script at the end of body. Otherwise elements with id one and two will not be available while your script is running.
<!DOCTYPE html>
<html>
<head>
<base target="_top" />
</head>
<body>
three:
<input type="text" id="one" />
four:
<input disabled type="text" id="two" />
<script>
document.getElementById("one").addEventListener("input", updateValue);
function updateValue(e) {
document.getElementById("two").value = e.target.value;
}
</script>
</body>
</html>
I have this text field hidden with HTML hidden code, now when the user enter an invalid input I use javascript to unhide the text field and display an error message, this is what is suppose to happen.
I have seen a lot of css style like
`style.visibility = 'visible';` and `style.display='block';`
But none of them are working for me what happens is that the error text shows for less than a second and then disappears, any one would like to share their thoughts.
This is the complete code for better understanding, it's still not working in firefox and Edge while IE and Chrome wont do anything, in Firefox, it just blinks once on each button press and that about it.
Javascript:
</script>
function validate(){
var firstname = document.getElementById("fn").value;
if (firstname == "") {
document.getElementById("fn").style.visibility = "visible";
document.getElementById("fn").text = "ERROR";
}
}
function init()
{
var formData = document.getElementById("enqForm");
formData.onsubmit = validate;
}
window.onload = init;
</script>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="scripts.js"></script>
</head>
<body>
<form id="enqForm">
<input id="fn" type="text" placeholder="First Name *" />
<input id="sendbutton" type="submit" value="Enquire" />
</form>
</body>
</html>
Instead of changing the style, you can change the form's type attribute.
Using JavaScript - assuming you want to change lnspan to text:
document.getElementById('lnspan').type = 'text';
Style is not the same as the type attribute.
Also there's two id attributes in your <input>, you may want to change that.
**THAT IS THE ANSWER TO YOUR QUESTION**
<html>
<head>
<script>
function newDoc() {
document.getElementById("hid").type="text";
document.getElementById("hid").value="ERROR";
}
</script>
</head>
<body>
<input type="button" value="Load new document" onclick="newDoc()">
<input type="hidden" id="hid" value="">
</body>
</html>
<!--However this makes your error message as text field which is not good.
What you can do is make the Error into embedded into paragraph <p> so the
users cannot change it and it also looks more professional
<!DOCTYPE html>
<html>
<head>
<script>
function newDoc() {
document.getElementById("te").innerHTML="ERROR";
}
</script>
</head>
<body>
<input type="button" value="Load new document" onclick="newDoc()">
<p id="te">
</body>
</html>
This is my code. When I click the calculate button it is displaying just the number 35. WHere have I gone wrong and how can I fix it?
<!doctype html>
<html>
<head>
<title>JS Practise 2</title>
</head>
<body>
<h1> Problem 1.1 </h1>
<script language="javascript">
var topsoil_amount = 1;
function calculate() {
var topsoil_amount = document.getElementById(Input);
var topsoil_cost = 15;
var cost = (topsoil_amount * topsoil_cost) + 35;
alert(cost);
}
</script>
<br>
<input type="text" name="Input" size="16" id="Input">
<input type="button" value="Calculate" onClick="calculate()">
</body>
</html>
topsoil_amount is a DOM element, not a number. You need to reference the value. Secons issue is you need quotes around the id.
var topsoil_amount = document.getElementById("Input").value;
I do not know if my code even works because i cant get past the onlclick is null. i am trying to take text from a textarea and put it into a paragraph in HTML. With a check box. if the box is checked then it will clear the <p> tag. if unchecked it will leave the stuff in the p-tag and just make a new p-tag. thanks guys
window.onload = function() {
document.getElementById("paste").onclick = function() {
//var y = document.getElementById('paste').onclick
var paragraph = document.getElementById('box').value;
var x = document.getElementById("write");
var getInfo = document.getElementById('ParaWrite');
if (x.checked === true)
paragraph =+ "<p>"+paragraph+"</P>";
else
return;
getInfo.innterHTML === paragraph;
}
}
HTML
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>TeXt BoX</title>
<link rel="stylesheet" href="../css/normalize.css">
<link rel="stylesheet" href="Textbox.css">
</head>
<body>
<h1></h1>
<form name="form1" id="form1">
<input type='checkbox' name='write' id='write' value='Check' />
<label for='write'>Append Paragraph</label><br/>
<textarea type="text" id="box"/></textarea>
<input type='button' value="Paste typed text" id="Paste"/>
</form>
<p id="ParaWrite"></p>
<script type="text/javascript" src="TextPara.js"></script>
</body>
</html>
id name is case sensitive. Change your onclick assigning call to
document.getElementById("Paste").onclick =
change paste to Paste
Also it not =+ correct one is +=
Your selector is looking for an id paste, but your element has an id Paste:
var thisWillBeNull = getElementById('paste') ==> null
thisWillBeNull.onclick ==> TypeError: Cannot read property 'onclick' of null