Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
so, I made my own little server. I tried to make it so, that you have to Login in order to access its files. I tried Javascript, but of course that is the worst thing to do (because you can see the passwords and usernames in the source code):
<form name="login">
Användar: <input type="text" name="user" value="gast">
<br>
Lösenord: <input type="password" name="pw" value="">
<br>
<input type="button" OnClick="log()" value="Login">
</form>
and the log() method:
function log() {
if (document.login.user.value == "gast")
if (document.login.pw.value == "0000")
location.href="gast.html"
}
So, this is cleary not a good way to do it, if you actually want it to be somewhat secure... So does anybody have an idea how I could do this? With a databank perhaps? I'm pretty much a beginner with HTML and JS, so some help would be great :)
You should do authentication and authorization on the server-side.
I assume, you have a webserver running. Behind this webserver you have an application-interface, where the requests to your webserver are put forth to your application. This is the "place" where you should do your auth-processing.
And whatever language you use to write your server-side application, I am sure there are already libraries that help you in that task. Proper authentication and authorization can be tricky, and there is no need to reinvent the wheel (unless of course there is a good reason to do so...).
Just google for "{your-language} authentication" or "{your-language} Framework authentication", where {your-language} is the programming language, you want to use on the server-side.
Anyhow, if you have no need for a full application, and just want to serve plain websites, you webserver should have a method for "Basic-Authentication". Again, just google for: "{your-webserver} Basic Authentication".
Any login system needs to be serverside. Javascript is clientside. But there are many options depending on your server.
If you only have HTML and JS in your toolbox I'd look at using .htaccess if you are on a linux based server.
You can use jQuery. Its very easy, but verification through javascript is very dangerous and easy to challenge. I recommend to use PHP
$(document).ready(function() {
$("input[type='button']").click(function() {
var user = $("input[type='text']").val();
var pass = $("input[type='password']").val();
if (user === "gast" && pass === "0000") {
location.href = "gast.html";
} else {
alert("bad password!");
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<form name="login">
Användar:
<input type="text" name="user" value="gast">
<br>Lösenord:
<input type="password" name="pw" value="">
<br>
<input type="button" value="Login">
</form>
EXAMPLE1
when you must use javaScript, I recommend use Javascript Obfuscator: Javascript Obfuscator It's safer:
eval(function(p,a,c,k,e,d){e=function(c){return c};if(!''.replace(/^/,String)){while(c--){d[c]=k[c]||c}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('$(12).13(4(){$("1[0=\'11\']").9(4(){6 7=$("1[0=\'14\']").3();6 5=$("1[0=\'2\']").3();18(7==="8"&&5==="20"){17.16="8.19"}15{21("10 2!")}})});',10,22,'type|input|password|val|function|pass|var|user|gast|click|bad|button|document|ready|text|else|href|location|if|html|0000|alert'.split('|'),0,{}))
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<form name="login">
Användar:
<input type="text" name="user" value="gast">
<br>Lösenord:
<input type="password" name="pw" value="">
<br>
<input type="button" value="Login">
</form>
EXAMPLE2
Related
Hey guys I am new to web development. I am currently trying to learn JavaScript.
At the moment I am trying to create a page where when it loads up, the page will ask for the user to input his/her zip code. Now I have a specific zip code that I want the user to input which is 11385. Now, after the user inputs the zipcode I want JavaScript to check if that zipcode is 11385, if it is 11385 I want an alert to pop up and for it to direct me to another page.
I am trying to teach myself coding so I don't really have anyone to ask if you could bear with me. Thank you in advance your help is greatly appreciated.
<form action="c:/users/lui/desktop/index.html" method="post" onsubmit="return ver()">
<fieldset>
<legend>zip code Information</legend> <label for="shippingName">Name:</label>
<input type="text" name="Name" id="shippingName" required><br/>
<label for="billingzip">Zip code:</label> <input type="text" name="zip" pattern="[0-9]{5}" required><br/>
</fieldset>
<input type="submit" value="Verify" />
</form>
<script>
function ver() {
var eje = document.getElementById('zip_code');
if (eje.value == 11385) {
alert("thank you");
}
return true;
}
</script>
Welcome to StackOverflow.
You forgot to give your zip input the id zip_code. This is why the DOM query in your ver function always resolves to null.
As for the redirecting, check the answer of unknown coder, or, for a little more context, the MDN docs on Window.location. Your check could look something like this:
if (eje.value == 11385) {
alert("thank you");
window.location = "redirect.html";
}
In JS you can redirect using
window.location.href = 'some url'
that's all you need to add after you validate your input value
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I need to create a html page that will accept inputs from one webpage then print out the user results on a seperate HTML page. So far I have this. When I go and check my action_page.php file nothing is being written into it. Is there anyway I can have my inputs print directly on a second HTML page and constantly updating? Also is there any way for an outside application to control or change the values that are shown on the second webpage?
So I guess a more clear description of what I am trying to do is on one page its accepts input A,B,C then on another html page that have the previous A,B,C values I would like to update the values with the new user submitted values. The second webpage needs to also be static in the sense that the first html page would be website.com/UserInput and the second html page would be website.com/PrintedUserInput. I hope that helps. Thanks
<html>
<body>
<form action="action_page.php">
Time:
<br>
<input type="number" name="Time" value="">
<br>
Temperature:
<br>
<input type="number" name="Temperature" value="">
<br>
Instant Brew:
<br>
<input type="number" name="InstantBrew" value="">
<br>
<br>
<input type="submit" value="Submit">
</form>
<p>If you click "Submit", the form-data will be sent to a page called "action_page.php".</p>
</body>
</html>
All you have to do, is put the "method" attribute to your form like this:
<form action="action_page.php" method="post">
You absolutely need a server side language then to print them out. Since you use your page with the PHP extension, I'm guessing you're using PHP. So then you can call them that way in your other page:
<html>
<body>
Time: <?= $_POST['Time'] ?>
<br>
Temperature: <?= $_POST['Temperature'] ?>
etc, where the name you put between your POST braces is the "name" attribute of your input. Note that name attribute is case sensitive
Hope it helped !
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I want to add values to my MySql database using PHP. The values I want to add, will come from the text-boxes of a form. I tried $variable = $_POST['formElementName'] and used $variable to insert values. But it doesn't work.
Question:
How can I put the values of the text-boxes into variables?
Thanks.
Use below code for the form
<form name="form-name" action="" method="POST">
<input type="text" name="fieldname1" value="" />
<input type="text" name="fieldname2" value="" />
</form>
and for php manipulation at server end, you will get values in $_POST i.e.
$_POST['fieldname1'] and $_POST['fieldname2]
I just want to elaborate what #Kyle wrote
Note: The form method is POST
HTML part
<form action="your_php_file_name.php" method="POST">
<input type="text" name="first_name" />
<input type="submit" value="Submit" />
</form>
PHP part: The file name is: your_php_file_name.php
<?php
//A good practice to check the type of HTTP request
$fname = $_POST['first_name'];
?>
Some good practices
Check the HTTP request type sent from the client side. (I find it a good way)
Sanitize the variables before inserting.
Here's an idea:
Client-side:
<input type="text" name="first_name">
Server-side:
$var = $_POST["first_name"];
Just to add to Kyle's answer above, Make sure you have value="Something" set, otherwise it will return nothing.
<input type="text" name="first_name" value="Testing">
Server Side
$var = $_POST["first_name"];
For debugging I use:
print_r($_POST)
This will return all the POST values set and is really handy.
I know I can pass query parameters from a form and expect them in the query string:
<form method="GET">
<input type="text" name="param" value="value" />
<input type="submit" value="submit" />
</form>
This results in
http://blah-blah-blah/blah?param=value
However, in my webapp, I'm using path parameters. To access a single book, #459, in the library, you'd visit
/books/459
and to check one out, POST to
/books/459/checkout
where 459 is a path parameter. When I try
<form action="/books/{book_id}">...</form>
it takes me to
/books/%7Bbook_id%7D
rather than
/books/459
Do I need javascript or something to build the URI?
Thanks to RobG
I have used the same thing in calling WhatsApp from mobile application
It works beautifully
<form action="https://wa.me/"
onsubmit="this.action = this.action + this.mobile.value; this.submit();">
<input type="tel" name="mobile" size="10" value="91xxxxxxxxxx"/>
<input type="text" name="text" value="Thanks Vijayan!" />
<input type="submit" value="WhatsApp" />
</form>
You may need something like:
<form onsubmit="this.action = this.action + this.book_id.value;" ...>
However, making the action dependent on scripting is poor design. It is much more robust for your server to deal with the URI ...?book_id=value, which does not require any client script at all.
If you are generating your HTML with PHP, the code below should work (untested).
$book_id = 459;
<form action="/books/{$book_id}">...</form>
Alternatively, you could dynamically modify the html using JavaScript. It is better not to do it this way because some users may disable JavaScript. (untested)
$('form').attr('action','/books/' + book_id);
I have a form that looks like this:
<form method="post" id="aodform">
<label for="a">Animal:</label>
<input class="input" type="text" name="a"/>
<label for="s">Sausage:</label>
<input class="input" type="text" name="s"/>
<label for="g">Bird:</label>
<input class="input" type="text" name="g"/>
<label for="d">Dessert:</label>
<input class="input" type="text" name="d"/>
<input id="submitter" type="submit"/>
</form>
I need to take the entered values in the form and overwrite (replace) the corresponding node's text value in an EXISTING XML file that looks like this:
<aod>
<animal>x</animal>
<sausage>x</sausage>
<bird>x</bird>
<dessert>x</dessert>
</aod>
Now, I know I can use
$("#aodform").submit();
to achieve a form submit in Jquery, but after this I'm lost! I'm trying to figure out how to get those form values, store them as variables in a function that then writes to the XML file (all in Jquery).
I've searched all over the google box and found similar subjects, but not quite similar enough to help my situation. Would someone please help me? Thank you!
P.S. I CAN NOT use any server-side language, like PHP, or else I would.
You won't be able to create or edit a local XML file using javascript/jquery because of security concerns. Imagine going to a website and the webmaster wrote some code doing who knows what and puts this in a file on your computer...
The only way to write to a local file using javascript is to use cookies or HTML5 localStorage.
localStorage will allow you to store string keys and values of arrays and/or property names and values of objects.
If you need an XML file you will have to call a server-side script that has permission to write the file on the server, which you can then access via it's url.
jQuery and Javascript on the client-side cannot persist to the server side. It has no access to write to code. You will have to gain access to a server-side language, or make use of some cloud-based services (you could, for example, persist to Amazon 3S, or a MongoDB or something of that nature, through Javascript API calls, on a cloud service).
While you could use Javascript/jQuery to construct an XML object in the client, you would then have to submit that to some server-side script to save it to a file.
Sorry to be the bearer of bad news, but you will need to get into something a bit more full-featured, if you want to be able to get this done.
You have to send Labels within hidden inputs, etc:
<form method="post" id="aodform">
<label for="a">Animal:</label>
<input type="hidden" name="a_label" value="Animal"/>
<input class="input" type="text" name="a"/>
<label for="s">Sausage:</label>
<input type="hidden" name="s_label" value="sausage"/>
<input class="input" type="text" name="s"/>
<label for="g">Bird:</label>
<input type="hidden" name="g_label" value="bird"/>
<input class="input" type="text" name="g"/>
<label for="d">Dessert:</label>
<input type="hidden" name="d_label" value="dessert"/>
<input class="input" type="text" name="d"/>
<input id="submitter" type="submit"/>
</form>
and then in PHP you access pairs:
$name = "a"; // "s", "g", "d"
$tag = $_POST[$name.'_label'];
$value = $_POST[$name];
$xml_element = "<$tag>$value</$tag>";
OR
use same name as label and then use:
foreach($_POST as $key => $value)
{
$xml_element = "<$key>$value</$key>";
...
}