Image Upload in PHP

Discussion in 'PHP' started by 11ul, Sep 19, 2007.

  1. #1
    I am trying to upload a image from my computer to the "Image" Folder created in C:\wamp\www\.(My Document root is set to C:/wamp/www//test) & when I run this program it should display the image in the same browser window.But the following code is not working-

    <html>
    <head><title>Upload Files</title>
    </head>
    <body>
    </br>
    <center>
    <form action="upload.php" method="POST" enctype="multipart/form-data">
    <input type="file" name="img"/><br>
    <input type="submit" value="click to upload" name="sub">
    </form>
    <? php
    if(isset($_POST['sub']))
    {
    $file=$_FILES["img"]["name"];
    $dir="images/";
    $tot_dir=$dir.$file;
    if(move_uploaded_file($_FILES["img"]["tmp_name"],$tot_dir))
    {
    ?>
    <img src="images/<?php echo $file; ?> "border="0" />
    <?php
    }
    ?>
    </center>
    </body>
    </html>

    Any suggestion what is wrong with the above code?
    Any help would be greatly appreciated.
    Thanks
     
    11ul, Sep 19, 2007 IP
  2. gibi

    gibi Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    dir images is writeable ?
     
    gibi, Sep 20, 2007 IP
  3. hemlata

    hemlata Peon

    Messages:
    18
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Hello,

    Modify your code with the following code. You were missing with a closing for if block and an additional space for <?php tag...
    Also check folder permission.

    <html>
    	<head>
    		<title>Upload Files</title>
    	</head>
    	<body>
    		</br>
    		<center>
    			<form action="upload.php" method="POST" enctype="multipart/form-data">
    				<input type="file" name="img"/><br>
    				<input type="submit" value="click to upload" name="sub">
    			</form>
    <?php
    			if(isset($_POST['sub']))
    			{
    				$file=$_FILES["img"]["name"];
    				$dir="images/";
    				$tot_dir=$dir.$file;
    				if(move_uploaded_file($_FILES["img"]["tmp_name"],$tot_dir))
    				{
    ?>
    					<img src="img/<?php echo $file; ?> "border="0" />
    <?php
    				}
    			}
    ?>
    		</center>
    	</body>
    </html>
    Code (markup):
    Hope this will solve your issue.

    Regards
     
    hemlata, Sep 20, 2007 IP
  4. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Yup,Thanks.It's working now.The file is getting uploaded...
    But one final glitch.The purpose of the above program was to make the image appear in the browser window as well as getting copied into the image folder....
    But it's not showing there in the browser:(
     
    11ul, Sep 20, 2007 IP
  5. krt

    krt Well-Known Member

    Messages:
    829
    Likes Received:
    38
    Best Answers:
    0
    Trophy Points:
    120
    #5
    Change <img src="img/<?php echo $file; ?> "border="0" /> to:
    <img src="<?php echo $tot_dir; ?> "border="0" />
     
    krt, Sep 20, 2007 IP
  6. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Ok,But why is this ' " ' before border?
    And, where is the opening ' " ' ends in ->

    "img/<?php echo $file; ?> "border="0" /> to:
    OR
    <img src="<?php echo $tot_dir; ?> "border="0" />
    Reply With Quote?
     
    11ul, Sep 20, 2007 IP
  7. papa_face

    papa_face Notable Member

    Messages:
    2,237
    Likes Received:
    67
    Best Answers:
    1
    Trophy Points:
    285
    #7
    It should be:
    echo '<img src="img/'.$file.'" border="0" />';
    Code (markup):
     
    papa_face, Sep 20, 2007 IP
  8. krt

    krt Well-Known Member

    Messages:
    829
    Likes Received:
    38
    Best Answers:
    0
    Trophy Points:
    120
    #8
    papa_face, the directory name is "images".

    11ul, that was a problem with the old code that I didn't realise when changing another part of it.

    Here is the final version:
    <img src="<?php echo $tot_dir; ?>" border="0" />
     
    krt, Sep 20, 2007 IP
  9. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Hi,
    Also,how to color the browse button?
    I have tried in many ways to color the "Browse" button using Dreamweaver,but could only color the "Upload" button.I can color the background of the 'textbox' & also the 'Upload' button.
    If anyone can guide me as to how to change the background-color of the Browse button only,would be very much thankful.
     
    11ul, Sep 21, 2007 IP
  10. adamjblakey

    adamjblakey Active Member

    Messages:
    1,121
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    80
    #10
    Try this:

    <input name="submit" type="submit" id="button" value="submit" style="background-color:#000099;"/>
     
    adamjblakey, Sep 21, 2007 IP
  11. meetgs

    meetgs Active Member

    Messages:
    957
    Likes Received:
    35
    Best Answers:
    0
    Trophy Points:
    70
    #11
    apparently it is impossible to do using CSS.
    http://lists.evolt.org/archive/Week-of-Mon-20030303/136274.html

    however, there is an alternative:
    http://www.quirksmode.org/dom/inputfile.html


     
    meetgs, Sep 21, 2007 IP
  12. adamjblakey

    adamjblakey Active Member

    Messages:
    1,121
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    80
    #12
    Trust me it can be done with the code above. I have done this many times.
     
    adamjblakey, Sep 21, 2007 IP
  13. meetgs

    meetgs Active Member

    Messages:
    957
    Likes Received:
    35
    Best Answers:
    0
    Trophy Points:
    70
    #13
    adam, i think he was referring to the "Browse" button for the file selection input field (type="file"), not the regular button (type="submit")
     
    meetgs, Sep 21, 2007 IP
  14. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #14
    Yes,meetgs is absolutely correct.I was referring to the "Browse" button & not the regular "Submit" button. :(
    The 'Browse' button has this code -
    <input name="img" type="file" style="background-color:#33FFFF">
    which is giving color to the background of the "input textbox".
    While the "Submit" button is already colored,the code is-
    <input type="submit" value="click to upload" name="sub" style="background-color:#9999FF">
    :rolleyes:
    I wanted to know how to color the 'browse' button & not the 'Submit'/ 'Upload' which I have already done!! :cool:
    Any suggestions as to how to color the 'Browse' button only?
    Also,Thanks meetgs for the links.But from the links you have provided,I couldnot make out how to color a browse button?
    I don't know javascript & quite novice in programming.
    Please guide me.
    Thanks
     
    11ul, Sep 21, 2007 IP
  15. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #15
    Also,I tried this code as given in your link-
    input.FormButton {
    background-color: #b5dcb8;
    color: #5b4223;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1px;
    padding: 1px;
    }
    input.FormText {
    background-color: #ffffff;
    color: #000000;
    border: 1px solid ;
    }
    textarea {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    border: 1px solid #000000;
    }
    I copied the above code and pasted it after the following code tag-
    <input name="img" type="file" style="background-color:#33FFFF">
    But nothing happened.The above lines are all appearing in the browser!!!:eek:
     
    11ul, Sep 21, 2007 IP
  16. krt

    krt Well-Known Member

    Messages:
    829
    Likes Received:
    38
    Best Answers:
    0
    Trophy Points:
    120
    #16
    Don't do it. It doesn't degrade well in older browsers, it is hard to use even in modern browsers, it is not worth the effort and so on. File inputs aren't supposed to be styled due to security issues.
     
    krt, Sep 21, 2007 IP
  17. msaqibansari

    msaqibansari Peon

    Messages:
    84
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #17
    you should use <STYLE> tag to define CSS in file like

    <style type="text/css">
    input.FormButton {
    background-color: #b5dcb8;
    color: #5b4223;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1px;
    padding: 1px;
    }
    input.FormText {
    background-color: #ffffff;
    color: #000000;
    border: 1px solid ;
    }
    textarea {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    border: 1px solid #000000;
    }
    </style>
     
    msaqibansari, Sep 21, 2007 IP
  18. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #18
    No color is appearing in the Browse button.It is remaining as it is even after doing that!!!:eek:
     
    11ul, Sep 22, 2007 IP
  19. krt

    krt Well-Known Member

    Messages:
    829
    Likes Received:
    38
    Best Answers:
    0
    Trophy Points:
    120
    #19
    Because it isn't supposed to be done...
     
    krt, Sep 22, 2007 IP
  20. 11ul

    11ul Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #20
    But everything can be done in PHP.I have seen colored browse buttons!!!
    Please tell me how to do it.
     
    11ul, Sep 22, 2007 IP