同时添加多个类目

php 复制代码

<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('User_id')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-user_id" data-rule="required" min="0" data-source="user/user/index" data-field="nickname" class="form-control selectpage" name="row[user_id]" type="text" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('工资月份')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-date" class="form-control datetimepicker" data-date-format="YYYY-MM"
                   data-use-current="true" name="row[date]" type="text" value="{:date('Y-m')}">
        </div>
    </div>
    <div class="form-group row">
        <label class="control-label col-xs-12 col-sm-2">{:__('类目')}:</label>
        <div class="col-xs-12 col-sm-8">
            <table class="table fieldlist" data-template="eventtpl" data-name="row[event]" id="second-table">
                <tr>
                    <td>{:__('类目')}</td>
                    <!--                    <td>{:__('图片')}</td>-->
                    <!--                    <td>{:__('登录时间')}</td>-->
                    <td>{:__('金额')}</td>
                    <td width="100"></td>
                </tr>
                <tr>
                    <td colspan="4"><a href="javascript:;" class="btn btn-sm btn-success btn-append"><i
                            class="fa fa-plus"></i> {:__('Append')}</a></td>
                </tr>
            </table>

            <!--请注意实际开发中textarea应该添加个hidden进行隐藏-->
            <textarea name="row[event]" class="form-control" cols="30" rows="5" style="display:none">[{"id":"1","image":"/assets/addons/example/img/200x200.png","time":"2019-06-28 12:05:03"}]</textarea>
            <script id="eventtpl" type="text/html">
                <tr class="form-inline">
                    <td><input type="text" name="<%=name%>[<%=index%>][id]" class="form-control selectpage"
                               data-source="bx/costclassify/index" data-field="name" data-format-item="{name}" value="<%=row.id%>"
                               placeholder="产品"/>
                        <!--
                                            </td>
                                                               <td>-->
                        <!--                        <input type="hidden" name="<%=name%>[<%=index%>][image]" id="c-image-<%=index%>"-->
                        <!--                               value="<%=row.image%>">-->
                        <!--                        &lt;!&ndash;@formatter:off&ndash;&gt;-->
                        <!--                        <button type="button" id="faupload-image" class="btn btn-danger faupload upload-image" data-input-id="c-image-<%=index%>" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp,image/webp" data-multiple="false" <%if(row.image){%>style="background-image: url('<%=Fast.api.cdnurl(row.image)%>')"<%}%>></button>-->
                        <!--                        &lt;!&ndash;@formatter:on&ndash;&gt;-->
                        <!--                    </td>-->
                        <!--                    <td><input type="text" name="<%=name%>[<%=index%>][time]" class="form-control datetimepicker"-->
                        <!--                               style="width:120px" value="<%=row.time%>" placeholder="时间"/></td>-->
                    <td>
                        <input class="form-control" step="0" name="<%=name%>[<%=index%>][num]" type="number"
                               value="0">
                    </td>
                    <td>
                        <!--下面的两个按钮务必保留-->
                        <span class="btn btn-sm btn-danger btn-remove"><i class="fa fa-times"></i></span>
                        <span class="btn btn-sm btn-primary btn-dragsort"><i class="fa fa-arrows"></i></span>
                    </td>
                </tr>
            </script>
        </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
        </div>
    </div>
</form>

php 复制代码

add: function () {
            $(document).on("fa.event.appendfieldlist", "#second-table .btn-append", function (e, obj) {
                //绑定动态下拉组件
                Form.events.selectpage(obj);
                //绑定日期组件
                Form.events.datetimepicker(obj);
                //绑定上传组件
                Form.events.faupload(obj);


                //上传成功回调事件，变更按钮的背景
                $(".upload-image", obj).data("upload-success", function (data) {
                    $(this).css("background-image", "url('" + Fast.api.cdnurl(data.url) + "')");
                })
            });
            Form.api.bindevent($("form[role=form]"), function (data, ret) {
                Layer.alert(data.data);
            });
            Controller.api.bindevent();
        },