Text already in input fields

**pedro93** · 09-02-2011 05:57 PM

Hi there.

I am wanting a little help with something here

hope yous can help.

I have 2 input fields.

Input 1: Website URL
Input 2: Website Directory

Firstly I would like the "http://" to automatically appear in input one and two and it can't be edited or removed.

Then what ever is typed in input one, I wold like it to automaticcal copy into input 2, and the user can't delete whats in input 2 without going thourgh input 1.

Then lastly the user can add data into input 2, without input 1 changing.

Here is an example:

Red = Can't be deleted Green = Can be changed Blue = additional text to input 2

Input 1: http://www.yourwebsite.com/
Input 2: http://www.yourwebsite.com/extra/directory

Does anyone know how to do this?
Thanks
Peter

**DanInMA** · 09-02-2011 09:52 PM

why dont you just put the uneditable text in plain text, next to the input boxes? when you receive the data server side just add the extra data

**DanInMA** · 09-02-2011 09:59 PM

ill wirte an example.

**DanInMA** · 09-02-2011 10:24 PM

you could do this

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>

<body>
<form action="" method="get">
http://<input name="sitename" id="sitename" type="text"  onKeyDown="updatesitename();" ><br><br>
http://<span id="updatesitename"></span><input name="sitedir" id="sitedir" type="text"><br>
<input name="" type="submit"></form>
<script type="text/javascript">
<!--

function updatesitename(){
 document.getElementById('updatesitename').innerHTML = document.getElementById('sitename').value;
}

//-->
</script> 
</body>
</html>

**pedro93** · 09-03-2011 05:47 PM

Originally Posted by DanInMA

you could do this

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>

<body>
<form action="" method="get">
http://<input name="sitename" id="sitename" type="text"  onKeyDown="updatesitename();" ><br><br>
http://<span id="updatesitename"></span><input name="sitedir" id="sitedir" type="text"><br>
<input name="" type="submit"></form>
<script type="text/javascript">
<!--

function updatesitename(){
 document.getElementById('updatesitename').innerHTML = document.getElementById('sitename').value;
}

//-->
</script> 
</body>
</html>

Hi there.
I was thinking that actually, and with a little magic with CSS I can make it look like it's in the input box. Thanks

Peter

Thread: Text already in input fields

Thread Tools

Display

Text already in input fields

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions