将数据从jsp中的可编辑表传递到servlet

时间:2013-12-11 04:24:55

标签: java html5 jsp servlets

我是JSP&servlets的新手。我必须允许用户键入html表中的一些问题并将输入的数据传递给servlet。问题的数量可能会有所不同。所以,我想将它作为列表或数组传递给servlet。我不希望为每一行使用隐藏标记,因为当行是动态的时候会很乏味。

有人可以建议一种有效的方法来传递表格列中输入的所有问题吗? 这是代码段..

<body>
<form action="adminPageServlet" method="POST">
   <table class="table editabletable table-bordered table-condensed table-responsive"
                    border="1">
        <tr>
    <td><div contenteditable>Question1</div></td>
    </tr>

    <tr>
    <td><div contenteditable>Question2</div></td>
    </tr>

    </table>
<button class="btn btn-default" type="submit" id="loginBtn">Submit</button>
</form>
</body>

编辑:

非常感谢。我仍然无法将数据从函数传递给servlet。能否请你帮忙?我在这里得到一个错误警告消息 - textStatus:undefined和data:[Object object]。

jQuery.ajax({
                url:'adminPageServlet',
                data:{"key1":"value1","key2":"value2"},
                type:'POST',
                contentType:"application/json; charset=utf-8",
                dataType : 'json',  
                success:function(data, textStatus, jqXHR){
                    // access response data
                    alert("success");
                },
                error:function(data, textStatus, jqXHR){
                    console.log('Service call failed!');
                    alert("failed - data"+data+"textSTatus"+textStatus);
                }
            });

我尝试使用

将问题转换为JSON字符串
var jsonString = JSON.stringify(questions);

并试图通过这个。不工作。你能帮忙吗?

1 个答案:

答案 0 :(得分:0)

当用户按下提交按钮时,在提交调用之前将所有问题都放在数组中的函数说

var Question=new Array();

然后将该数组解析为JSON format。解析时,然后发布请求。

像这样:

$.ajax({
                type: 'POST',
                url: '',
                contentType:"application/json; charset=utf-8",
                dataType:"json"
                data:  JSONData
                success: function(data){                       
                }   // Success Function
});

在服务器端阅读JSON。

请参阅此stackoverflow

<强>更新

function getQuestions(){
        var row  =$(".table tr")
        var questions=new Array();
        row.each(function(){
            var que = $(this).find("td div").html();
            console.log(que);
            Questions.push(que);

        }); 
        return questions;
    }
    function sentData()
    {
        var Questions=getQuestions();

        // your array to JSON Code

        $.ajax({
                type: 'POST',
                url: '',
                contentType:"application/json; charset=utf-8",
                dataType:"json"
                data:  JSONData
                success: function(data){                       
                }   // Success Function
        });     

    }

在Html而不是提交按钮中写这个

<button onClick="sendData()">Send</button>