CODEWITHSUNDEEP
javascriptjquery
Suffii
Suffii

Reputation: 5784

Issue on Targeting First Previous Closest Element with Class Name

Demo

Can you please take a look at above Demo and let me know why I am not able to grab .val() of First Closest- Previous .txtfilename element.

Please try to click On PDF btn to see the result

 $(document).on("click", ".pdf-download", function(){
        var targetFileInput =  $(this).prev().closest(".txtfilename").val();
        alert(targetFileInput);
 });

HTML:

<div class="content hide">
    <div class="form-group">
        <input id="" name="txtfilename" type="text" placeholder="File Name" class="form-control input-md txtfilename" />
    </div>
    <div class="form-group" style="margin-top:10px !important;">
        <div class="btn-group btn-group-sm">
            <button type="button" id="chart1png" data-chart="chart1" class="btn btn-default text-center png-download">PNG</button>
            <button type="button" id="chart1pdf" data-chart="chart1" class="btn btn-default text-center pdf-download">PDF</button>
            <button type="button" id="chart1jpg" data-chart="chart1" class="btn btn-default text-center jpg-download">JPG</button>
        </div>
    </div>
</div>

Thanks

Upvotes: 0

Views: 22

Answers (1)

Milind Anantwar
Milind Anantwar

Reputation: 82241

You have incorrect selector to target desired input element. use:

 $(document).on("click", ".pdf-download", function(){
    var targetFileInput =  $(this).closest('.form-group').prev().find(".txtfilename").val();
    alert(targetFileInput);
 });

Working Demo

You can also use:

$(this).closest('.content').find(".txtfilename").val();

Approach 2 demo

Upvotes: 2

Related Questions