我可以重定向到其他網頁內的網頁嗎？

Question

首先，如果我的問題標題令人困惑，我很抱歉。 我不確定最好的說法。 如果之前有人問過並回答過這樣的問題，我也很抱歉 - 我嘗試過搜索，但我無法找到任何相關信息。

問題：我正在為倉庫應用程序構建一個權限部分 - 它以具有功能（例如訂單卸載）的功能（例如接收）開始。 當然還有更多，但這應該是所需要的。

功能選項卡有一個帶有一組選項卡的網頁 - 其中一個選項卡允許我查看功能下的功能列表，以及添加/刪除功能（如果允許）。 所有樣式都位於此第一頁，因為其他頁面通過選項卡加載。 當我更新功能頁面（添加或刪除功能）時，我的操作會執行

return response.sendRedirect("url-for-webpage-here");

使用更新的數據將頁面重定向回同一屏幕。

這里的問題是該頁面在主頁面之外加載了所有樣式。

以下是主頁面的基礎知識（feature.jsp）：

<div class="d-flex flex-row mt-2">
    <div class="col-2 nav-tabs--div">
        <ul class="nav nav-tabs nav-tabs--vertical nav-tabs--left" role="navigation">
            <li class="nav-item">
                <a class="nav-link btn-block active" id="featureTab" data-toggle="tab" href="#featureSummary" role="tab" aria-controls="featureSummary">Feature Details</a>
            </li>
            <li class="nav-item">
                <a class="nav-link btn-block" id="featureFunctionsTab" data-target="#featureFunctions" data-toggle="tabajax" href="/Security/functions.do?method=load&featureID=<%=feature.getFeatureID()%>" role="tab" aria-controls="featureFunctions">Feature Functions</a>
            </li>
        </ul>
    </div>
    <div class="tab-content col-10">
        <div class="tab-pane fade show active" id="featureSummary" role="tabpanel">
            <!-- Stuff goes here -->
        </div>
        <!-- Blank div for AJAX loading of functions -->
        <div class="tab-pane fade" id="featureFunctions" role="tabpanel">

        </div>
    </div>
</div>

選擇第二個導航項（特征函數）將轉到第二個選項卡，將其使用的.jsp中的數據插入<div id="featureFunctions"></div>

在此頁面上有一個添加新功能的按鈕：

<a href="/Security/modal_addFunction.jsp?featureID=<%=featureID%>" data-toggle="modal" data-target="#addFunctionModal" data-id="<%=featureID%>" class="addFunction btn btn-md btn-primary float-right mr-1 mt-1"><i class="fa fa-plus"></i>&nbsp;Add New Function</a>

彈出模態，填寫並點擊“添加”按鈕，函數按預期執行。 在功能的最后是：

response.sendRedirect("/Security/functions.do?method=load&featureID="+function.getFeatureID());

這是單擊第一頁上的選項卡時完全相同的調用，但由於它沒有通過同一頁面，因此網頁顯示時根本沒有樣式。

我正在尋找一種方法來通過加載的原始頁面（feature.jsp）發送此重定向，然后默認為第二個選項卡（功能函數），這樣用戶就不必單擊返回查看功能列表對於此功能，如果這是可能的。 我真的不確定我的選擇是什么，所以我再次道歉，如果之前已經涵蓋了這一點！

Answer 1

經過與同事的大量搜索和討論，結果證明答案是AJAX，而且我做錯了。

在上面提到的頁面上， modal_addFunction.jsp將頁面上構建的表單的操作設置為指向將新函數添加到數據庫的函數。 它看起來像這樣：

<form name="newFunctionForm" id="newFunctionForm" method="post" action="/Security/functions.do?method=addNewFunction">
    <!-- Form goes here -->
    <div class="modal-footer">
        <button id="closeModalButton" type="button" class="btn btn-secondary" data-dismiss="modal"><i class="fa fa-times" aria-hidden="true"></i>&nbsp;Close</button>
        <button type="submit" class="btn btn-primary" id="addFunctionSubmit"><i class="fa fa-plus" aria-hidden="true"></i>&nbsp;Add</button>
    </div>
</form>

在AJAX調用中將阻止此表單的操作，但我們將會這樣做。

在動作中，函數如下所示：

    public ActionForward addNewFunction(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response){
        HttpSession session = request.getSession(false);
        if(SecurityEJBServices.checkSession(session, request, response))
            return null;
        FunctionsServices fs = new FunctionsServices();
        FunctionForm functionForm = new FunctionForm(request);
        try{
            Function function = new Function();
            //set Function stuff here

            boolean added = fs.addFunction(function);

            PrintWriter out = response.getWriter();
            if(added){
                out.write("success");
            }else{
                out.write("error");
            }
        }catch(Exception e){
            e.printStackTrace();
        }
        return null;
    }

PrintWriter將響應寫回到在模態中內置的AJAX函數。 它看起來像這樣：

<script type="text/javascript">
$(document).ready(function(){
    $(function(){
        $('#newFunctionForm').submit(function(e){
            e.preventDefault();
            var form = $(this);
            var post_url = form.attr('action');
            var post_data = form.serialize();
            $.ajax({
                type: 'POST',
                async: false,
                url: post_url,
                data: post_data,
                success: function(data){
                    console.log("DATA: " + data);
                    if(data == 'success'){
                        $('#errorDiv').hide();
                        $('#addFunctionModal').modal('hide');
                        $('#functionTable').load("/Security/functions.do?method=getFunctionsAjax&featureID=<%=featureID%>");
                        $('.modal-backdrop').remove();
                    }else{
                        $('#errorDiv').show();
                    }
                }
            });
        });
    });
});
</script>

#functionTable表作為它所在的div存在於一個完全獨立的jsp中，並通過<jsp:include>調用引用，該調用將該jsp中存在的表加載到div中。 這是我的錯誤。 我假設整個div在一個單獨的jsp中就足夠了，但我必須走得更遠，把表放在另一個單獨的jsp中，以便只刷新和重新加載數據。