The output text display for a second and then gone forever...is there a way to make it stay?
<head>
<script type="text/javascript">
function input(){
var input_taker = document.getElementById('email').value;
document.getElementById('display').innerHTML = input_taker;
}
</script>
</head>
<form method="post" action="#">
<input type="text" name="email" placeholder="email#example.com" id="email" onchange="input()">
<input type="submit" name="save" value="save">
When you hit the save button it's probably trying to POST your form - you can remove the form element and your code will pretty much work - if all you want to do is display the text input's value elsewhere on the screen.
Here's an example:
function input() {
var input_taker = document.getElementById('email').value;
document.getElementById('display').innerHTML = input_taker;
}
<input type="text" name="email" placeholder="email#example.com" id="email" onchange="input()">
<input type="submit" name="save" value="save">
<br/>
<div id="display" onchange="input()">
Related
I have this simple code in the test0.html file, it sends data to test1.html :
<body>
<form action="test1.html">
<input type="text" name="array[0]" placeholder="val1" id="">
<input type="text" name="array[1]" placeholder="val2" id="">
<input type="submit" value="send">
</form>
</body>
Then i have this code on the test1.html, that is supposed to send some new data back to test0:
<body>
<form action="test0.html">
<input type="text" name="array[2]" placeholder="val3" id="">
<input type="text" name="array[3]" placeholder="val4" id="">
<input type="submit" value="send back">
</form>
When i send data back to test0, i just get the newest data typed in test1.html. I'd like to know how to keep track of the ones sent previously from test0.
Thanks!
As the default form method is GET, the form parameters will be passed using the query parameters
So you can add a hidden input field to your form for each query parameters.
<body>
<form action="test0.html">
<input type="text" name="array[2]" placeholder="val3">
<input type="text" name="array[3]" placeholder="val4">
<input type="submit" value="send back">
</form>
<script>
(function() {
var form = document.querySelector("form");
var queryParams = new URLSearchParams(location.search);
for (var key of params.keys()) {
var input = document.createElement("input");
input.type = "hidden";
input.name = key;
input.value = queryParams.get(key);
form.insertBefore(input, form.firstChild);
}
})();
</script>
</body>
You take the sent data and store it temporarily, so you can then pass it on to the following pages. Input fields of type hidden are suitable here.
<form action="test0.html">
<input type="hidden" name="array[0]" value="SUBMITTED_DATA">
<input type="hidden" name="array[1]" value="SUBMITTED_DATA">
<input type="text" name="array[2]" placeholder="val3" id="">
<input type="text" name="array[3]" placeholder="val4" id="">
<input type="submit" value="send back">
</form>
With this approach, you can not determine whether the data were subsequently edited! Here a signature can provide remedy.
Ok I'm trying to auto login a guest account and it requires:
In header
<script language="JavaScript" type="text/JavaScript">
function guestLogin() {
document.form_login.username.value = 'guest';
document.form_login.password.value = 'guest';
document.form_login.submit();
}
</script>
And
<form action="https://www.redcheetah.com/WebPrefex/" method="post" name="form_login">
<input name="username" type="text" value="" />
<input name="password" type="password" value="" />
<input name="form_action" type="submit" value="Login" />
</form>
javascript:guestLogin();
How would I get the javascript:guestLogin(); to work without having the Login form on the page.
Any Tips?
Thanks
If you need the form to be on the page - if you can't create it on demand for whatever reason - then if you want guestLogin to work without the user seeing the form, you'll have to hide the form using CSS. It'll still be submittable, it just won't be visible:
function guestLogin() {
document.form_login.username.value = 'guest';
document.form_login.password.value = 'guest';
console.log('submitting');
document.form_login.submit();
}
document.querySelector('div').onclick = guestLogin;
form {
display: none;
}
<form action="https://www.redcheetah.com/WebPrefex/" method="post" name="form_login">
<input name="username" type="text" value="" />
<input name="password" type="password" value="" />
<input name="form_action" type="submit" value="Login" />
</form>
<div>click to submit</div>
I want to have it so I can fill out this kind of form (below) and then when I click "Send" it would send to a specific email that I have inputted. Meaning, I would be declaring the information that is filled out in the "Email" field as a variable and then somehow have the "mailto:" link send to that email address. I really hope that makes sense. I'm not entirely sure how to explain it.
It seems like it would be relatively simple, I'm just not having much luck (Javascript is not my strongest language).
<!DOCTYPE html>
<html>
<body>
<h2>Send e-mail to someone#example.com:</h2>
<form action="MAILTO:someone#example.com" method="post" enctype="text/plain">
Name:<br>
<input type="text" name="name" value="your name"><br>
E-mail:<br>
<input type="text" name="mail" value="your email"><br>
Comment:<br>
<input type="text" name="comment" value="your comment" size="50"><br><br>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
</body>
</html>
Or, even a way to make a contact form of sorts, but it goes to an email that you input somewhere in the form.
The mailto can't be used with a form directly.
However, you can do something like this :
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.4.js"></script>
</head>
<body>
<h2>Send e-mail to someone#example.com:</h2>
<form action="#" id="myForm">
Name:<br>
<input type="text" name="name" value="your name"><br>
E-mail:<br>
<input type="text" name="mail" value="email#mail.com"><br>
Comment:<br>
<input type="text" name="comment" value="your comment" size="50"><br><br>
<button id="btnSend">Send mail</button>
<input type="reset" value="Reset">
</form>
<script>
$(function(){
$(myForm).submit(function(){
var mailto = "mailto:";
mailto += $("input[name=mail]").val();
mailto += "?subject=Your Email Subject (new comment)";
mailto += "&body=message from : " + $("input[name=name]").val() + " comment : " + $("input[name=comment]").val();
console.log(mailto);
window.open(mailto);
return false;
});
});
</script>
</body>
</html>
Basicly we agregate the field value and opend a new windows/tab with the mailto as url.
Note that it will open the mail client of the user (if he/she have one) and he/she will have to click send for the mail to go.
I am kind of new to javascript however I have created a submit form that I want to redirect me to a url based on form input. Here is my current code...
The issue I'm running into however is that the form is sending me the initial value rather than the updated form value (It is using "whatevs" no matter what).
HTML
<form id="Search-Form" onClick="genURL()"><label>Value: </label>
<input type="text" id="search" placeholder="Enter Value"></input>
<div id="search-buttons">
<input id="searchSubmit" value="whatevs" type="submit" tabindex="1" />
</div>
</form>
Javascript
function genURL() {
var searchSubmit = document.getElementById("searchSubmit").value;
window.location = "randomsite/view" + searchSubmit;
}
Add return and use onsubmit:
<form id="Search-Form" onsubmit="return genURL()"><label>Value: </label>
<input type="text" id="search" placeholder="Enter Value"></input>
<div id="search-buttons">
<input id="searchSubmit" value="whatevs" type="submit" tabindex="1" />
</div>
</form>
Revise function like so:
function genURL()
{
location.href = "randomsite/view" + document.getElementById("search").value;
return false;
}
If you were to use onclick, it would go on the button, not the form.
Aweber from data display javascript code something look like:
<script type="text/javascript">formData.display("name")</script>
<script type="text/javascript">formData.display("email")</script>
<script type="text/javascript">formData.display("phone")</script>
Now How can I use this in input filed value like:
<form method="post" action="">
<input name="name" type="text" value="<script type="text/javascript">formData.display("name")</script>">
<input name="email" type="text" value="<script type="text/javascript">formData.display("email")</script>">
<input name="phone" type="text" value="<script type="text/javascript">formData.display("phone")</script>">
<input type="submit" value="Go">
</form>
Reference: https://help.aweber.com/entries/21696333-How-Do-I-Display-Subscribers-Names-or-Email-Addresses-On-My-Thank-You-Page-
Please help me.
You can not simple place some code inside a value attribute hoping it will work, you need to appropriate JavaScript code to add the formData to the value attribute of the input field. You can do it with something like:
window.onload = function() {
document.getElementsByName('name')[0].value = formData.display("name");
document.getElementsByName('email')[0].value = formData.display("email");
document.getElementsByName('phone')[0].value = formData.display("phone");
}