0

可能重复:
如何使用 Servlet 和 Ajax?

我有以下代码:

public class IndexServlet extends HttpServlet {

    MoodService moodService;

    public IndexServlet() {
        moodService = new MoodService();
    }

    /**
     * Accepts the request and sends it to the dispatcher which takes the database data and presents it as HTML
     */
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        List<Mood> moodList = moodService.findLastMoods(25); //my way of getting data from database

        req.setAttribute("moodList", moodList);

        RequestDispatcher requestDispatcher =req.getRequestDispatcher("index.jsp");
        requestDispatcher.forward(req, resp);

    }

}

和 index.jsp 文件:

<html>

<head>
    <title>Previous 25 entries:</title>
    <style type="text/css">
        #container {width:1200px; margin-left:auto; margin-right: auto;}
        #tableheader {width:900px; text-align: center;}
     .field {text-align:center; width:300px;}
    </style>




</head>


<body style="background-color: black;">
<div id="container">

    <table border="1" bordercolor="#FFCC00"  width="900" height="80" cellpadding="3" cellspacing="3" style="border-top-left-radius: 15px; border-top-right-radius: 15px; text-align: center; margin-left:auto; margin-right: auto; background-color:#FFFFCC; font-size: 33px; font-family: Monotype Corsiva ">

        <tr>
            <td style="border-top-left-radius: 10px; border-top-right-radius: 10px;">PREVIOUS 25 ENTRIES:</td>
        </tr>

    </table>

    <%
        List<Mood> moodList = (List<Mood>) request.getAttribute("moodList");
        for (Mood mood : moodList) {

            Integer a = mood.getMoodId();
            String moodId = new String();

            switch (a) {

                case 1:
                    moodId = "Happy";
                    break;

                case 2:
                    moodId = "Sad";
                    break;

                case 3:
                    moodId = "Lonely";
                    break;

                case 4:
                    moodId = "Angry";
                    break;

                case 5:
                    moodId = "In Love";
                    break;

                case 6:
                    moodId = "Content";
                    break;
            } %>

    <table id="table" border="1" bordercolor="#FFCC00"  width="900" cellpadding="3" cellspacing="3" style="text-align: center; margin-left:auto; margin-right: auto; background-color:#FFFFCC;">

        <tr>
            <td class="field"> <%=mood.getUserId()%></td>
            <td  class="field"> <%=moodId%></td>
            <%Date date = new Date(mood.getTime());
                SimpleDateFormat sdf = new SimpleDateFormat("dd:MM:yyyy hh:mm:ss");
                String sDate = sdf.format(date);
            %>
            <td  class="field"> <%=sDate%></td>

        </tr>

    </table>
    <%
        }
    %>



</div>
</body>

</html>

我的问题是:

如何在其中实现 AJAX,以便每 30 秒用新数据刷新表,显示数据库中的最后 25 个条目?我更喜欢使用 jquery,看看到目前为止我用它所做的一切都比没有 jquery 简单得多......

我对 AJAX一无所知,这实际上是我第一次使用它(我刚刚开始学习),所以如果有人能给我一个关于如何做到这一点的分步教程,我将不胜感激。(或者至少告诉我可以做我想做的代码,我可以对它进行逆向工程,可能:))

MoodService 是我自己的处理数据库的类(它如何工作与这种情况无关,唯一重要的是我需要在加载站点后将数据重新加载到表中)。

谢谢您的帮助!:)

4

2 回答 2

0

你需要三样东西:

  1. 进行 AJAX 调用以获取数据。
  2. 调度程序将返回一个 JSON 对象,您可以解析和绘制页面。
  3. 30 秒后再次进行 AJAX 调用,清空 JSP 中已有的表并使用新响应重新绘制它。

    1. 第一点指南: http: //api.jquery.com/jQuery.ajax/

    $.ajax({ type: "POST", url: "some.php", data: { name: "John", location: "Boston" } }).done(function( msg ) { alert("数据保存: " + 味精); });

    1. 您可以使用Jackson API将 Java 对象转换为 JSON 对象。

此处指南:http ://www.mkyong.com/java/jackson-streaming-api-to-read-and-write-json/

要绘制页面,您需要在 Javascript 中创建元素。您可以通过使用 jQuery 中的 .append() 等来做到这一点。

  1. 使用 setTimeout(functionToMakeAJAXCall, 30000); //30 秒

我很难格式化它,有人可以帮忙吗?

于 2012-10-18T15:07:58.547 回答
0

我建议你看看这个非常简单实用的教程:

如何使用 Servlet 和 Ajax

于 2012-10-18T14:56:45.307 回答