CODEWITHSUNDEEP
javascriptjqueryhtml
Talha Aslam
Talha Aslam

Reputation: 101

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>
  <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 } ?>
  </div>

I want to write a function in JavaScript which is called on edit file anchor click and will show the respective input type file.

Explanation: if some one clicked on anchor of credit report then it should show only <input type="file" name="creditreport" id="creditreport">.

My JavaScript code:

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

Upvotes: 0

Views: 396

Answers (1)

guest271314
guest271314

Reputation: 1

html

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

javascript

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

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

Upvotes: 1

Related Questions