Talha Aslam Talha Aslam - 1 year ago 173
HTML Question

Javascript show a input type file on anchor click

My code is as follows:

<div class="fifty">
<label>Credit report</label>
<input type="hidden" id="credtireport-link" name="credtireport-link" value="<?php echo $creditreport; ?>">

<input type="file" name="creditreport" id="creditreport" <?php if($creditreport!=""){?> style="display:none" <?php } ?> >
<?php if($creditreport!="") { ?>
<a href="#" onclick="showfile();">Edit File</a>
<?php } ?>
<div class="fifty">
<label>Employer’s ref</label>
<input type="hidden" id="employerref-link" name="employerref-link" value="<?php echo $employeer_ref_url; ?>">

<input type="file" name="employerref" id="employerref" <?php if($employeer_ref_url!=""){?> style="display:none" <?php } ?>>
<?php if($employeer_ref_url=="") { ?>
<a href="#" onclick="showfile();">Edit File</a>
<?php } ?>

Please help me out, i want to write a function in javascript which is called on edit file anchor click and will show the respective input type file.


If some one clicked on anchor of credit report then it should show only

I hope you understand

My Javascript code:

function showfile()
var id=$(this).parent().find('input[type="file"]').toggle();
return false;

Thanks in advance.

Answer Source


<a href="#" onclick="showfile(this);">Edit File</a>


function showfile(el) {
  var id = $(el).prev(":file").toggle();
  return false;

plnkr http://plnkr.co/edit/MjZkZvFjlqj4a8HffYaF?p=preview

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download