简体   繁体   English

如何在数组中传递数组<script> from a JSP page to a Servlet

[英]How to pass an Array in a <script> from a JSP page to a Servlet

I try to explain quickly and in detail what I plan to do. 我尝试快速详细地解释我打算做什么。 I've the following JSP page: 我有以下JSP页面:

JSP JSP

<!DOCTYPE html>
<html lang="en">

<head>
    <style>
        .AreaFree {
            -moz-box-shadow: inset 0px 1px 0px 0px #3dc21b;
            -webkit-box-shadow: inset 0px 1px 0px 0px #3dc21b;
            background-color: #44c767;
            border: 1px solid #18ab29;
            display: inline-block;
            cursor: pointer;
            color: #ffffff;
            font-family: Arial;
            font-size: 16px;
            font-weight: bold;
            padding: 15px 21px;
            text-decoration: none;
        }

        .AreaFree:hover {
            background-color: #5cbf2a;
        }

        .AreaFree:active {
            position: relative;
        }

        .AreaOccupated {
            -moz-box-shadow: inset 0px 1px 0px 0px #3dc21b;
            -webkit-box-shadow: inset 0px 1px 0px 0px #3dc21b;
            background-color: #E00000;
            border: 1px solid #B00000;
            display: inline-block;
            cursor: pointer;
            color: #ffffff;
            font-family: Arial;
            font-size: 16px;
            font-weight: bold;
            padding: 15px 21px;
            text-decoration: none;
        }

        .AreaOccupated:hover {
            background-color: #D00000;
        }

        .AreaOccupated:active {
            position: relative;
        }

        .AreaBlocked {
            -moz-box-shadow: inset 0px 1px 0px 0px #3dc21b;
            -webkit-box-shadow: inset 0px 1px 0px 0px #3dc21b;
            background-color: #A8A8A8;
            border: 1px solid #808080;
            display: inline-block;
            cursor: pointer;
            color: #ffffff;
            font-family: Arial;
            font-size: 16px;
            font-weight: bold;
            padding: 15px 21px;
            text-decoration: none;
        }

        .AreaBlocked:hover {
            background-color: #989898;
        }

        .AreaBlocked:active {
            position: relative;
        }

        input.clicked {
            background-color: red;
        }
    </style>
    <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
 </head>

<body>
    <form action="myServlet" method="post">
        <table cellspacing="0" cellpadding="0">
            <tr>
                <td>
                    <input type="button" class="AreaFree" id="11" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="12" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="13" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="14" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="15" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" class="AreaFree" id="21" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="22" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="23" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="24" />
                </td>
                <td>
                    <input type="button" class="AreaFree" id="25" />
                </td>
            </tr>
            <input type="hidden" id="matrix" value="" />
            <input type="hidden" value="callServlet" name="whatsend">
            <input type="submit" value="submit">
    </form>

    <script>
        var matrix = [];
        for (var i = 0; i < 100; i++) {
            matrix.push(0);
        }
        // set the hidden field on init
        $('#matrix').val(matrix);
        $('input[type="button"]').on('click', function(evt) {
            var me = $(this);
            var idx = +me.attr('id'); // the + sign turns this value to a number
            if (matrix[idx] === 0) {
                matrix[idx] = 1;
                me.addClass('AreaBlocked');
            } else {
                matrix[idx] = 0;
                me.removeClass('AreaBlocked');
            }
            // update the hidden field every time a user clicks something
            $('#matrix').val(matrix);
        });
        </script>
    </body>
</html>

Principally, in the following JSP page there is a table of buttons. 原则上,在下面的JSP页面中有一个按钮表。 Each button represents an area; 每个按钮代表一个区域。 the user decides to click on various buttons and these change color and status (on-off). 用户决定单击各种按钮,这些按钮会更改颜色和状态(开-关)。 Once the user select the buttons that he wants, press the submit button and send an array called "matrix" to a servlet, that containing information on each button pressed or not (boolean 0 or 1). 一旦用户选择了所需按钮,请按一下提交按钮,然后将一个名为“矩阵”的数组发送到Servlet,该数组包含有关每个按钮是否按下的信息(布尔值0或1)。

That's what I do in the servlet "myServlet" 这就是我在servlet“ myServlet”中所做的

protected void processRequest(HttpServletRequest request,     HttpServletResponse response)
        throws ServletException, IOException {

response.setContentType("text/html;charset=UTF-8");
    try (PrintWriter out = response.getWriter()) {

        String whatsend = request.getParameter("whatsend");

        if(whatsend.equals("callServlet")){
             String matrix = request.getParameter("matrix");

        }

     }

     catch (SQLException ex) {

     }
}

Well, once you press the submit button the servlet is called, enters in the if block and executes the command request.getParameter, but unfortunately matrix is null. 好了,一旦按下了提交按钮,就会调用servlet,进入if块并执行命令request.getParameter,但是不幸的是matrix为null。 Where am I wrong? 我哪里错了? How do I move that array to this servlet? 如何将该数组移到该servlet? Could you kindly share the correct code? 您能否分享正确的代码? Thanks in advance, I'm sorry if I wasn't not much detailed. 在此先感谢您,如果我没有说的很详细,我感到抱歉。

In your code, the form does not send any parameter named "matrix", because there's no input with name="matrix" . 在您的代码中,表单不发送任何名为“ matrix”的参数,因为没有name="matrix"输入。 So the first thing you have to do is to change that: 因此,您要做的第一件事就是更改它:

<input type="hidden" id="matrix" value="" />

into that: 进入:

<input type="hidden" id="matrix" name="matrix" value="" />

Then, you will have to consider how are you serializing the matrix. 然后,您将不得不考虑如何对矩阵进行序列化。 An input can only hold a value of type string (and only strings can be sent to the server) so you have to serialize the array into a string. 输入只能包含字符串类型的值(并且只能将字符串发送到服务器),因此您必须将数组序列化为字符串。 That is usually (but not necessarily) accomplished through JSON. 通常(但不一定)通过JSON完成。 You would first convert the matrix to a JSON string before setting it as a value for the input: 您首先需要将矩阵转换为JSON字符串,然后再将其设置为输入值:

$('#matrix').val(JSON.stringify(matrix));

And then in the server you would have to convert it back to an array. 然后在服务器中,您必须将其转换回数组。 You can use several libraries for that. 您可以为此使用几个库。 Two common options are JSON in Java and Google's Gson . 两个常见的选项是Java中的JSON和Google的Gson The following example uses Gson and assumes that the seralized value is always an array of integers: 下面的示例使用Gson并假定序列化的值始终是整数数组:

String matrixStr = request.getParameter("matrix");
Gson gson = new Gson();
Integer[] matrix = gson.fromJson(matrixStr, Integer[].class);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM