Java新手求助,动态下拉列表

项目用LayUi框架+SpringMvc实现的

点击总体页面右侧的编辑按钮弹出Layui渲染的窗口(另一个jsp页),窗口中的下拉列表想做成从后端数据库表中查出的数据
图片说明

整体页:

 <fieldset class="layui-elem-field">
                <legend>诉讼指南列表</legend>
                <div class="layui-field-box layui-form">
                    <table class="layui-table admin-table">
                        <thead>
                            <tr>
                                <th style="width: 30px;"><input type="checkbox" lay-filter="allselector" lay-skin="primary"></th>
                                <th>标题</th>
                                <th>日期</th>
                                <th>分类</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="content">
                        </tbody>
                    </table>
                </div>
            </fieldset>
            <div class="admin-table-page">
                <div id="paged" class="page">
                </div>
            </div>

        <script type="text/html" id="tpl">
            {{# layui.each(d.list, function(index, item){ }}
            <tr>
                <td><input type="checkbox" lay-skin="primary"></td>

                <td>{{ item.heading }}</td>
                <td>{{ item.dates }}</td>
                <td>{{ item.litigationguidesubmenu.litigationguidesubmenuname }}</td>
                <td>
                    <!-- 修改按钮 -->
                    <a href="javascript:;" data-gid="{{ item.gid }}" data-heading="{{ item.heading }}" data-straightmatter="{{ item.straightmatter }}" data-dates="{{ item.dates }}" data-opt="edit" class="layui-btn layui-btn-mini" id="update" onclick="edit(this)">编辑</a>
                    <a href="javascript:;" data-gid="{{ item.gid }}" data-opt="del" id="del" class="layui-btn layui-btn-danger layui-btn-mini" onclick="del(this)">删除</a>
                </td>
            </tr>
            {{# }); }}
        </script>
        <script type="text/javascript" src="${pageContext.request.contextPath }/plugins/layui/layui.js"></script>
        <script>
            layui.config({
                base: 'js/'
            });

            layui.use(['paging', 'form'], function() {
                var $ = layui.jquery,

                    paging = layui.paging(),
                    layerTips = parent.layer === undefined ? layui.layer : parent.layer, 
                    layer = layui.layer, 
                    form = layui.form();

                paging.init({
                    /* 省略查询代码 */
                    complate: function() { 

                    //点击编辑按钮弹出编辑窗口
                    $.post('view/LitigationGuide/forms/updateForm.jsp',{gid:$(this).data('gid'),heading:$(this).data('heading'),straightmatter:$(this).data('straightmatter'),dates:$(this).data('dates'),submenu:$(this).data('submenu')}, function(form) {
                        addBoxIndex = layer.open({
                            type: 1,
                            title: '修改诉讼指南',
                            content: form,
                            btn: ['保存', '取消'],
                            shade: false,
                            offset: ['100px', '30%'],
                            area: ['800px', '620px'],
                            zIndex: 19950924,
                            maxmin: true,
                            yes: function(index) {
                                //触发表单的提交事件
                                $('form.layui-form').find('button[lay-filter=edit]').click();
                            },
                            success: function(layero, index) {
                                //弹出窗口成功后渲染表单
                                var form = layui.form();
                                form.render();
                                form.on('submit(edit)', function(data) {
                                    //参数传入controller
                                    $.post('litigationguide/updateLitigationGuide.json',data.field,function(res){
                                        location.reload();
                                    });
                                    return false;                               
                                });
                            },
                            end: function() {
                                addBoxIndex = -1;
                            }
                        });
                    });
                });
                });
            },
    });
</script>

updateForm.jsp:

 <html>
    ...
    <body>
        <!--省略标题、正文、日期等...-->
        <div class="layui-form-item" style="width:200px; margin-left:110px;">
            <select name="fenlei" lay-verify="" >
                <option value="">请选择文章分类</option>
                <c:forEach items="${ 后台返回的集合 }" var="s">
                    <option value="${ s.id }">${ s.值 }</option>
                </c:forEach>
            </select>  
        </div> 
        ...
    </body>
    ...
</html> 

小白还求高手指教

$(function(){
var grade=$("#grade");
grade.append("一年级"); //添加下拉列表
grade.append("二年级");
grade.append("三年级");
$("四年级").appendTo(grade); //添加下拉列表
$("").val("4").text("五年级").appendTo(grade); //添加下拉列表
$("").val("5").text("六年级").prependTo(grade); //追加下拉列表到开头
$("option[value='1']").remove(); //移除value值为1的下拉选项
grade.val("2"); //设置默认的选中状态
var maxGradeIndex=grade.find("option:last").attr("value"); //获取最后一个下拉选项的value值属性
var gradeText=grade.find("option:first").text(); //获取最后一个下拉选项的文本内容
//grade.empty(); //清空下拉列表选项
grade.change(function(){
alert($(this).find("option[value='3']").text());
});
alert(gradeText);
});

上面写死的地方做个for循环

是在弹出的窗口页面做下拉列表吗,在窗口的jsp页面中用Ajax,不知道Ajax自己去百度,这个太基础了。不知道多百度比在这问好多了,又不是什么很难的问题。