CODEWITHSUNDEEP
javascriptjquery
Gericke
Gericke

Reputation: 2241

Get dropdown selected value from jquery template in table row

I have the following jquery template and I want to get the selected value from the drop down box when I click on a button.

Jquery template:

<script id="template-download" type="text/x-jquery-tmpl">
        <tr class="template-download{{if _errorMSG}} ui-state-error{{/if}}">
            {{if _errorMSG}}
                <td></td>
                <td class="name">${_name}</td>
                <td class="size">${sizef}</td>
                <td class="error" colspan="2">Error:
                    {{if _errorMSG === 1}}File exceeds upload_max_filesize
                    {{else _errorMSG === 2}}File exceeds MAX_FILE_SIZE (HTML form directive)
                    {{else _errorMSG === 3}}File was only partially uploaded
                    {{else _errorMSG === 4}}No File was uploaded
                    {{else _errorMSG === 5}}Missing a temporary folder
                    {{else _errorMSG === 6}}Failed to write file to disk
                    {{else _errorMSG === 7}}File upload stopped by extension
                    {{else _errorMSG === 'maxFileSize'}}File is too big
                    {{else _errorMSG === 'minFileSize'}}File is too small
                    {{else _errorMSG === 'acceptFileTypes'}}Filetype not allowed
                    {{else _errorMSG === 'maxNumberOfFiles'}}Max number of files exceeded
                    {{else _errorMSG === 'uploadedBytes'}}Uploaded bytes exceed file size
                    {{else _errorMSG === 'emptyResult'}}Empty file upload result
                    {{else}}${_errorMSG}. File Not Uploaded!
                    {{/if}}
                </td>
                <td class="failupload">
                    <button data-type="${delete_type}" data-url="${delete_url}">Cancel Upload</button>
                </td>                
            {{else}}
                <td class="preview">
                    {{if Thumbnail_url}}
                        <a href="${_url}" target="_blank"><img src="${Thumbnail_url}"></a>
                    {{/if}}
                </td>
                <td class="name">
                    <a href="${_url}"{{if thumbnail_url}} target="_blank"{{/if}}>${_name}</a>
                </td>
                <td class="size">${sizef}</td>
                <td colspan="2"></td>
                <td>
                    <select class="fileupload-buttonbar" id='${_name}'>
                        <option value="1">Fundus</option>
                        <option value="0">Other</option>
                    </select>
                </td>
                <td class="success">
                    <button class="linkfile">Link File</button>
                </td>
                <td class="delete">
                    <button data-type="${delete_type}" data-url="${delete_url}">Remove File</button>
                </td>                
            {{/if}}

        </tr>
</script>

I have tried to use the $(this).parent().prev().children().find(":selected").text() but this also does not work.

Any suggestions would be appreciated

EDIT:

This is a function to test provided code.

$(document).ready(function () {
    $('.linkfile').on('click', function () {
        alert($(this).closest('tr').find('.fileupload-buttonbar option:selected').val());
    });
});

Upvotes: 2

Views: 2639

Answers (3)

Tushar
Tushar

Reputation: 87203

You should use val() to get the value of the selected option.

$(this).closest('tr').find('.fileupload-buttonbar').val()

Upvotes: 5

Satpal
Satpal

Reputation: 133403

You should use Event Delegation using .on() delegated-events approach. along with .val() method.

$(document).ready(function () {
    $(document).on('click', '.linkfile', function () {
        alert($(this).closest('tr').find('.fileupload-buttonbar').val());
    });
});

Upvotes: 1

Milind Anantwar
Milind Anantwar

Reputation: 82241

You need to use .val() along with select element selector to get the selected value:

$(this).closest('tr').find("select").val()

Upvotes: 1

Related Questions