Custom search of fastadmin form

1. Use the search template to add the search template at the bottom of the corresponding index.html page (note that the template is added at the bottom of the HTML page with the table)

Put the custom search content, the code below, at the bottom

<script id="countrySearch" type="text/html">
    <!--form表单必须添加form-commsearch这个类-->
    <form action="" class="form-commonsearch form-horizontal">
        <div class="row">
            <form id="form" class="form-horizontal form-ajax" role="form" data-toggle="validator" method="POST" action="">
                <div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <label for="a" class="control-label col-xs-1">省/市:</label>
                    <div class="col-xs-8" style="position: relative;">
                        <input id="a" readonly type="text" class="form-control" data-toggle="city-picker" data-level="city" data-responsive="true" placeholder="请选择省/市">
                    </div>
                    <div class="col-xs-3"></div>
                </div>
                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                    <label for="b" class="control-label col-xs-4">开始时间:</label>
                    <div class="col-xs-8">
                        <input name="b" id="b" type="text" class="form-control datetimerange" onfocus=this.blur() />
                    </div>
                </div>
                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                    <label for="c" class="control-label col-xs-4">结束时间:</label>
                    <div class="col-xs-8">
                        <input name="c" id="c" type="text" class="form-control datetimerange" onfocus=this.blur() />
                    </div>
                </div>
                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                    <label for="a" class="control-label col-xs-4">扫码量:</label>
                    <div class="col-xs-8">
                        <input id="d" name="d" type="text" class="form-control" autocomplete="off" oninput = "value=value.replace(/[^\d]/g,'')" />
                    </div>
                </div>
                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                    <label class="control-label col-xs-4"></label>
                    <div class="col-xs-8">
                        <button type="submit" class="btn btn-success btn-embossed">提交</button>
                        <button type="reset" class="btn btn-default btn-embossed">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </form>
</script>

2. The table configuration in the js file corresponding to the page:

Here, the city text in the drop-down box of the city-picker plugin in the provinces and cities cannot be folded. Modify the CSS style in the following file

 

Among them, the custom template is used for reference from this blogger's article: https://blog.csdn.net/qq_34050360/article/details/108148335 

Guess you like

Origin blog.csdn.net/qq_41588568/article/details/109053872