Question

我有两个视图-adminPage.jsp和studentForm.jsp。

在adminPage中，我有一个按钮，允许用户从中打开学生（使用ajax获取studentForm）。用户可以以这种形式输入学生数据，然后单击“注册”按钮以在数据库中添加学生。

此操作已成功执行，但是我有一个问题。从studentForm.jsp中调用发布请求（将学生添加到数据库中的请求），结果也被接收到。我想用一个新的studentForm替换一个现有的studentForm（结果是在发布请求后收到响应），但是结果是整个页面被<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> function onk() { $.get({ url: "/student/studentForm", success: function (result) { $('#viewContainer').html(result); } }); } </script> </head> <body> <h4>Username: ${user.username}</h4> <h1>heading 1</h1> <p> paragraph 1</p> <p> paragraph 2</p> <input type="button" id="userAddLoader" value="Add Student" onclick="onk();"/> <div id="viewContainer" style="background-color: red">  </div> </body> </html>替换了。

我应该改变什么？

这是adminPage，我在其中发出get请求并在id为viewContainer的div元素中加载响应：

studentForm.jsp

这是<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $('#form1').onsubmit(function (e) { var form = $('#form1'); $.post({ url: form.attr("action"), data: form, success: function (data) { $('#viewContainer').html(data); } } ); e.preventDefault(); //avoid to execute the actual submit of the form }); </script> </head> <body> <c:set var="stat" scope="request" value="${status}"/> <c:if test="${stat == 'success'}"> <script> alert("Student was successfully added"); </script> </c:if> <h6>New Student Registration</h6> <form:form action="/student/postStudent" method="post" modelAttribute="user" id="form1"> Username: <form:input type="text" path="username" id="username"/> Password: <form:input type="text" path="password" id="password"/> <input type="submit" value="Register"> </form:form> </body> </html>：

const

Answer 1

我替换了这个：

import pandas as pd
from docx import Document  
from docx.shared import Pt

data = pd.read_csv('203792_M-51_Niles_control_SD_ACSF.txt', sep=",", 
header=None)
i=len(data[1])
print 'Number of Points imported =', i
document = Document('test_iteration.docx')  #Imports Word Document to Modify
t = len(document.paragraphs)  #gives the number of lines in document
print 'Total Number of lines =', t
font = document.styles['Normal'].font
font.name = 'Arial'
font.size = Pt(8)

# This maps the matching strings to the data array values
data_dict = {
    'NORTHING:': data[1][0],
    'EASTING:': data[2][0],
    'ELEV:': data[3][0],
    'CSF:': data[8][0],
    'STD. DEV.:': 'N: {0}\t E: {1}\t EL: {2}'.format(data[5][0], data[6][0], data[7][0])
    }

for paragraph in document.paragraphs:
    for k,v in data_dict.items():
        if k in paragraph.text:
            paragraph.clear()
            run = paragraph.add_run()
            run.text = k + '\t'
            run.font.bold = True
            run.font.underline = True
            run = paragraph.add_run()
            run.text = '{0}'.format(v)

与此：

$('#form1').onsubmit(function (e) {

            var form = $('#form1');

            $.post({
                    url: form.attr("action"),
                    data: form,
                    success: function (data) {
                        $('#viewContainer').html(data);
                    }
                }
            );

            e.preventDefault(); //avoid to execute the actual submit of the form

        });

问题解决了。

结论：

$('#form1').on("submit", function (e) { var form = $('#form1'); $.post({ url: form.attr("action"), data: form.serialize(), success: function (data) { $('#viewContainer').html(data); } } ); e.preventDefault(); });在这种情况下不起作用。可以使用onSubmit，但Jquery文档中介绍的更新方法是submit
表单应序列化on("submit", function (e) ...

用Ajax响应数据替换部分视图

1 个答案: