How do I create a button for clients to upload photos on a site?

**johny10151981** · Aug 4 '10, 06:59 AM

What do you mean by real time?
if you mean upload time by realtime then it is realistic and the basic of web page design

**Melchizedek** · Aug 4 '10, 12:12 PM

Realtime photo postings...

thanks for replying. what I mean by realtime is that it will post right away. Here is my site : www.parkviewanimalfriends.com/contestpage.com

Here is the whole page :

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Photo Page</title>
<script type="text/JavaScript">
<!--



function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
<style type="text/css">
<!--
body {
	background-color: #FFFFFF;
}
.style12 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
}
.style14 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }
.style15 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.style16 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; }
-->
</style>
</head>

<body>
<table width="612" height="779" border="0" align="center" background="http://bytes.com/images/photo_upload_background.jpg" bgcolor="#FFFFFF">
  <tr background="http://bytes.com/images/photo_upload_background.jpg">
    <th height="664" bgcolor="#CCCCCC" scope="col"><div align="center"></div>
    <iframe frameborder="0" name="objectFrame" height="462" marginheight="1" marginwidth="1" scrolling="no" style="border:0px" width="500" src="/tinc?key=QhdUJ3qn&preview=1&only_object=1"></iframe>      &nbsp;</th>
  </tr>
  <tr>
    <td height="109" align="center" valign="top" bordercolor="#FFFFFF" bgcolor="#FFFFFF" scope="col"><p><strong><span class="style14">The winner will receive the following goodies:<br />
    Free Exam &amp; Consultation, Free 10lb bag of Hills R/D diet,<br />
        Phone call 
        support, Weekly weigh-ins</span></strong></p>
      <p><span class="style12">Share Your Pet Photo</span></p>
      <p class="style15">Are you ready to share that adorable photo?<br />
      Just complete this brief form, browse to the photo on your<br />
      computer and click the submit button.      </p>
      <p class="style15">Items marked with <b style="color: red;">*</b> are required.</p>
      <div id="ctl00_MainBody_ValidationSummary1" style="color:Red;display:none;"></div>
      <div id="mainContent" class="MainContent">
        <div id="div" style="color:Red;display:none;"> </div>
        <table width="38%">
          <tr>
            <td valign="top" colspan="2"><b>INFORMATION ABOUT YOU</b></td>
          </tr>
          <tr>
            <td valign="top"> Your First Name</td>
            <td valign="top"><input name="ctl00$MainBody$txtFname" type="text" maxlength="255" id="ctl00_MainBody_txtFname" style="width:190px;" />            </td>
          </tr>
          <tr>
            <td valign="top"> Your Last Name</td>
            <td valign="top"><input name="ctl00$MainBody$txtLname" type="text" maxlength="255" id="ctl00_MainBody_txtLname" style="width:190px;" />            </td>
          </tr>
          <tr>
            <td valign="top"> Your Pet's Name</td>
            <td valign="top"><input name="ctl00$MainBody$txtPetName" type="text" maxlength="255" id="ctl00_MainBody_txtPetName" style="width:190px;" />            </td>
          </tr>
          <tr>
            <td valign="top"> Your E-mail Address <b style="color: red;">*</b></td>
            <td valign="top"><input name="ctl00$MainBody$txtEmail" type="text" maxlength="255" id="ctl00_MainBody_txtEmail" style="width:190px;" />
                <span id="ctl00_MainBody_email_RequiredFieldValidator" style="color:Red;visibility:hidden;">*</span> <span id="ctl00_MainBody_emailValid_RegularExpressionValidator" style="color:Red;visibility:hidden;">*</span><br />
              <span style="font-size: 9px; ">We will never sell or rent your E-mail  to anyone, ever.</span></td>
          </tr>
          <tr>
            <td valign="top" colspan="2" style="padding-top: 15px;"><b>INFORMATION ABOUT THE PHOTO YOU WANT TO SHARE</b></td>
          </tr>
          <tr>
            <td colspan="2" valign="top"> Upload your photo. <b style="color: red;">*</b>
              <input type="file" name="ctl00$MainBody$FileUpload1" id="ctl00_MainBody_FileUpload1" style="width:265px;" />
                <span id="ctl00_MainBody_RequiredFieldFileUpload11" style="color:Red;display:none;">*</span><span id="ctl00_MainBody_RegularExpressionValidator1" style="color:Red;display:none;">*</span><span id="ctl00_MainBody_CustomValidator1" style="color:Red;display:none;">*</span> </td>
          </tr>
          
          <tr>
            <td height="54" colspan="2"><div align="center">
              <input type="submit" name="www.parkviewanimalfriends.com" value="Submit" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainBody$btnSubmit&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="ctl00_MainBody_btnSubmit" />            
            </div></td>
          </tr>
        </table>
      </div>
    </body>

</html>

      </p>
    </td>
  </tr>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p align="center"><a href="index.html">UNDER CONSTRUCTION </a></p>
</body>
</html>

I'm not familiar with the language yet. I'm not sure how to point the submit button to the right I guess directory? Please assist to where I need to pop in the right code. Anything to make it also a tighter page. Thanks my friend.

**gits** · Aug 4 '10, 12:57 PM

whith what do you have problems exactly? as i see at he test-page you already have a upload-dialog and the user could choose a file to upload. so i guess you need help in saving that serverside somewhere?

**Melchizedek** · Aug 4 '10, 01:09 PM

Yes. I need help so the "submit" button will work. I guess the server side thingamajig code? Please chk the page and do a test upload. The browse button works, but the submit doesn't work...

**johny10151981** · Aug 4 '10, 03:31 PM

This is your action form

Code:

      <form action="mailto:contestpage@parkviewanimalfriends.com"
enctype="multipart/form-data" method="post">
<p>
 <P><INPUT TYPE=file NAME="html_file" ACCEPT="text/html"></P>

</p>
<div>
  <input type="submit" name="Submit" value="Submit" />
</div>
</form>

in your form action is action="mailto: contestpage@par kviewanimalfrie nds.com"
what is that even mean? are you trying to mail it directly? i think form dont support this method.

whatever you try to do with your image or other file. you need to upload them to the server and then using any server side program like php or any other you need to restore the file and then you will have to mail it or anything else.

**Melchizedek** · Aug 4 '10, 03:54 PM

in your form action is action="mailto: contestpage@par kviewanimalfrie nds.c om"
what is that even mean? are you trying to mail it directly? i think form dont support this method.

I'm not sure how to do it???

whatever you try to do with your image or other file. you need to upload them to the server and then using any server side program like php or any other you need to restore the file and then you will have to mail it or anything else.

Could someone show me or tell me in laymans term how to do it via php? Please...

Thanks!

**gits** · Aug 4 '10, 05:10 PM

you might have a look here to get started with that

**Melchizedek** · Aug 5 '10, 01:22 PM

May I email you directly? I really need to finish this page.

**johny10151981** · Aug 5 '10, 07:39 PM

A Sample email code

Code:

$to='someone@somewhere.com';
$headers  = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=UTF-8' . "\r\n";

$headers .= "To:".$to."\r\n";
$headers .= 'From:me@myserver.com' . "\r\n";
	$headers .="Reply-To:me@myserver.com\r\n";

$subject="pet image";
$message="<html>\n"
."<body>\n"
."Dear sir,\n"
."this is your uploaded image<br \>\n"
."<img src='www.myserver.com\image\pet\pet1.jpg' width=100 height=100 \><br \>\n"
."..................\n"
."</body>"
."</html>";

mail($to,'=?UTF-8?B?'.base64_encode($subject).'?=',$message,$headers);

Some of the codes are directly copied from my previous code. Some of the code is useless to this mail but very much useful.

**Melchizedek** · Aug 6 '10, 06:45 AM

Thanks johny10151981! I'm confused to how I to use the codes you replied with. The "submit" is the main issue. I need the right script for this button to work. I'm a 1st grader when it comes to where,how and what to use the codes for.

Could you specifically tell me hot to make this form work?

whatever you try to do with your image or other file. you need to upload them to the server and then using any server side program like php or any other you need to restore the file and then you will have to mail it or anything else.

Could someone show me or tell me in laymans term how to do it via php? Please...

Thanks!

**johny10151981** · Aug 6 '10, 06:51 AM

I have a question for you:
Do you know php at all? if you dont know you need to learn PHP. And as well as you need good concept on HTML

follow the link to understand what form do
form

you can also study this link
form

Read carefully and try to understand what it does. And Please take time do not hurry.

**Melchizedek** · Aug 6 '10, 07:28 AM

I'll study. Thanks man!

**bushnellweb** · Aug 6 '10, 07:57 PM

coldfusion is another server side language that is very easy to learn. If your server/host can/does support coldfusion you'd probably have an easier time coding that yourself. it looks like HTML so it makes learning easier. feel free to e-mail me @ [edit] and I can help you out

How do I create a button for clients to upload photos on a site?

How do I create a button for clients to upload photos on a site?

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment