Display and Change HTML input fields - javascript

I have a PHP file where username and age are getting set. All I am trying to do right now is get their value to display it in an alert. I will be changing the values later (hence why you see the method="POST"). Right now I just want to grab the values and see what they are. But it looks like I am missing something or doing something wrong. Ultimately, I want to be able to change username, and age, and submit the form without user interaction (this is where I am really stuck). I'd appreciate any advice. Thank you very much.
In loaduser.php I have done the following:
<input id="username" type="text" name="username" value="<?php echo $username ?>">
<input id="age" type="number" name="age" value="<?php echo $age ?>">
Then in change.html I am doing the following:
<body onload="document.forms[0].submit()">
<form action="/loaduser.php" onsubmit="" method="POST">
</form>
<script type="text/javascript">
function submitform()
{
alert(document.getElementById('username').value);
alert(document.getElementById('age').value);
}
</script>
</body>
My hunch is that I may have used this line incorrectly, but I am not sure.

without the php it looks like this. When clicked on the submit button it will post your data to loaduser.php (tip : use F12 on your browser to see network traffic / errors on page) . Good luck
<form action="/loaduser.php" method="POST">
<input id="username" type="text" name="username" value="waarde">
<input id="age" type="number" name="age" value="leeftijd">
<input type='submit'>
</form>
https://plnkr.co/edit/rH6QunyZewm1MZbUYPAd?p=preview

Related

Is hiding the post button a valid way to prevent a user from posting without permission?

I have some comment forms that I want to not be used unless the user is logged in with Google+. I initially have the "submit" button on my forms hidden by the CSS display:none property. I call javascript when the user logs in to change it back to display:inline.
Is this a valid way to prevent anonymous users from posting, or am I still vulnerable by leaving the rest of the comment form open for writing and whatnot...is there some clever way to submit the form without the submit button?
<form action="" method="post" name="form1" id="make">
<fieldset>
<legend id="makelegend">Log in to Post a Reference</legend>
<input type="hidden" name="loginname" id="loginname" />
<input type="hidden" name="logintype" id="logintype" />
<input type="hidden" name="loginspecial" id="loginspecial" />
<input type="hidden" name="reply" id="reply" value="0" />
<input type="hidden" name="identity" id="identity" value="<?php echo htmlspecialchars($_GET['pageno']); ?>" />
<p><label for="posneg">Positive or Negative?
<select name="posneg">
<option value="p">Positive</option>
<option value="n">Negative</option>
</select></label></p>
<textarea name="comment" rows="5" cols="70"></textarea>
<input type="submit" id="submitter" value="POST" style="display:none;" />
</fieldset>
</form>
It is ABSOLUTELY NOT safe! You're just not displaying the data to the user, but anyone who looks at the code can still find it - or just send the request manually. I can't stress this enough: ALWAYS use server-side validation! It's fine to validate things in the browser as well, but it's not a substitute for proper security measures.

PHP show/hide form in a website maker platform

I am using this site to make a website. This website maker is easy to use because the elements are just drag and drop but you can also add your HTML code.
In one of my pages, I have inserted an HTML code which is a form. The form's process is to ask for a password, then with the GET method, it will check if the password is correct, if correct, another form will show. I use PHP language to process the checking of password. The problem that I encounter is, when the right password is entered, it does not show anything, even if I have put the right id. This is the preview site
HTML Code
<form name="password" id="password" style="width:300px;" method="get" action="http://link.co/transfer/password_protect_transfer.php">
<label for="password">
Enter password:
</label>
<input type="password" id="1151457790" name="password" required=""/>
<input type="submit" id="submit" name="submit" value="Submit"/>
</form>
<form name="transfer" id="transfer" method="POST" action="http://link.co/transfer/transfer.php" style="display: none;">
<select id="affAccts" name="affAccts" required="">
Select an account:
<option value="A">
A
</option>
<option value="B">
B
</option>
<option value="C">
C
</option>
</select>
<br/>
<label for="name">
Enter name:
</label>
<input type="text" id="name" name="name" required=""/>
<input type="submit" value="Join"/>
</form>
PHP
<?php
$pw = $_GET['password'];
if($pw == "Admin1234"){?>
<script type="text/javascript">
$('#password').hide();
$('#transfer').show();
</script>
<?php}else{?>
<script type="text/javascript">
alert("Access Denied!");
location.reload();
</script>
<?php
}
?>
Judging only from the preview site, I say it's a problem with the platform you are using. Once you submit a form with get method you should see the values in the URL. There is no change in the URL when I submit the password.
Part of the issue you're facing is that when the password is incorrect, you're calling location.reload(); to reload the page. GET is putting the password in the URL, so every time the page reloads, it will re-evaluate whether or not it's correct and reload again (because it's still incorrect). A loop.
I would suggest changing the form method from GET to POST.
To narrow down the issue further, simplify the JavaScript a bit. E.g. instead of calling some jQuery functions:
<script type="text/javascript">
$('#password').hide();
$('#transfer').show();
</script>
Maybe just try some simple alert statements (e.g. alert('password good');) until you know the right code is firing in the right places. I copied your code to a local test machine and I had to make quite a few adjustments to get things to work right.
You have some flaws in your PHP: if/else sets don't work outside of the PHP, they need to terminate. For example:
<?php
$pw = $_GET['password'];
if($pw == "Admin1234"){
echo '
<script type="text/javascript">
$("#password").hide();
$("#transfer").show();
</script>
';
}else{
echo '
<script type="text/javascript">
alert("Access Denied!");
location.reload();
</script>
';
}
?>

How do I prevent a pre-set INPUT value from being changed?

I have a form where some fields are completed by loading information from a database. These fields can vary from one account to another.
When the form is submitted any database information will be sent along with new information entered in the form.
However, the user is able to change (on screen) the information entered from the database, and although these changes are not submitted (my $Xvariables from the database override the POSTed $variables), I would like them to revert the on-screen data back to the database value.
Here is an example of what I have at the moment, but it does not work ...
<input type="text" name="firstname" size="25" tabindex="4" onchange="if($xfirstname<>'') this.value=$xfirstname" value="<?php echo $firstname;?>"/>
or better still, if there is a way, how can I make them unchangable if they have a value loaded from the database ?
Just place readonly="readonly" within the input <> tags or place disabled="disabled"
Example
<input type="text" name="firstname" size="25" tabindex="4" onchange="if($xfirstname<>'') this.value=$xfirstname" value="<?php echo $firstname;?>" readonly="readonly" />
Keep this:
<input type="text" name="firstname" size="25" tabindex="4"
value="<?php echo $firstname;?>"/>
Add this: Edit: Sorry did not see it has no ID on the input element use this:
<script>
if($('input[name="firstname"]').val().length > 0)
{
$('input[name="firstname"]').attr("disabled", true);
}
</script>
Result :http://jsfiddle.net/4wt9r/6/
But keep in mind anything on the client can be changed, your true filtering/authenticating must be done on the server.

Mimicking a login form...

We have an internal application that requires the same username/password across the board.
However, if the login fails too many times, then the account is locked for that username.
We can't change the lockout because that will affect the public facing site as well.
I have been asked to come up with a way to essentially, click a button and auto-login.
Initial research has brought me to this script... (Credit)
<!doctype html>
<!-- saved from url=(0014)about:internet -->
<html>
<title>Auto Login</title>
</head>
<body>
<form id="loginForm" name="loginForm" method="post" action="http://mail.google.com">
<select name="uni_url" id="logServer" class="validate[required]">
<option class="" value="" fbUrl="" cookieName="" >
Test_en
</option>
</select>
<input id="loginName" name="name" type="text" value="Username" class="" />
<input id="loginPassword" name="password" type="password" value="ExamplePassword" class="" />
<input type="hidden" id="loginKid" name="kid" value=""/>
</form>
<script>document.loginForm.submit();</script>
</body></html>
...but I can't seem to get it to work for me.
So, I found another option where I can create a small html file (form) with a submit button, that does - onload="form1.submit();", and this could basically log me into this website without having to key in any login information.
Not sure where to start with mimicking a login form like this and need a good direction to get started in.
Thoughts?
Let's assume your existing login form looks like this:
<form action="/login.php" method="post" id="loginform">
<input type="text" name="username" />
<input type="password" name="password" />
<input type="submit" />
</form>
On your "auto-login" (which is really an auto-submit) page you want to mimic the same structure as before but:
Add in values to be submitted (static username and password?)
Optionally remove the submit button (if you know your users have JS enabled then you can get rid).
Add some JS that automagically submits the form for you.
That might give us something like this:
<form action="/login.php" method="post" id="loginform">
<input type="text" name="username" value="gvee" />
<input type="password" name="password" value="hunter2" />
</form>
<script type="text/javascript">document.forms[0].submit()</script>
The javascript will essentially look for the first form on the page (forms[0]) and submit that.
Update
Upon further inspection your existing login form is a bit of a funny onion. Instead of submitting the form directly, it's calling a function called doLogin() that sets certain hidden properties.
Therefore, instead of submitting the form, we should mimic the same behaviour (i.e. call doLogin() instead of .submit()).
One key thing here is that you'll want to only call the function after it has been declared. Simplest solution is to put our added bit of script at the very bottom of the HTML.
<script type="text/javascript">doSubmit();</script>

How can I force a form to submit using JavaScript when a person hits the space bar in the input field?

Is that possible? Google searches are leading me nowhere.
My Sample form:
<form action="search.asp" method="post" name="form1">
User ID <input type="text" size="15" name="userid"><p>
Last Name <input type="text" size="15" name="lastname"><p>
School <input type="text" size="15" name="school"><p>
District <input type="text" size="15" name="district"><p>
Email <input type="text" size="20" name="email"><p>
<input type="submit" value=" Go Search! ">
</form>
This needs to work from any input box on the form. I tried onkeyUP but wouldn't work or I probably wrote it wrong. I am no javascript expert. Any ideas?
I don't know why you'd do this, but in Firefox, you would write:
<form action="search.asp" method="post" name="form1" onkeydown="if(event.keyCode == 32) this.submit(); return false;">
Check here to see how to retrieve other browsers' key codes.
Again, this is how you would do it, but I think it's a bad idea.
The whole form to submit whenever a space is detected by may be a little messy, but what's interesting is to do it for a specific input. I used it in a field where user gives some tags. Each tag must de only one word,and so the space character can be used as an event to store the given tag and wait for the next.
<input type="text" id="tagtextbox" onKeyUp="if(event.keyCode == 32) myfunction();" />

Categories