Text box that submits user entry to custom url 1

delt23 · Feb 16, 2012

I have a simple concept i'd like to accomplish on my php site. We take photos for people and give them a code to look for their photos in a weeks time. The code given is their employee id badge number.

I need to make a:
text box + submit button

The user inputs their code, and hits submit.

The form/action combines "

http://www.company.com/images/"

+ "employeeid" + ".jpg" (adds .jpg at the end as the photo will be inside the images folder with the employees id number). (i.e. it opens up

http://www.company.com/images/12345.jpg)

I have been wracking my brain on these for three days now and can't get it to work properly.

I would greatly appreciate any help.

vacunita · Feb 16, 2012

You can't do it with standard HTML alone, you would need some kind of programming language like Javascript to do that.

Or have a server-side script gather the values passed from your form and use them to redirect to the appropriate picture.

alternatively you could simply have the Javascript dynamically change an image tag's src attribute to show the relevant picture based on the form inputs.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

delt23 · Feb 17, 2012

Thanks, well any direction or instructions or code on how to accomplish this would be great. I don't know how to proceed at this point. I've hit a wall at my current capabilities.

ChrisHirst · Feb 17, 2012

you will have to use serverside code.

forum333

forum655

forum434

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

vacunita · Feb 17, 2012

Which route do you want to take?

The server-side route would depend on what programming language your web server supports.

Either of the JS versions require nothing from the server and would be trivial to implement.

As an example here's a basic JS version of my last suggestion:

Code:

<html>
<head>
<script type="text/javascript">

function getEmployeePic(formObj){

var imgObj=document.getElementById("employeePic");

imgObj.src="[URL unfurl="true"]http://www.company.com/images/"[/URL] + formObj.employeeID.value + ".jpg";

return false;

}
</script>
</head>
<body>
<form action="file.html" method="POST">
<input type="text" name="employeeID">
<input type="submit" value="Get Picture" onclick="return getEmployeePic(this.form);">
</form>

<img src="default.jpg" id="employeePic" alt="Employee Pic"/>

</body>
</html>

This of course is very basic, and has no error checking in case the employee id was wrong and can't find a pic or there is no pic for that particular employee etc... Also if the picture file size is large there may be a delay in showing the pic depending on the connection to the server holding the images.

For further help I would suggest forum216 if you want to follow the JS alternative, or one of the server-side programming forums:

forum434
forum333
forum232

If you want a more robust solution in the back end.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

delt23 · Feb 23, 2012

Vacunita, I just wanted to say that what you provided me with did the trick perfectly. I tweaked it a little, but it's really all I needed. I have a lot more to learn, but I have a better understanding thanks to your script.

vacunita · Feb 23, 2012

Glad I could help.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech

feherke · Feb 23, 2012

Hi

delt23, here on Tek-Tips we used to thank for the received help by giving stars. Please click the

★ [navy]Thank vacunita
and star this post![/navy]

at the bottom of vacunita's post. That way you both show your gratitude and indicate this thread as helpful.

Feherke.

http://feherke.github.com/

IPGuru · Feb 24, 2012

Just for guidance
Javascript alone should not be trusted to verify user inputs
if this was a public site & not just on a private network then it would be very insecure.

A Maintenance contract is essential, not a Luxury.
Do things on the cheap & it will cost you dear

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Text box that submits user entry to custom url 1

delt23

Technical User

vacunita

Programmer

delt23

Technical User

ChrisHirst

IS-IT--Management

vacunita

Programmer

delt23

Technical User

vacunita

Programmer

feherke

Programmer

IPGuru

Vendor

Similar threads

Part and Inventory Search

Sponsor