PDA

View Full Version : shifting text in input box


totalhosting
09-06-2005, 04:00 AM
Hi.

If I have a text box that is only 40 wide, and I have a 150 character string that I need someone to copy and paste into text input. Once they paste it in, they are looking at the end of the string. What I would like is to onBlur basically do what can best described as "hitting 'home' inside the text box, thereby taking you to the front of the string."

The visitor needs to see the beginning of the string to get the information for the next text input.

Another idea, which would be even sweeter would be to have a way create identical sets of form inputs, based on the number required, as selected by the end user.

For instance, my form is for class registrations. If someone wants to sign up for 4 different courses at once, I would like to have the user select "4" from a "ClassNum" list, and then have 4 sets of the information gathering inputs created and autoincremented for variable separation.

I would like to have manage only one select list of all the classes available.

One other thing that would be to keep people from having too much control, I would also think it was smart to deactiave ClassNum once you start entering (unless there was a way to save values, if someone decides the way to register for only three classes, and tries to change the drop-down. I assume that would erase all the settings.)

If anyone knows of script bits that could be cobbled together, that would be sweet.

Thanks.

Pesto

rm-f
09-06-2005, 02:33 PM
Could you post here the test code sample you have problem with.

totalhosting
09-06-2005, 03:27 PM
Thanks for reading.

I wish I knew where to start. I don't have any code, as of yet.

This is the form:
http://www.cookntell.com/register/register_for_classes/register-today.shtml

So as you scroll down the form, the user needs to enter the class they wish to attend.

To get the list, there is a pop-up text file with all the classes. The visitor needs to copy and paste the class from the list.

Once they do, they are looking at the end of the text string. If, before you tab or click out of the input box and you hit "home" your cursor moves to the #1 position and shows you the first part of the string.

I would like to simulate that action onBlur when the customer goes to the next text box. Because the first part of the string contains the price of the class, so they will need that information later in the form.

Hope that helps.

Pete

rm-f
09-06-2005, 04:44 PM
<html>
<head>
<script>
function showFromStart(fld) {
fld.value = fld.value;
return true;
}

</script>
</head>
<body>
Copy manualy this text to any input field.<br>
<input type="text" onblur="javascript: showFromStart(this);"><br>
<input type="text" onblur="javascript: showFromStart(this);"><br>
<input type="text" onblur="javascript: showFromStart(this);">

</body>
</html>

You shoule use a Select field or an automatic copy from popup window.

totalhosting
09-06-2005, 06:26 PM
Auto copy would be great. Do you have a link to a script?

I would rather use the SELECT, but the list is maintained by the end-user of the site. They wouldn't know how to set up the form every few months as the new classes roll out.

I am going to get them on Mambo in a few months, and there is a registration module that would be perfect for all of this.

Thanks very much for your help.

Pesto

rm-f
09-06-2005, 09:28 PM
or a popup

<html>
<head>
<style>
#popup1 {
position: relative;
background-color: #c0c0c0;
top: 0px;
left:150px;
width: 100px;
visibility: hidden;
}
</style>

<script>
function showPopup() {
document.getElementById('popup1').style.visibility = 'visible';
document.getElementById('popup1').focus();
}

function putTxtAndClose(txt) {
document.getElementById('txt1').value = txt;
document.getElementById('popup1').style.visibility = 'hidden';
}
</script>
</head>

<body>
<input id="txt1" type="text" readonly>
<button onclick="showPopup();">Select Training</button>
<div id="popup1">
<table border="0" cellspacing="0" cellpading="0">
<tr><td><button onclick="putTxtAndClose('123')">123</button></td></tr>
<tr><td><button onclick="putTxtAndClose('456')">456</button></td></tr>
</table>
</div>
</body>
</html>