cgray1223
asked on
show hide submit button with jquery
Hello,
How would I only display the submit button below when the user has selected a file to input in the file input control. I want the submit button to remain hidden until the do select a file to input. I'm using jquery.
<form id="uploadFrm" action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" enctype="multipart/form-da ta">
<p>
<input type="file" name="image" id="image" size="50"/>
<input type="submit" name="submit" value="Upload" id="submit"/>
</p>
</form>
How would I only display the submit button below when the user has selected a file to input in the file input control. I want the submit button to remain hidden until the do select a file to input. I'm using jquery.
<form id="uploadFrm" action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" enctype="multipart/form-da
<p>
<input type="file" name="image" id="image" size="50"/>
<input type="submit" name="submit" value="Upload" id="submit"/>
</p>
</form>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Can also do ...
<script type="text/javascript">
$("#image").live('change', function() {
alert("I Changed ");
$("#submit").show();
});
</script>
Just change the submit button HTML to have style="display:none"
Hope that helps.
<script type="text/javascript">
$("#image").live('change',
alert("I Changed ");
$("#submit").show();
});
</script>
Just change the submit button HTML to have style="display:none"
Hope that helps.
Visibility:hidden will leave space in the container for the object so youll see the gap where the submit button would be.
Display:none does not leave space in the container, and when you change it to Display:box or whatever it adds container space to show it.
Also, i didn't see the id for the submit button at the end of the input tag. You could just use $('#submit').show() instead of $('input[name=submit]').sh