I have a JSP page with a form. I want to submit and return the input to the JSP page. I can't get it to work.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Ejemplo</title>
<script type="text/JavaScript" src="Scripts/jquery-1.9.1.js"></script>
<script>
function enviarDatos() {
form = document.getElementById("datos");
form.datoIntroducido.value = "holaaaaaa";
form.submit();
<%System.out.println(request.getParameter("datoIntroducido"));%>
}
</script>
</head>
<body>
<h3>Ejemplo</h3>
<form name="datos" id="datos" action="mypage" method="post" enctype="multipart/form-data">
Escribe aquí: </br>
<textarea cols=50 rows=10 id="texto"></textarea><br />
<input type="hidden" name="datoIntroducido" id="datoIntroducido"/>
<input type="submit" value="Enviar datos" class="btn-primary" onclick="enviarDatos();"/>
</form>
</div>
</body>
</html>
It prints "null" when executing the first time but it doesnt write anything when pressing the button
Related
I am trying to call a function in an external JavaScript file from an HTML-file. The goal is to work with the content of a form there.
I tried so many things and always got the Error "ReferenceError: Can't find variable: X"
The positioning of the jquery javascript file loading
The positioning of the <script src="XXX"> call
Calling the function from the button "onclick" or the form "onsubmit"
Trying to call the javascript file from an embedded script in the HTML
This is what my JavaScript file and my HTML looks like right now:
function submit(e) {
answerText = document.getElementById("text").value;
// Do something with it.
}
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="/scripts/debug_alerts.js" type="text/javascript"></script>
</head>
<body>
<form id="validation-form" onsubmit="return submit(e)">
<input type="text" class="form-control" name="text" id="text" placeholder="Text" required>
<button type="button" class="btn btn-primary" onclick="submit(e)">Send</button>
</form>
</body>
I also tried
function doSomething() {
// Do something
}
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="/scripts/debug_alerts.js" type="text/javascript"></script>
</head>
<body>
<form id="validation-form" onsubmit="return submit(e)">
<input type="text" class="form-control" name="text" id="text" placeholder="Text" required>
<button type="button" class="btn btn-primary" onclick="submit(e)">Send</button>
</form>
<script>
function submit(e) {
doSomething();
}
</script>
</body>
In both cases, it returned the same error over and over again: "ReferenceError: Can't find variable: X". In the first example, X being "submit" and in the second "doSomething".
All help is very welcome. I know there are similar headlines here, but non of the solutions did anything for me.
Hey so when I ran the code without the e as a parameter for the submit function in the html it didn't give me the error. I think it may be because the e is the place holder for the text of the submit function in this case. Hope this helps.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="/scripts/debug_alerts.js" type="text/javascript"></script>
</head>
<body>
<form id="validation-form" onsubmit="return submit(e)">
<input type="text" class="form-control" name="text" id="text" placeholder="Text" required>
<button type="button" class="btn btn-primary" onclick="submit()">Send</button>
</form>
<script type="text/javascript">
function submit(e) {
answerText = document.getElementById("text").value;
// Do something with it.
}
</script>
</body>
</html>
I'm trying to make my iframe to auto login.
Here is my code. It's not logging in automatically. Whats the problem with my code?
<form id="login" target="frame" method="post" action="https://172.16.8.187:6060/NCMContainer.cc">
<input type="hidden" name="username" value="user" />
<input type="hidden" name="password" value="pass" />
</form>
<iframe id="frame" name="frame"></iframe>
<script type="text/javascript">
// submit the form into iframe for login into remote site
document.getElementById('login').submit();
// once you're logged in, change the source url (if needed)
var iframe = document.getElementById('frame');
iframe.onload = function() {
if (iframe.src != "https://172.16.8.187:6060/NCMContainer.cc") {
iframe.src = "https://172.16.8.187:6060/NCMContainer.cc";
}
}
Your main HTML should look like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" /><meta charset="utf-8" />
<title>Numpty</title>
</head>
<body>
<iframe src="frame.html"></iframe>
</body>
</html>
then create a new file, frame.html, which can look like this
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" /><meta charset="utf-8" />
</head>
<body>
<form id="login" method="post" action="https://172.16.8.187:6060/NCMContainer.cc">
<input type="hidden" name="username" value="user" />
<input type="hidden" name="password" value="pass" />
</form>
<script type="text/javascript">
document.getElementById('login').submit();
</script>
</body>
</html>
Now the iframe will be logged in to https://172.16.8.187:6060/
I'm trying to alert the values of the form elements but this isn't functioning even at its simplest: getting the elements of the form then alerting a string.
The alert fires when it's by itself, but not when I put the form's data in the variable. Why?
I'm sure there's probably a very simple mistake in here somewhere, but I'm stumped.
<!DOCTYPE html>
<html>
<head>
<!-- ISTE240 Exercise 5b -->
<meta charset=utf-8 />
<title>Get elements from a form</title>
<script>
function getFormValues() {
// function to send first and last names to an 'alert' message.
alert("test");
var form = document.getElementById(“regForm”).elements;
}
</script>
</head>
<body>
<p>JavaScript Exercise 5b </p>
<form id="regForm" onsubmit="getFormValues()">
First name: <input type="text" name="fname" value="Boo"><br>
Last name: <input type="text" name="lname" value="Radley"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
By default form tag will try to submit form values. You must prevent default behavior, demo below
document.querySelector('#regForm').onsubmit = function(e){
e.preventDefault();
alert('a');
var form = document.getElementById("regForm").elements; //<-- wrong syntax, must be "
console.log(form);
}
<!DOCTYPE html>
<html>
<head>
<!-- ISTE240 Exercise 5b -->
<meta charset=utf-8 />
<title>Get elements from a form</title>
</head>
<body>
<p>JavaScript Exercise 5b</p>
<form id="regForm">
First name:
<input type="text" name="fname" value="Boo">
<br>Last name:
<input type="text" name="lname" value="Radley">
<br>
<input type="submit" value="Submit">
</form>
</body>
</html>
I have a javascript function to count the number of clicks. I wish to post the variable storing the count to PHP. I'm unsure why when I submit the form, the count is not echoed out. Below is the HTML file.
<html>
<head>
<title> js php </title>
<script>
var cnt=0;
function CountFun(){
cnt=parseInt(cnt)+parseInt(1);
var divData=document.getElementById("showCount");
divData.innerHTML="Number of Downloads: ("+cnt +")";//this part has been edited
}
</script>
</head>
<body>
<div id="showCount"></div>
<form action "submitClicks.php"id="form">
<input type="hidden" name="numberOfClicks" />
<input type="button" id="btnClick" value="Click me" onclick="CountFun()"/>
<input type="submit" value="Submit Clicks" />
</form>
</body>
</html>
Then this is my submit clicks page:
<?php
$number_of_clicks = $_POST["cnt"];
echo $number_of_clicks;
?>
Does this implementation look correct to you as when I click submit clicks, nothing happens. I'm expecting the number of clicks to be echoed.
<form action "submitClicks.php"id="form">
Should be:
<form action="submitClicks.php" id="form" method="post">
And shouldn't you have something like:
In HTML:
<input id="count" type="hidden" name="cnt" value="">
In your Javascript CountFun function:
document.getElementById('count').value = cnt;
Try this code:
<html>
<head>
<title> js php </title>
<script>
var cnt=0;
function CountFun(){
cnt=parseInt(cnt)+parseInt(1);
var divData=document.getElementById("showCount");
divData.value=cnt;//this part has been edited
document.getElementById("JustShow").innerHTML= cnt;
}
</script>
</head>
<body>
<div id="JustShow"></div>
<form action="submitClicks.php" id="form" method="post">
<input type="hidden" id="showCount" name="cnt" value="0" />
<input type="button" id="btnClick" value="Click me" onclick="CountFun()"/>
<input type="submit" value="Submit Clicks" />
</form>
</body>
</html>
I have this index.php file;
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Proj</title>
<script type="text/javascript">
function openWindow() {
window.open("popup.php", "popup_id", "scrollbars=no,resizable,width=200,,left=300,top=300,height=200");
}
</script>
</head>
<body>
<form name="form1" action="">
<input name="initialdata" type="text" value="initial data" />
<input type="button" value="Send" onClick="openWindow()" />
</form>
</body>
</html>
and this popup.php file
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>popup</title>
<script type="text/javascript">
function putData() {
//How to copy from that file -> document.formname.popupdata.value to
//index.php -> document.form1.initialdata.value???
window.close();
}
function loadData() {
//how to get the value "initial data"
//from index.php -> document.form1.initialdata.value????????????
}
</script>
</head>
<body onLoad="loadData();">
<form name="formname" action="">
<input name="popupdata" type="text" value="" />
<input type="button" value="Send" onClick="putData()" />
</form>
</body>
</html>
How how to get the value "initial data" from from index.php -> document.form1.initialdata.value and how to copy from popup.php -> document.formname.popupdata.value to index.php -> document.form1.initialdata.value??
Using
window.opener.document.getElementsByName("initialdata")[0].value;
This might not work on every browser, though. For details, see this question:
window.opener alternatives