onCLick() problem - javascript

I have been reading to stay away from JavaScript for a lot of things, however I was messing around with it and it doesnt seem to work (unless I am blind and have missed something)
<SCRIPT LANGUAGE="text/javascript">
function testResults() {
System.out.println("Got into function");
}
</SCRIPT>
And this is my body:
<form action="" method="GET">
<input type="button" value="Save" name="saveType" style="margin:10px;" onClick="testResults()"/>
</form>
From what I have seen of javascipt this should be fine...
Any suggestions?

Use console.log instead of system.out.println...
Javascript is not Java!

A few pointers:
it's type="text/javascript"
why capital letters?
System.out.println is Java
Stay away from JavaScript? Currently it's almost like the opposite, but as almost always it depends on what you have to do :)

to get it work use this instead:
Look here - jsfiddle
<form action="" method="GET">
<input type="button" value="Save" name="saveType" style="margin:10px;" onClick="testResults()"/>
</form>
<script type="text/javascript">
function testResults() {
alert("Got into function");
}
</script>
it is type="text/javascript and not language="text/language" also in javascript you have to use alert().

Javascript doesn't have a standard output like that. You have a few options:
If you have a debugging console running, you can use console.log("log a message")
You can output debug information to a HTML element: document.getElementById("myelement").innerHTML = "message here";
There are loads more options - I'd suggest learning Javascript properly. It's not that much like Java.

Java => System.out.println or System.out.print
Javascript => console.log
:)

Related

$('#form').submit() works but document.getElementById('form').submit() does not

On ASP.NET Web Forms page where there is any form, I am unable to submit using plain javascript, but using jQuery I am able to submit.
Example:
[...]
<head>
[...]
<script type="text/javascript">
function submitting() {
alert('Submitting');
return true;
}
</script>
</head>
<body>
<form id="testform" onsubmit="return submitting();"></form>
[...]
</body>
[...]
Then in the console:
> $('#testform')
[<form id=​"testform" onsubmit=​"return submitting()​;​">​</form>​]
Then as expected calling .submit() works as expected
> $('#testform').submit()
Works!
But using document.getElementById:
> document.getElementById("testform")
<form id=​"testform" onsubmit=​"return submitting()​;​">​</form>​
> document.getElementById("testform").submit()
undefined
I believe that document.getElementById("testform").submit() is actually causing a postback, but I am not sure why it will not submit the form as expected.
Any ideas?
I had the same issue and figured out the reason/solution:
the <input type="submit"..> has id="submit" which is unnecessary. If you have this ID then remove it and it will submit the form using
document.getElementById("testform").submit()
I believe .submit() is a jQuery method/function, which is why it only worked in your jQuery example.
The vanillaJS method would be .onSubmit (like the others have mentioned).
Now if you put your code inside of a jQuery wrapper like this:
$(document.getElementById("testform"))
(Which is basically what jQuery does)
Then you would be able to use .submit() like
$(document.getElementById("testform")).submit()
I very rarely use .submit(), so I'm not 100% on that, but it looks right to me
Hope this helps!

Javascript randomly stopped working

I can't get my Javascript to execute.It randomly stopped working yesterday and I've been messing around to try to get it to work. I tried making a simple code to see if it would work but, I have no luck. Here is the code:
HTML:
<script type="text/javascript" src="js\hello.js"></script>
<form id="hello" onsubmit="return hello();">
<input type="submit" />
</form>
Javascript (in sub folder called js):
function hello()
{
alert("HELLO");
return false;
}
It's really annoying me because all of my Javascript codes aren't working but they were working perfectly fine yesterday. I am not sure what happened...
I meant to make an alert I was just wasn't thinking. It still doesn't work anyways. It's like it isn't even calling the function.
use alert("HELLO"); instead of echo. echo is PHP not javascript.
If you want to output to a speicific tag then use document.getElementById("idOfTag").innerHTML = "HELLO";

javascript function does not work

I am currently in the middle of the development of a website. If a user presses a button an javascript function needs to be called. I simplified this function to:
<html>
<head>
<script type="text/javascript">
function newProd(number,customer,software,hardware,name)
{
//I simplified this function
alert('number is: '+number+'customer is: '+customer+' software is: '+software+' hardware is: '+hardware+' name is: '+name);
}
</script>
</head>
<body>
<input type="text" name="textfieldCustomer"><br>
<input type="text" name="textfieldSoftware"><br>
<input type="text" name="textfieldHardware"><br>
<input type="text" name="textfieldDescription"><br>
<input type="button" name="button" value="go to function" onClick="newProd('a number',textfieldCustomer.value,textfieldSoftware.value,textfieldHardware.value,textfieldDescription.value)">
</body>
when the user presses the button in Internet explorer, the function works perfectly! Unfortunately the function does not work in Chrome or Safari.
Does anyone have any idea what is going wrong?
The form fields are not supposed to be defined as global variables. Maybe in IE they are but that's not a behavior you can depend on. Try this:
onClick="newProd('a number',
this.form.textfieldCustomer.value,
this.form.textfieldSoftware.value,
this.form.textfieldHardware.value,
this.form.textfieldDescription.value)">
Oh, and add a form to wrap the inputs of course.
Demo: http://jsfiddle.net/kdUMc/
In my eyes there are two big mistakes in your code. First, the access to inputs fields is wrong. It needs a connection to an instance variable, like 'document'. The second one, the form tag is missing. If you wrap the input fields into a form tag you can access the values as Esailija has posted.

output a variable onclick

I'm a beginner about javascript, and I have some doubts about the variables of this language.
For example, I have this code:
<html>
<head>
<title>Prova_Index</title>
<script language="javascript" type="text/javascript">
function stampa(){
var Name = document.name.utente.value;
document.Write(Name);
}
</script>
</head>
<body>
<form name="name">
<p> Write some text:</p>
<input type="text" id="utente">
</form>
<input type="submit" value="Click me" onClick="stampa()">
</body>
</html>
This is the code, my doubts is specialy how save the values of the textbox with the id 'utente'.
write this code by replacing your code
function stampa()
{
var Name = document.getElementById('utente').value;
alert(Name);
return false;
}
<input type="text" id="utente">
<input type="submit" value="Click me" onclick="return stampa();" />
Instead of var Name = document.name.utente.value;, you probably want to use something like var Name = document.getElementById('utente').value;
Really, you might want to consider using jQuery instead. It's far more reliable for cross-browser oddities than using plain old DOM manipulation.
This Javascript should store the value of that input element into the variable 'Name' and then write it out.
var Name = document.getElementById("utente").value;
document.write(Name);
I will forewarn you that when you use HTML <form> tags and try to execute a function using a submit input, the page will submit and then the onClick function will not be executed.
First of all. Please explain us what you want to do. It isn't clear to us.
Second of all. I recommend using ID's when you are beginning with JavaScript programming.
When you take a look at your code. It will submit after the function is ready. So you can try and use this:
<input type="submit" value="click me" onclick="stampa( ); return false;" />
It won't submit the form and you can see your result.
You can also use an alert( ); function for debugging or console.log( ); if you use Firefox with Firebug or Opera with Dragonfly.
You can try this in your script:
console.log( document.getElementById( 'something' ).value( ) );

javascript function is not a function

This is the javascript code im using.
<script language="javascript" type="text/javascript">
function cancelevent()
{
input_box=confirm("Are you sure you want to cancel?");
if (input_box==true) {
document.cancelevent.submit();
} else {
}
}
</script>
This is the form thats being submitted:
<form name=cancelevent method="post" action="whor.php">
<input type="hidden" name="owner" value="owner">
Cancel
</form>
I have this form on 2 different pages. One page it works, the other, i get this error
Error: document.cancelevent.submit is not a function
Ive literally copy and pasted the code from the working page to the 2nd page....no idea what is going on or why it would do this.
I think the problem is that the HTML form and the javascript function have the same name!
Put an id on your form
<form id="cancelEventForm" name=cancelevent method="post" action="whor.php">
And use
document.getElementById('cancelEventForm').submit();

Categories

Resources