Question

I have a dropdown in a for loop. I also have a download pdf button in this loop. I want to be able to click on this download pdf button and then in javascript select the selected value in the dropdown which then will eventually run a function and find the correct pfd location related to the selected value.

EDIT:

 <table>
    <tr>
      <td></td>
      <td>
        @Html.DropDownList("Dropdown", Model.Dropdowns[i], new { id = Model.Industry[i].Id, @class = "dropdown"})
     </td>
     </tr>
     <tr>
       <td></td>
       <td>
          <a href="#" class="DownloadPDF"> Download PDF</a>                                                   
       </td>

<script type="text/javascript">
$(document).ready(function () {

   $(".DownloadPDF").click(
        function () {
            var selected = $(this).parent().find(".dropdown option:selected").val();
            alert(selected);
        }
    );
});

this code returns only an alert saying undefined

Answer 1

It’s better to subscribe to the change event of your dropdown:

$(document).ready(function() {
    $('select.dropdown').change(function() {
       var $tr = $(this).closest('tr');
       var $btn = $tr.next().find('a.DownloadPDF');
       $btn.attr('href', 'mydownloadhandler?pdf' + $(this).find('option:selected').val()); 
    });
});

Code: http://jsfiddle.net/b4Dxv/1/

Anyway, if we will start from button:

$(document).ready(function () {
   $(".DownloadPDF").click(function () {
            var selected = $(this).closest('tr').prev().find(".dropdown option:selected").val();
            alert(selected);
        }
    );
});