如何在弹出窗口中显示<select>在控制台上显示所选选项?</select>

时间:2014-06-12 13:31:53

标签: jquery twitter-bootstrap popover

我试图从html select元素中获取所选选项的值。 select位于bootstrap popover中。有人能告诉我该怎么办?我一直没有得到任何结果。

<div>
    <button type="button" id="popover" data-toggle="popover">Popover</button>
</div>

这是我的Javascript:

     var content:    '<form role="form">' +
                            '<div class="form-group">' +
                                '<label>Wildcard:</label>'+
                                '<select name="options" id="wildcarddropdown">' +
                                    '<option value="yes">Yes</option>'+
                                    '<option selected="selected" value="no" >No</option>'+
                                '</select>' +
                            '</div>' +
                            '<div class="wildcard" style="display: none">' +
                                '<div class="form-group">' +
                                    '<label for="inputlabel">Label:</label>'+
                                    '<input type="text" id="inputlabel">' +
                                '</div>' +
                                '<div class="form-group">' +
                                    '<label for="datatype">Data Type:</label>' +
                                    '<select name="datatype" id="datatype">' +
                                        '<option value="numeric">Numeric</option>' +
                                        '<option value="string">String</option>' +
                                   '</select>'+
                                '</div>' +
                            '</div>' +
                             '</form>';

    $('[data-toggle="popover"]').popover({html:true, container:'body', trigger:'click', placement:'bottom', content:wildcardcontent});

    var button = $(document).find('#popover');

    $(button).on('click', function(e){

        if($(e.target).data('toggle') !== 'popover' && $(e.target).parents('.popover.in').length === 0) {
            $('[data-toggle="popover"]').popover('hide');
        }

    });


    var dropdown = $(document).find('#wildcarddropdown');

    $(document).on('shown', '[data-toggle="popover"]', function(){
        console.log($(dropdown).val());
    });


});

1 个答案:

答案 0 :(得分:0)

$(function() {
    $(document).on('change', '#wildcarddropdown', function(){
        console.log(this.value);
    });
    $('#popover').on('click',function() {
        $('#wildcarddropdown').change();
    });
});