在spring控制器中获取javascript变量答案

【问题标题】：Get javascript variable in spring controller在spring控制器中获取javascript变量
【发布时间】：2017-01-13 07:28:12
【问题描述】：

我正在尝试通过 javascript 创建一个变量并在我的 spring mvc 控制器中使用该变量。不幸的是，我似乎无法弄清楚，变量一直为空。

这是我设置变量的 javascript：

<script language="JavaScript">
function checkBoxValues() {
    checkboxes = document.getElementsByName('message');

    var hopeThisWorks = "";
    for (var i = 0, n = checkboxes.length; i < n; i++) {
        if (checkboxes[i].checked == true) {
            message = checkboxes[i].value;
            var element = message.split(",");
            resubmitMessage(element[0], "" + element[1] + "",element[2]);
            var hopeThisWorks = "" + element[2] +"";
            alert(hopeThisWorks);
        }
    }

}
</script>

然后我将这个变量作为输入添加到我的jsp中，如下所示：

 <input name="abc" type="hidden" value="${hopeThisWorks}">

这是我的 spring mvc 控制器中的代码：

@RequestMapping(method = RequestMethod.POST, value = "resubmit")
public String resubmit(@RequestParam(value = "abc") String param, Model model) {

    model.addAttribute("messageList", param);

    return RESUBMIT;
}

然后我在jsp文件中调用该变量，显示信息如下：

<table class="results table table-striped table-bordered table-condensed">
<thead>
<tr>
    <td colspan="10">
        <h5>Bulk Resubmit Query Results</h5>
    </td>
</tr>
<tr>
    <jsp:include page="../commons/a.jsp"/>
    <jsp:include page="../commons/b.jsp"/>
    <jsp:include page="../commons/c.jsp"/>
    <jsp:include page="../commons/d.jsp"/>
    <jsp:include page="../commons/e.jsp"/>
    <jsp:include page="../commons/f.jsp"/>
    <jsp:include page="../commons/g.jsp"/>
    <jsp:include page="../commons/h.jsp"/>
</tr>
<p>Test <c:out value="${messageList}"/></p>

【问题讨论】：

不是设置 JS 变量，而是使用 JS 将值设置为 HTML 表单中的 input type=hidden 元素。或者使用Ajax POST
我正在使用 jsp 文件。你可能有一个我怎么能做到的例子吗？我通常在 jsp 文件而不是 javascript 文件中使用输入。
我不认为你可以做你想做的事，因为事情发生的顺序。首先，您的 Java 在服务器上运行，并创建一个 HTML 文件。 JSP 文件可用于创建 HTML。 HTML 被发送到浏览器，然后浏览器运行 Javascript 代码。 在您的 Javascript 方法开始运行之前不会创建该变量，此时 HTML 已经创建，因此通过 JSP 获取 Javascript 变量为时已晚。正如@ScaryWombat 所说，一种解决方案是让 Javascript 直接修改 HTML（可能使用 jQuery）。
所以虽然我创建了一个不同的页面，但还是不行？
我编辑了问题，做了一些更改，但值仍然为空，尽管我确实将其保存在表单中。

标签： javascript java spring spring-mvc

【解决方案1】：

您可以直接从 javascript 函数中设置输入值。最好在输入中添加 id 属性：

<input id="abc" name="abc" type="hidden" value="">

然后在你的javascript函数中：

<script language="JavaScript">
function checkBoxValues() {
    checkboxes = document.getElementsByName('message');

    var hopeThisWorks = "";
    for (var i = 0, n = checkboxes.length; i < n; i++) {
        if (checkboxes[i].checked == true) {
            message = checkboxes[i].value;
            var element = message.split(",");
            resubmitMessage(element[0], "" + element[1] + "",element[2]);
            var hopeThisWorks = "" + element[2] +"";
            document.getElementById("abc").value = hopeThisWorks;
        }
    }

}
</script>

现在将在提交表单时发送变量。

【讨论】：

【解决方案2】：

在客户端和服务器端之间传递变量（或数据）的一个好方法是使用 Ajax 请求。即使您在 .jsp 中，也可以使用 ajax（使用 Jquery 或 Angular 会更容易）。这里举个例子：

  function foo(){
        var data = '{"key":"'+value+'"}'; // here you create your json containing the var that you want to send to your server
        $.ajax({
            type : "POST",
            contentType : "application/json",
            url : "/theLocalisation", // here you put the "Url" of your spring mvc controller
            data : data,
            timeout : 100000,
            success : function(data) {
                var json = JSON.parse(data);
            //here it's the callback in the success case
            },
            error : function(e) {
                console.log("ERROR: ", e);
            },
            done : function(e) {
            }
        });
    }

服务器端：

@RequestMapping(value = "/theLocalisationn")
    public String getTheStation(@RequestBody String data){
        // here you will receive your 
        JSONObject jsonObj = new JSONObject(search); //transform the string in JSON to use it.
        System.out.println(jsonObj); 
        //then do your magic here.

        return null;
    }

PS：我使用 lib org.json 和 Jquery

希望这个例子对你有帮助

【讨论】：

【解决方案3】：

你不能在不发送 HTTP 请求的情况下设置控制器属性的值，因此，在您加载页面后，您可以发送 ajax 请求由您的控制器处理它并修改属性（在这种情况下，您将无法显示新值，直到刷新），或者在设置值后将其发送到输入中使用 JavaScript 输入。

<input name="abc" type="hidden" id="myinput" value="${hopeThisWorks}">

<script language="JavaScript">
function checkBoxValues() {
    checkboxes = document.getElementsByName('message');

    var hopeThisWorks = "";
    for (var i = 0, n = checkboxes.length; i < n; i++) {
        if (checkboxes[i].checked == true) {
            message = checkboxes[i].value;
            var element = message.split(",");
            resubmitMessage(element[0], "" + element[1] + "",element[2]);
            var hopeThisWorks = "" + element[2] +"";
$("#myinput").attr("value",hopeThisWorks);
            alert(hopeThisWorks);
        }
    }

}
</script>

【讨论】：