Magna
Magna

Reputation: 618

How to hide/disable submit button?

I have file upload and input fields in my form..I want to hide or disable submit button for the file upload if the file is uploaded successfully...I'm really confused on how to show the error message on the same page and proceed to the 'Thank you' page if there is no error. I'm validating the file upload using php. Any Idea on how to disable submit button if the file upload succeed? or show me how to process the file upload and input fields together while showing the error message on same page for file upload...

Note I want the submit button for file upload to disappear only if the file is successfully uploaded not when the user hits submit.

<html>
<head>
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
<label for="file">Choose Photo:</label>
<input type="file" name="file" onchange="file_selected = true;">
<input type="hidden" name="submited" value="true" /> 
<input type="submit" name="submit" value="Submit" >
</form>


<form action="Send.php" method="post">
First Name:<input type="text" name="fname" required><br>
Last Name:<input type="text" name="lname" required><br>
Choose Username:<input type="text" name="username" required><br>
Age:<input type="text" name="age" required><br>
<input type="submit" value="Submit" name="submit">
</form>
</body>
</html>

Here is the php code which processes the file upload...I have two submit buttons one for the file upload and one for the other input fields..This php code is present on the same page with html form.

<?php
ini_set( "display_errors", 0);
if(isset($_REQUEST['submited'])) {

// your save code goes here


$allowedExts = array("jpg", "jpeg", "gif", "png");
$extension = end(explode(".", $_FILES["file"]["name"]));
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/png")
|| ($_FILES["file"]["type"] == "image/pjpeg"))
&& ($_FILES["file"]["size"] < 2097152)
&& in_array($extension, $allowedExts))
{
if ($_FILES["file"]["error"] > 0)
{
echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
}
else
{
echo "";

if (file_exists("images/" . $_FILES["file"]["name"]))
{
echo "<font color='red'><b>We are sorry, the file you trying to upload already exists.</b></font>";
  }

else
{
move_uploaded_file($_FILES["file"]["tmp_name"],
"images/" . $_FILES["file"]["name"]);
echo "<font color='green'><b> Success! Your photo has been uploaded.</b></font>";
}
}
}
else
{
echo "<font color='red'><b>We are sorry, the file you trying to upload is not an image or it exceeds 2MB in size.</b></font><br><font color='blue'><i>Only images under size of 2MB are allowed</i></font>.";
}
}
?>

Upvotes: 0

Views: 6701

Answers (3)

Philemon philip Kunjumon
Philemon philip Kunjumon

Reputation: 1422

<form action="**somepage.php**" method="post" enctype="multipart/form-data">
    <label for="file">Choose Photo:</label>
    <input type="file" name="file" onchange="file_selected = true;">
    <input type="hidden" name="submited" value="true" /> 
    <input type="submit" name="submit" value="Submit" >
    </form>

and from there pass variables which indicates different status back to the main page and based on the variables show the error messages.

if you really need to disable the input type file save the variables in a hidden input and getting the values on page load using Jquery and disable the input type file ....

without jquery its simple just give a condiction before the input type form

    if($_GET['status']=successful)
    {
    <input type=file readonly="readonly" />
    }
   else
    {
    <input type=file />
    }

Upvotes: 0

Mr. Polywhirl
Mr. Polywhirl

Reputation: 48610

I would use a Jquery AJAX call to send the data to the PHP script. Then retrieve a boolean value from the response to determine whether the button should be visible or not.

Upvotes: 1

Vishnu R
Vishnu R

Reputation: 1869

You can do it in a simple way such as.

    <html>
    <head>
    </head>
    <body>
    <?php
$sub=0;
    ini_set( "display_errors", 0);
    if(isset($_REQUEST['submited'])) {

    // your save code goes here

    $allowedExts = array("jpg", "jpeg", "gif", "png");
    $extension = end(explode(".", $_FILES["file"]["name"]));
    if ((($_FILES["file"]["type"] == "image/gif")
    || ($_FILES["file"]["type"] == "image/jpeg")
    || ($_FILES["file"]["type"] == "image/png")
    || ($_FILES["file"]["type"] == "image/pjpeg"))
    && ($_FILES["file"]["size"] < 2097152)
    && in_array($extension, $allowedExts))
    {
    if ($_FILES["file"]["error"] > 0)
    {
    echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
    }
    else
    {
    echo "";

    if (file_exists("images/" . $_FILES["file"]["name"]))
    {
    echo "<font color='red'><b>We are sorry, the file you trying to upload already exists.</b></font>";
      }

    else
    {
    move_uploaded_file($_FILES["file"]["tmp_name"],
    "images/" . $_FILES["file"]["name"]);
    $sub= 1;
    echo "<font color='green'><b> Success! Your photo has been uploaded.</b></font>";
    }
    }
    }
    else
    {
    echo "<font color='red'><b>We are sorry, the file you trying to upload is not an image or it exceeds 2MB in size.</b></font><br><font color='blue'><i>Only images under size of 2MB are allowed</i></font>.";
    }
    }
    ?>
    <form action="" method="post" enctype="multipart/form-data">
    <label for="file">Choose Photo:</label>
    <input type="file" name="file" onchange="file_selected = true;">
    <input type="hidden" name="submited" value="true" />

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


    <form action="Send.php" method="post">
    First Name:<input type="text" name="fname" required><br>
    Last Name:<input type="text" name="lname" required><br>
    Choose Username:<input type="text" name="username" required><br>
    Age:<input type="text" name="age" required><br>
<?php
if($sub==0)
{
?>
    <input type="submit" value="Submit" name="submit">
<?php
}
?>
    </form>
    </body>
    </html>

I assume your code is correct. I initialised a variable $sub=0 in begining. If succesfully uploaded it is set to 1.

End, If $sub is not equal to zero, the submit is not showed.

So, if file is uploaded succesfully. The button wont show.

Upvotes: 0

Related Questions