Page 1 of 1
Insert Form fields into URL
Posted: Mon Dec 06, 2004 12:31 am
by jimboscomp
HI!
I have a service in which people can log on to my server via FTP and use it as a file storage thing, etc... Well the only thing is, they have to login by going to an IP address, which can be hard to memorize. So what I wanted to do was put a page on my website where they could insert their username and password, and it would log them into the server automatically.
The way I want it to work is the 2 fields be named username and password, then have it where the code like inserts those 2 fields into the URL.
So I guess what I'm asking is if the person puts TEST as the username and TESTER as the password, it would send them to this URL:
ftp://TEST:TESTER@66.27.173.156
I wanted to know if there is any way I can create a javascript code that would be able to do that? Any help is greatly appreciated!!!
Jimmy Clack
Jimboscomp.com
Posted: Mon Dec 06, 2004 1:20 am
by rks
One way to do this with JavaScript is to alter the form's submit value when the user clicks a button:
Code: Select all
<html>
<head>
<script type="text/javascript">
function open_ftp()
{
var ftp_form = document.forms.ftp_login;
ftp_form.action = 'ftp://' + ftp_form.username.value + ':' + ftp_form.password.value + '@66.27.173.156';
ftp_form.submit();
}
</script>
</head>
<body>
<form id="ftp_login" name="ftp_login" action="#" method="get">
<label for="username">username: </label><input type="text" name="username" id="username" maxlength="50" />
<label for="username">password: </label><input type="password" name="password" id="password" maxlength="50" />
<input type="button" onclick="open_ftp();" value="Go to FTP site" />
</form>
</body>
</html>
You could also do this without JavaScript by sending the user to a PHP page, writing (and hopefully validating) the URL, and redirecting the browser. It should be transparent:
Code: Select all
<?php
if (isset($_POST['form_id']) && $_POST['form_id'] === 'ftp_login') {
// validate the POST data (not shown)
$url = 'ftp://'.$_POST['username'].':'.$_POST['password'].'@66.27.173.156';
header('Location: '.$url);
}
?>
<html>
<head>
</head>
<body>
<form id="ftp_login" name="ftp_login" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<input type="hidden" id="form_id" name="form_id" value="ftp_login" />
<label for="username">username: </label><input type="text" name="username" id="username" maxlength="50" />
<label for="username">password: </label><input type="password" name="password" id="password" maxlength="50" />
<input type="submit" value="Go to FTP site" />
</form>
</body>
</html>
No guarantees on the browser compatibility of my JavaScript example.
/rks
Posted: Mon Dec 06, 2004 1:23 am
by ol4pr0
Put this between the <body>
and call the file test.html
If u want to change the file.html name dont forget to alter the form action="?.html"
Code: Select all
<script language="javascript">
function displayLogin() {
var login= "";
var pass= "";
var host="127.0.0.1"; // put here the ip of ftp.
login = document.myForm.ftpLogin.value;
pass = document.myForm.ftpPass.value;
document.write("FTP: <a href=ftp://" + login + ":" + pass + "@" + host + ">CONNECT</a>");
}
</script>
<form name="myForm" action="test.html" method="post">
<input type="text" name="ftpLogin" id="ftpLogin" size="20" maxlength="25" /><br />
<input type="text" name="ftpPass" id="ftpPass" size="20" maxlength="25" /><br />
<input type="submit" name="submit" value="Submit" onclick="displayLogin( )">
</form>
There u go. 2 text fields for entering a user and pass than click submit
simple but working

Posted: Mon Dec 06, 2004 2:26 am
by timvw
imho the best (known) solution is using DNS here. It allows people to remember a relative easy name instead of some difficult ip
Posted: Mon Dec 06, 2004 2:49 am
by mchaggis
Personally, I prefer using bookmarks for remembering addresses but hey ho
But the code above, imho, would help people when the IP address is likely to change on a more regualr basis that DNS isn't the best solution, also were you don't have access to a dns server (and yes there are free services like DynDNS but not always that remeberable)
Posted: Mon Dec 06, 2004 10:11 am
by jimboscomp
Wow thanks guys for the codes! I'll be sure to go on over and try them out ASAP!
MANY MANY THANKS!
Jimbo
Posted: Mon Dec 06, 2004 11:21 am
by jimboscomp
=/ the second javascript code works...in the form of creating a hyperlin on another page...but the earlier codes (javascript and php) posted don't work.
the php code displays " method="post"> before the form fields...and when i click on login it won't do anything, and the javascript code doesn't import the form fields to the URL.
if you want to see the php code at work, it's this link:
http://www.hillcrestchristianschool.org/login.php
Thanks
Posted: Mon Dec 06, 2004 12:34 pm
by rks
Hm, sorry about that. There might be something like a character encoding issue going on -- when I d/l the code from your site and run it on my server I get all sorts of parse errors and hidden characters.
But when I copy from this forum and paste, it runs OK:
http://robotomy.net/login.php
What editor are you using? What character-encoding is your server sending output as? (Note that I didn't bother to specify character encoding in the HTML I posted).
/rks
jimboscomp wrote:=/ the second javascript code works...in the form of creating a hyperlin on another page...but the earlier codes (javascript and php) posted don't work.
the php code displays " method="post"> before the form fields...and when i click on login it won't do anything, and the javascript code doesn't import the form fields to the URL.
if you want to see the php code at work, it's this link:
http://www.hillcrestchristianschool.org/login.php
Thanks
Posted: Mon Dec 06, 2004 12:44 pm
by mchaggis
If you want a complete javascript solution, you could try this:
Code: Select all
<html>
<head>
</head>
<body>
<form id="ftplogin" name="ftplogin">
<input type="hidden" id="form_id" name="form_id" value="ftp_login" />
<label for="username">username: </label><input type="text" name="username" id="username" maxlength="50" />
<label for="username">password: </label><input type="password" name="password" id="password" maxlength="50" />
<input type="button" value="Go to FTP site" onclick="self.location='ftp://'+document.ftplogin.username.value+':'+document.ftplogin.password.value+'@66.27.173.156/'" />
</form>
</body>
</html>
Posted: Mon Dec 06, 2004 1:10 pm
by jimboscomp
I am using Dreamweaver right now, at home I will either use dreamweaver or Frontpage. My site is opriginally built off of Frontpage but I will be using dreamweaver for some things later on the development of the site. And I don't know what character encoding the server is putting out because it is not my server but the server that my school's wbesite is hosted on, my server is basically the same thing though so it's a very similar server to do my testing on. I will test out the code on my server. Thanks
I was able to login using that page that you supplied to me. I want to ask if it is supposed to show it as the FTP root when you first login? doesn't matter, just asking.
Posted: Wed Dec 08, 2004 10:33 am
by jimboscomp
Hey, I just went to Javascript instead of php, I was having tons of php problems in the other code, I think what I was asking was too much for the php. I think from now on I'll stick to using php ONLY with MySQL systems.
Thank you ol4pr0 for the javascript code that was provided! With a simple couple of modifications I was able to login to the mDisk in a matter of seconds.
Posted: Wed Dec 08, 2004 11:39 am
by Archy
If the user has Javascript turned off, then he/she will be unable to access the ftp site. If you are doing something such as this, I would reccomend using a language which users cannot control, such as PHP.