fastadmin js追加多个动态下拉框

有个需求需要通过js添加多个动态下拉框,但是在js中拼接追加出来的下拉框没有点击效果获取不到下拉框数据，搜了好多查到了一个方法，在此记录一下

<div id="form-group-example">

</div>
//在html中先定义一个要追加数据的模版
<div class="form-group div2" style="display: none">
	<label class="control-label col-xs-12 col-sm-2">配料:</label>
	<div class="col-xs-12 col-sm-4">
		<input id="" name =""  min="0"  data-order-by="id desc" data-source="goods/index" data-field="goodname" class="form-control selectpage selectdisabled"  type="text">//下拉框，具体用法可以看文档
	</div>
	<div class="col-xs-12 col-sm-4">
		<input  class="form-control" placeholder="请输入数量" name=""  type="number">
		</div>
	</div>
//js，当点击按钮时触发追加
 $('#btn-compose').click(function(){
        var num = $('#c-nums').val();//根据获取的数量决定追加多少个下拉框
        var str ="<div class=\"form-group div2\"  >"+$(".div2").html()+"</div  >";//获取模版内容
        for(var i=0; i<num; i++) {
            $('#form-group-example').append(str);//追加进ID为form-group-example下面
        }

        var count = 0;
        $('#form-group-example .div2').each(function (){
            $(this).find("input:eq(0)").attr("id","inputaa"+count);//下拉框的ID一定要重新定义，不然循环出来的ID都一样
            $(this).find("input:eq(0)").attr("name","row[compose][goodsid]["+count+"]");//重新定义name
            $(this).find("input:eq(2)").attr("name","row[compose][nums]["+count+"]");
            //接下来这一步很重要，一定要加上
            require(['selectpage'], function () {
                $("#inputaa"+count).selectPage({//注意这里的ID
                    eAjaxSuccess: function (data) {
                        data.list = typeof data.rows !== 'undefined' ? data.rows : (typeof data.list !== 'undefined' ? data.list : []);
                        data.totalRow = typeof data.total !== 'undefined' ? data.total : (typeof data.totalRow !== 'undefined' ? data.totalRow : data.list.length);
                        return data;
                    }
                });
            });
            count++;
        });
        
        Form.events.selectpage($('form'));
    });