0

我需要将 li1 和 li2 读取的值发送到对用户进行身份验证的 servlet(无 DB 调用),并且 servlet 以 true 或 false 响应。必须在我的 .js 文件中读取此布尔值,并且必须仅更改 DOM在无效用户带有适当消息的情况下,无需重新加载整个页面的结构。

我的 logintom.js 如下

goog.require('goog.dom');
goog.require('goog.events.EventType');
goog.require('goog.style');
goog.require('goog.ui.Control');
goog.require('goog.ui.Button');
goog.require('goog.ui.FlatButtonRenderer');
goog.require('goog.ui.LabelInput');
goog.require("goog.net.XhrIo");
goog.require("goog.structs.Map");
goog.require("goog.Uri.QueryData");
function setUp() {
    var li1 = new goog.ui.LabelInput('USER NAME');
        li1.render(goog.dom.getElement('d1'));
    var li2 = new goog.ui.LabelInput('PASSWORD');
        li2.render(goog.dom.getElement('d2'));      
            var val1;
            var val2;
    var fb1 = new goog.ui.Button('Login',goog.ui.FlatButtonRenderer.getInstance());
fb1.render(goog.dom.getElement('fb1'));
        goog.events.listen(fb1,goog.ui.Component.EventType.ACTION,
        function(e) {
            val1 = li1.getValue();
            val2 = li2.getValue();
var request = new goog.net.XhrIo(); 
        goog.events.listen(request, "complete", function(){
        if (request.isSuccess()) 
        {
    console.log("Satus code: ", request.getStatus(), " - ", request.getStatusText());
        }
        else {
    console.log("Something went wrong in the ajax call. Error code: ", request.getLastErrorCode()," - message: ", request.getLastError());
        }
    });
        var param = 'username='+val1+'&password='+val2;
        var url = 'loginprocessortom?username='+val1+'&password='+val2;
        request.send(url, "POST");
});             
}

我的Servlet如下

public class loginprocessortom extends HttpServlet
{
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws
          ServletException, IOException
    {
        String uname = (req.getParameter("username"));
        String pword = (req.getParameter("password"));
            resp.setContentType("text/html");  
            PrintWriter out = resp.getWriter();
    if (uname == "xyz" && pword == "xyz")
            {   
                     tof = true;
            }
            else
            {
             tof = false;
            }
   }
}

我的 HTML 如下。

<html>
  <head>
    <script src="closure-library/closure/goog/base.js"></script>
    <script src="logintom.js"></script>
  </head>
  <body onload="setUp();">
        <fieldset>
            <legend>
                <strong>Authentication</strong>
            </legend>
            <div id="d1">User Name &nbsp </div>
            <br>
            <div id="d2">Password &nbsp &nbsp
            </div>
            <br>
            <div id="fb1"></div>
            <br>
            <span id="sp1"></span>
        </fieldset>
</body>
</html>

我需要将此“tof”发送到我的 .js,在那里我可以使用闭包读取它并根据“tof”的值更改页面,而无需重新加载整个页面(Ajax 行为)

4

1 回答 1

0
goog.events.listen(request, "complete", function(e){
        var xhr = /** @type {goog.net.XhrIo} */ (e.target);
        res = xhr.getResponseText();
                if(xhr.getResponseText() == "true")
                {
                goog.dom.getElement("sp1").innerHTML = ("Hi Welcome");
                }
                else
                {
                goog.dom.getElement("sp1").innerHTML = ("Invalid Username or Password");
                }
        });

用上面的代码替换控制台日志功能应该可以工作。

于 2013-08-30T07:02:11.700 回答