My problem is why this codes dont work. i want to upload image with hide input type file but doesnt work. here are my codes..

<form action="" method="post" enctype="multipart/form-data">
    <div id ="settingmaincontainerright">
        <input  type="file" id="settingprofileimgfile" name ="settingprofileimgfile" >
        <input  type="submit" id="settingprofileimgfilebutton"  name="settingprofileimgfile" value="Choose Foto">
        <input  type="submit" id="settingprofileimgbutton"  name="settingprofileimg" value="Upload Foto">
    </div>
</form>

This is css.

#settingprofileimgfile{
    width:100%;
    height:100px;
    display:none;
}
#settingprofileimgfilebutton{
    width:100%;
    height:100px;
    border-top-right-radius: 30px;
    cursor:pointer;
}
#settingprofileimgbutton{
    width:100%;
    height:100px;
    border-bottom-right-radius: 30px;
    cursor:pointer;
}
#settingmaincontainer{
  width:90%;
  margin:auto;
  border:3px solid #FF4500;
  border-radius:30px;
  height :200px;
  margin-top:10px;
}

Here is JS..

$(function(){
    $("#settingprofileimgfilebutton").click(function() {
    $("#settingprofileimgfile").click();
});
});

. i want to upload image with hide input type file but doesnt work

please clarify what you are trying to do. I dont understand the logic/worklow

I want to upload an image to my dirctory with php and but this code doesnt work. when i click on upload foto button, nothing happen.

I dont see any PHP code and your form action attribute is blank. You need to include the name of the php page that will handle the processing of your form submission.

Example...

<form action="fileUpload.php" method="post" enctype="multipart/form-data">

Then on the PHP page, extract the data that was included in the post and process accordingly.

What is Foto - is that some kind of goats cheese?

"Foto" in spanish, italian, catalan, etc.. means Photo. The OP refers to image therefore, the assumption is that we are talking about uploading a picture.

it could be a picture of goat cheese though.

Ok you will need image recognition software then in case someone tries to inject some brie or red leicester by mistake.

i have php code on same page.

<form action="" method="post" enctype="multipart/form-data">
  <div id ="settingmaincontainerright">
   <input  type="file" id="settingprofileimgfile" name ="settingprofileimgfile" >
   <input  type="submit" id="settingprofileimgbutton"  name="settingprofileimg" value="Upload Foto">
   </div>
</form>

when i try with html code, its work. but i dont want to shwo this input file <input type="file" id="settingprofileimgfile" name ="settingprofileimgfile" >

i not sure what you are tyring to do by hidding it, but if the problem is related to display: none, then try setting the position to "relative", then move it off of screen by using "left: -99999px".

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.