Popover Bootstrap内部的表单会更新Popover隐藏中的原始表单 [英] Form inside popover bootstrap update original form on popover hide

问题描述

我在引导程序弹出窗口中有一个表单， http://jsfiddle.net/BcczZ/185/

I have a form inside the 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" />

我面临的问题是原始表单在加载时被隐藏，并且仅在实际上正在克隆表单的弹出窗口内部显示.关闭用户编辑和弹出窗口后，我需要更新原始表单元素值.

the issue I am facing is that the original form is hidden on load and shown only inside the popover which is actually cloning the form. After the user edit and popover is closed I need to update the original form elements values.

我不知道使用哪种方法.我认为，如果popover只是将表单移入内部并将其放在关闭的位置，那将是最好的选择.似乎是最短的方法.

I dont know what approach to use. I think it would be best if popover would just move the form inside and place it where it was on close. Seems the shortest way.

任何帮助或想法都会受到赞赏. 谢谢！

Any help or idea is appreciated. thank you!

推荐答案

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

If anyone else needs this , here it is , 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 Bootstrap内部的表单会更新Popover隐藏中的原始表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！