从弹出对话框动态添加字段到主体

时间:2015-07-29 02:54:10

标签: jquery html dynamic openlayers-3

我试图从一个基于函数的弹出对话框向主体上的div添加新的输入字段。 '添加字段'按钮被创建,但它不会生成一个字段。

我知道它必须是.on但我想我的语法已关闭。这是HTML

<div id="clientView" class="panel-collapse collapse in">
    <div class="panel-body">
        <form role="form" action="/wohoo" method="POST">
            <div class="multi-field-wrapper">
                <div class="multi-fields form-inline">
                    <div class="multi-field">
                        <input type="text" class='form-control' name="stuff[]">
                             <button type="button" class="remove-field btn btn-default">Remove</button>
                     </div>
                 </div>
             </div>
         </form>
     </div>
</div>

这里是开启和关闭功能:

$(document).on('click', '.popBody', function () {
    $('.multi-field-wrapper').each(function () {
        var $wrapper = $('.multi-fields', this);
        $(".add-field").click(function (e) {
            $('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();
        });
        $('.multi-field .remove-field', $wrapper).click(function () {
            if ($('.multi-field', $wrapper).length > 1)
                $(this).parent('.multi-field').remove();
        });
    });
});

这是弹出代码:

if ($('#pc4').is(':checked')) {
        url = layers[11]
                .getSource()
                .getGetFeatureInfoUrl(
                        evt.coordinate,
                        map.getView().getResolution(),
                        map.getView().getProjection(),
                        {
                            'INFO_FORMAT': 'application/json',
                            'propertyName': 'usb_number,affiliation,type,status,region,' +
                                    'company_name,address,city,state,zip_code,phone_number'
                        }
                );
        reqwest({
            url: url,
            type: 'json',
        }).then(function (data) {
            var feature = data.features[0];
            var props = feature.properties;
            var info = "<div class='popHeader' id='userHeader'><h6><strong>" + props.company_name +
                    "</h6></strong></div><div class='popBody'<h5>" + "<p class='small'>" + props.address + "<br>" + props.city +
                    ", " + props.state + "  " + props.zip_code + "</p><p class='small'><strong>" + "Phone: </strong>"
                    + props.phone_number + "</p>" + "<p class='small'><strong>" + "Affiliation: </strong>"
                    + props.affiliation + "</p>" + "<p class='small'><strong>" + " Type: </strong>" + props.type + " " +
                    "<p class='small'><strong>" +
                    'USB #: </strong>' + props.usb_number + +'</p></h5></div>' +
                    "<div><button type='button' class='add-field'>Add to Route</button></div>";

            popup.show(evt.coordinate, info);
        });
    }

0 个答案:

没有答案