函数select2()从servlet转发后丢失

时间:2013-08-16 01:11:47

标签: jquery jsp servlets twitter-bootstrap jquery-select2

我在jsp文件中使用Bootstrap2.3.2Select2 3.4.2。我想通过Select2库覆盖Bootstrap选择样式。它在第一次加载jsp文件时有效,但在将选择提交给servlet并从servlet转发回同一个jsp之后,我发现select对象的函数select2()已经丢失,并且选择框变为Bootstrap样式。看起来像select2.js没有效果,为什么?请帮忙。

以下是我的代码段

selectCategory.jsp:

            <script src="<%=request.getContextPath()%>/util/jquery/jquery-1.9.1.js"> </script>
            <!-- Bootstrap -->
            <% 
            //Cannot include bootstrap.css twice
            Boolean hasBootstrap = (Boolean)request.getAttribute("hasBootstrap");
            if (hasBootstrap == null) {
            %>
                <link rel="stylesheet" href=" <%=request.getContextPath()%>/util/bootstrap2.3.2/css/bootstrap.css" />
                <link rel="stylesheet" href=" <%=request.getContextPath()%>/util/bootstrap2.3.2/css/bootstrap-select.css" />
                <style type="text/css">
                    body {
                        padding-top: 60px;
                        padding-bottom: 40px;
                    }
                </style>
                <link rel="stylesheet" href="<%=request.getContextPath()%>/util/bootstrap2.3.2/css/bootstrap-responsive.css" />
                <script src="<%=request.getContextPath()%>/util/bootstrap2.3.2/js/bootstrap-select.js"> </script>
                <script src=" <%=request.getContextPath()%>/util/bootstrap2.3.2/js/bootstrap.js"> </script>
        <%
                hasBootstrap = true;
                request.setAttribute("hasBootstrap", hasBootstrap);
            } //end of if
        %>

        <link rel="stylesheet" href="<%=request.getContextPath()%>/util/jquery/select2-3.4.2/select2.css" />
        <script src="<%=request.getContextPath()%>/util/jquery/select2-3.4.2/select2.js"> </script>

    <script>
    $(function () {
        //$('.selectpicker').selectpicker();
        var sel = $('.selectpicker');
        var sel2 = $('#selectCat');
        $('#selectCat').select2();
    });
    </script>

<body>
    ...


        <select class="selectpicker" id="selectCat" name="selectCat" onchange="getSubject()">

的servlet:

String url = "/standard/selectCategory.jsp";
RequestDispatcher successView = req.getRequestDispatcher(url);
successView.forward(req, res);

我的问题是为什么$('#selectCat')。select2()在从servlet转发请求时丢失了?


更新

看起来根本原因是来自include jQuery库两次

因为我包含另一个jsp来呈现查询结果,并且这个jsp需要使用tablesorter, 所以我在这里只包含jQuery和tablesorter库。我认为第二个包含jQuery库对之前​​包含的select2库有一些影响,所以select2()丢失了。删除重复包含的库后,结果很好。

但我做了一个实验,结果似乎不是我所期待的

file1.jsp:

<link rel="stylesheet" href="<%=request.getContextPath()%>/util/jquery/tablesorter/style.css" />
<script src="<%=request.getContextPath()%>/util/jquery/jquery-1.9.1.js"> </script>
<script src="<%=request.getContextPath()%>/util/jquery/tablesorter/jquery.tablesorter.js"> </script>
<link rel="stylesheet" href="<%=request.getContextPath()%>/util/jquery/select2-3.4.2/select2.css" />
<script src="<%=request.getContextPath()%>/util/jquery/select2-3.4.2/select2.js"> </script>

...

            <div class="secondary">
                <%if (request.getAttribute("listStandard") != null) {%>
                    <jsp:include page="file2.jsp"/>
                <%} %>
            </div>

file2.jsp

<link rel="stylesheet" href="<%=request.getContextPath()%>/util/jquery/tablesorter/style.css" />
<script src="<%=request.getContextPath()%>/util/jquery/jquery-1.9.1.js"> </script>
<script src="<%=request.getContextPath()%>/util/jquery/tablesorter/jquery.tablesorter.js"> </script>
<link rel="stylesheet" href="<%=request.getContextPath()%>/util/jquery/select2-3.4.2/select2.css" />
<script src="<%=request.getContextPath()%>/util/jquery/select2-3.4.2/select2.js"> </script>

我认为第二个包含file2.jsp中的select2.js应该生效,但它不会

0 个答案:

没有答案