Question

我在bootstrap popover中有一个表单， http://jsfiddle.net/BcczZ/185/

<div class="settings" data-toggle="popover" data-mysettings="#someid" data-original-title="Settings"> <i class="fa fa-bars"></i>

</div>
<fieldset id="someid" style="display: none">
    <select id='list' class="form-control">
        <option value='1'>First</option>
        <option value='2'>Second</option>
        <option value='3'>Third</option>
    </select>
    <br />
    <input type="text" class="form-control" id="inputtext" value="1000">



    <div class="radio">
        <label>
            <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>One</label>
    </div>
    <div class="radio">
        <label>
            <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">Two</label>
    </div>
    <label class="checkbox-inline">
        <input type="checkbox" id="inlineCheckbox1" value="option1">1</label>
    <label class="checkbox-inline">
        <input type="checkbox" id="inlineCheckbox2" value="option2">2</label>
    <label class="checkbox-inline">
        <input type="checkbox" id="inlineCheckbox3" value="option3">3</label>
         <br /> <br />
    <textarea class="form-control" rows="3"></textarea>
</fieldset><span id="result" />

我面临的问题是原始表单是在加载时隐藏的，只显示在实际克隆表单的popover中。用户编辑和弹出窗口关闭后，我需要更新原始的表单元素值。

我不知道使用什么方法。我认为最好是popover只是将表单移到里面并将其放在接近的位置。似乎是最短的路。

感谢任何帮助或想法。谢谢！

Answer 1

如果有其他人需要这个，这就是， http://jsfiddle.net/BcczZ/215/

var $popoversettings = $('.settings').popover({
    html: true,
    placement: 'right',
    content: function () {
        var mySettings = $(this).data('mysettings'),
            sfieldset = $(mySettings).find('fieldset');

            return $(sfieldset).appendTo($(this));

    }
});


$(':not(#anything)').on('click', function (e) {
    $popoversettings.each(function () {
        if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
            // before hide update original elements

            var placebak = $('.popover-content').find('fieldset');
            var parrent=  $(this).data('mysettings');
            $(placebak).appendTo($(parrent));
            $(this).popover('hide');
            return;
        }
    });
});

弹出窗口内的表单更新popover hide上的原始表单

1 个答案: