按下按钮更改JSP页面

10

我有一个问题。

我有3个JSP页面。 第一个页面是一个菜单,里面有2个按钮。 当我点击第一个按钮时,我想打开第二个JSP页面。 当我点击第二个按钮时,我想打开第三个JSP页面。

你能帮我吗?我必须使用一个Servlet(这不是问题,我知道怎么做)?

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
 <body>
    <form name="TrainerMenu" action="TrainerMenu" method="get">

       <h1>Benvenuto in LESSON! Scegli l'operazione da effettuare:</h1>
       <input type="button" value="Creazione Nuovo Corso" name="CreateCourse" />
       <input type="button" value="Gestione Autorizzazioni"
        name="AuthorizationManager" />

    </form>
 </body>
</html>
8个回答

22

你有几个选择,我将从最简单的开始:

1- 将输入按钮更改为链接,你可以使用CSS样式使它们看起来像按钮:

<a href="CreateCourse.jsp">Creazione Nuovo Corso</a>
代替
<input type="button" value="Creazione Nuovo Corso" name="CreateCourse" />

2- 使用 JavaScript 根据单击的按钮更改表单的操作:

<input type="button" value="Creazione Nuovo Corso" name="CreateCourse" 
onclick="document.forms[0].action = 'CreateCourse.jsp'; return true;" />

3- 使用servlet或JSP来处理请求,并将其重定向或转发到相应的JSP页面。


5
您可以将提交按钮设置为不同的名称,在您提交表单的servlet中,测试被按下的按钮的名称,并呈现相应的jsp页面。
<input type="submit" value="Creazione Nuovo Corso" name="CreateCourse" />
<input type="submit" value="Gestione Autorizzazioni" name="AuthorizationManager" />

如果request.getParameter(“CreateCourse”)不为空,则在TrainerMenu servlet内单击第一个按钮,并且您可以呈现相应的jsp。


4
您可以使用JavaScript来实现这一点。例如,<input type="button" value="load" onclick="window.location='userpage.jsp'" >

2
如果你只是想从第一页导航到第二页和第三页,请按照以下方式用锚点元素替换按钮:
<form name="TrainerMenu" action="TrainerMenu" method="get">

<h1>Benvenuto in LESSON! Scegli l'operazione da effettuare:</h1>
<a href="Page2.jsp" id="CreateCourse" >Creazione Nuovo Corso</a>&nbsp;
<a href="Page3.jsp" id="AuthorizationManager">Gestione Autorizzazioni</a>
<input type="button" value="" name="AuthorizationManager" />
</form>

如果出于某种原因需要使用按钮,请尝试以下操作:
<form name="TrainerMenu" action="TrainerMenu" method="get">

   <h1>Benvenuto in LESSON! Scegli l'operazione da effettuare:</h1>
   <input type="button" value="Creazione Nuovo Corso" name="CreateCourse"
    onclick="openPage('Page2.jsp')"/>
   <input type="button" value="Gestione Autorizzazioni" name="AuthorizationManager"
    onclick="openPage('Page3.jsp')" />

</form>
<script type="text/javascript">
 function openPage(pageURL)
 {
 window.location.href = pageURL;
 }
</script>

1

只需使用两个表单。

在第一个表单中,操作属性将具有第二个jdp页面和您的第一个按钮的名称。在第二个表单中,将有第二个按钮,其操作属性给出了您的第三个jsp页面的名称。

就像这样:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
    <form name="main1"  method="get" action="2nd.jsp">
        <input type="submit" name="ter" value="LOGOUT" >
    </form>
    <DIV ALIGN="left"><form name="main0" action="3rd.jsp" method="get">
        <input type="submit" value="FEEDBACK">
    </form></DIV>
</body>
</html>

1
如果您想通过按钮点击而不是其他方式来执行操作,可以通过将location.href添加到您的按钮来实现。以下是我如何使用它的示例。
<button class="btn btn-lg btn-primary" id="submit" onclick="location.href ='/dashboard'" >Go To Dashboard</button>

上面的按钮使用Bootstrap类进行样式设置。没有样式的话,最简单的代码如下:
<button onclick="location.href ='/dashboard'" >Go To Dashboard</button>

/dashboard 是我的 JSP 页面,如果您也使用扩展名,则使用 /dashboard.jsp


0

它使用ajax工作。 然后jsp在响应请求时由控制器返回的iframe中显示。

function openPage() {
  jQuery.ajax({
  type : 'POST',
  data : jQuery(this).serialize(),
  url : '<%=request.getContextPath()%>/post_action',
  success : function(data, textStatus) {
  jQuery('#iframeId').contents().find('body').append(data);
  },
  error : function(XMLHttpRequest, textStatus, errorThrown) {
  }
  });
}

0

你把 -- action = "submit" 放在了按钮里面


1
这只是一条评论,而不是答案。也许您可以解释一下您建议的解决方案(而不是action="submit")。 - hc_dev

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接