Question

我正在使用spring mvc创建一个Web应用程序，但我被困在这里。我在WEB-INF文件夹中有一个页面login.jsp，我有三种与此视图关联的查询字符串。

“login.fin？cmdAction = selectLogin” - ＆gt;这将显示两个按钮 - >管理员登录和实习生登录。

点击管理员登录按钮，页面应转到"login.fin?cmdAction=adminLogin"，这将显示管理员登录页面。

点击Trainee登录按钮后，它将转到"login.fin?cmdAction=traineeLogin"，这将显示见习者登录页面。

这是我的loginController：

package com.finlogic.loginapps.login.apps;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.multiaction.MultiActionController;

public class LoginController extends MultiActionController {

public ModelAndView selectLogin(HttpServletRequest request, HttpServletResponse response)
    {
        ModelAndView modelAndView = new ModelAndView("login");
        modelAndView.addObject("title", "Select Login");
        return modelAndView;
    }
public ModelAndView adminLogin(HttpServletRequest request, HttpServletResponse response)
    {
        ModelAndView modelAndView = new ModelAndView("login");
        modelAndView.addObject("title", "Admin");
        return modelAndView;
    }
    public ModelAndView traineeLogin(HttpServletRequest request, HttpServletResponse response)
    {
        ModelAndView modelAndView = new ModelAndView("login");
        modelAndView.addObject("title", "Trainee");
        return modelAndView;
    }

}

这是我的login.jsp：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>${title} Login Page</title>
    <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="js/login.js">
</head>
<body>
<div id="container"></div>
<div class="limiter">
        <div class="container-login100" style="background-image: url('images/bg-01.jpg');">
    <div class="wrap-login100">
        <c:if test="${title eq 'Select Login'}">

                <span class="login100-form-logo">
                    <i class="zmdi zmdi-landscape"></i>
                </span>

                <span class="login100-form-title p-b-34 p-t-27" >
                        Select:
                </span>
                <div class="container-login100-form-btn">
                    <button class="login100-form-btn" id="adminloginselect" onclick="adminLoader()">
                            Admin Login
                    </button>
                </div><br/>
                <div class="container-login100-form-btn">
                    <button class="login100-form-btn" id="traineeloginselect" onclick="traineeLoader()">
                        Trainee Login
                    </button>
                </div>
        </c:if>
        <c:if test="${title eq 'Admin'}">
            <form class="login100-form validate-form">
                <span class="login100-form-logo">
                    <i class="zmdi zmdi-landscape"></i>
                </span>

                <span class="login100-form-title p-b-34 p-t-27">
                    Admin Log in:
                </span>

                <div class="wrap-input100 validate-input" data-validate = "Enter username">
                    <input class="input100" type="text" name="adminusername" placeholder="Admin Username">
                    <span class="focus-input100" data-placeholder="&#xf207;"></span>
                </div>

                <div class="wrap-input100 validate-input" data-validate="Enter password">
                    <input class="input100" type="password" name="adminpass" placeholder="Admin Password">
                    <span class="focus-input100" data-placeholder="&#xf191;"></span>
                </div>

                <div class="contact100-form-checkbox">
                    <input class="input-checkbox100" id="ckb1" type="checkbox" name="remember-me">
                    <label class="label-checkbox100" for="ckb1">
                        Remember me
                    </label>
                </div>

                <div class="container-login100-form-btn">
                    <button class="login100-form-btn">
                        Login
                    </button>
                </div>

                <div class="text-center p-t-90">
                    <a class="txt1" href="#">
                        Forgot Password?
                    </a>
                </div>
            </form>
            </c:if>
        <c:if test="${title eq 'Trainee'}">
            <form class="login100-form validate-form">
                <span class="login100-form-logo">
                    <i class="zmdi zmdi-landscape"></i>
                </span>

                <span class="login100-form-title p-b-34 p-t-27">
                    Log in
                </span>

                <div class="wrap-input100 validate-input" data-validate = "Enter username">
                    <input class="input100" type="text" name="traineeusername" placeholder="Trainee Username">
                    <span class="focus-input100" data-placeholder="&#xf207;"></span>
                </div>

                <div class="wrap-input100 validate-input" data-validate="Enter password">
                    <input class="input100" type="password" name="traineepass" placeholder="Trainee Password">
                    <span class="focus-input100" data-placeholder="&#xf191;"></span>
                </div>

                <div class="contact100-form-checkbox">
                    <input class="input-checkbox100" id="ckb1" type="checkbox" name="remember-me">
                    <label class="label-checkbox100" for="ckb1">
                        Remember me
                    </label>
                </div>

                <div class="container-login100-form-btn">
                    <button class="login100-form-btn">
                        Login
                    </button>
                </div>

                <div class="text-center p-t-90">
                    <a class="txt1" href="#">
                        Forgot Password?
                    </a>
                </div>
            </form></c:if>

            </div>
        </div>
    </div>


    <div id="dropDownSelect1"></div>
</body>
</html>

上面的JavaScript是 login.js

 function adminLoader()
    {
        getSynchronousData('login.fin?cmdAction=adminLogin','','container');
    }
    function traineeLoader()
    {
        getSynchronousData('login.fin?cmdAction=traineeLogin','','container');
    }
    function getSynchronousData(datSource,params,destination)
    {
        var XMLHttpRequestObject=false;
        if(window.XMLHttpRequest)
                {
            XMLHttpRequestObject=new XMLHttpRequestObject();
                }
        else if(window.ActiveXObject)
            {
            XMLHttpRequestObject=new ActiveXObject("Microsoft.XMLHTTP");
        }
        if(XMLHttpRequestObject)
        {
            var obj=document.getElementById(destination);
            obj.innerHTML=varLoading;
            XMLHttpRequestObject.open("POST",datSource,false);
            XMLHttpRequestObject.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            XMLHttpRequestObject.send(params);
            if(XMLHttpRequestObject.readyState==4)
            {
                    if(XMLHttpRequestObject.readyState==200)
                    {              
                      obj.innerHTML=XMLHttpRequestObject.responseText;
                    }
                    else
                    {
                    obj.innerHTML=varProblem;
                    }
                }

            }
    }

当我点击管理员登录时，没有任何反应。请帮帮我。

Answer 1

将datsourc修复为datSource 将您的js代码更改为以下代码：

function adminLoader()
{
   function adminLoader('login.fin','adminLogin','container')
}
function traineeLoader()
{
    getSynchronousData('login.fin','traineeLogin','container');
}
function getSynchronousData(datSource,val,destination)
{
    var obj=document.getElementById(destination);
    if(window.XMLHttpRequest)
            {
        xmlhttp=new XMLHttpRequestObject();
            }
    else if(window.ActiveXObject)
        {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
          {
            obj.innerHTML=XMLHttpRequestObject.responseText;
          }
        else
          {
                obj.innerHTML=varProblem;
          }
    }
    var params = "cmdAction=" + val;
    xmlhttp.open("POST",datSource,true);
    xmlhttp.send(params);
    obj.innerHTML=varLoading; //<----why?
}

使用spring mvc获取按钮单击时的异步视图数据

1 个答案: