JSP数据到JavaScript_Javascript_Jsp

JSP数据到JavaScript

javascript jsp

JSP数据到JavaScript,javascript,jsp,Javascript,Jsp,我的JSP文件中有从servlet读取的数据。我需要javascript中的数据进行验证。如何在javascript中获取这些数据。我试着用javascript将这些数据发送到一个方法。但它不起作用。这是我的jsp文件 <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!--<!DOCTYPE html PUBLIC "

我的JSP文件中有从servlet读取的数据。我需要javascript中的数据进行验证。如何在javascript中获取这些数据。我试着用javascript将这些数据发送到一个方法。但它不起作用。这是我的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">
-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ page
    import="com.thbs.mis.common.bo.User,
    com.thbs.mis.common.config.RoleConstants,
    com.thbs.mis.common.bo.BusinessUnits,
    java.util.List,
        java.util.Iterator,
    java.util.ArrayList,java.util.Date"%>

<%@page
    import="com.thbs.mis.spotexcellenceaward.bo.SpotExcellenceAwardBO,
    com.thbs.mis.gsrreporthr.bo.GsrSlab"%>
    <%!List<GsrSlab> slabList = new ArrayList<GsrSlab>(); %> 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>View Spot Excellence Award</title>
<link href="/RMS/CSS/style.css" rel="stylesheet" type="text/css" />
<link href="/CSS/cal.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="SCRIPTS/calendar.js"></script>
<link rel="stylesheet" type="text/css" href="CSS/style.css" />
<script type="text/javascript" src="SCRIPTS/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="SCRIPTS/jquery.autocomplete.js"></script>

<style type="text/css">
#coolmenu {
    width: 170px;
    background-color: #ffffff;
}

* html #coolmenu {
    /*IE only rule, to negate the padding below IE includes in menu width.*/
    width: 160;
}

#coolmenu a {
    font: bold 11px Verdana;
    padding: 2px;
    padding-left: 4px;
    display: block;
    width: 100%;
    color: #209C96;
    text-decoration: none;
    border-bottom: 1px dotted black;
}

html>body #coolmenu a { /*Non IE rule*/
    width: auto;
}

#coolmenu a:hover {
    background-color: #209C96;
    color: white;
}
</style>


<script src="SCRIPTS/common.js"></script>
<script type="text/javascript" src="SCRIPTS/autoCompleteV1.js"></script>
<script type="text/javascript" src="SCRIPTS/ajax.js"></script>

<script>
function myFunction() 
{

   var flag=true;
    var year = document.getElementById("year").options[document.getElementById("year").selectedIndex].text;
    var slab =document.getElementById("slab").options[document.getElementById("slab").selectedIndex].text;

    if(year==="-select year-" && slab==="-select slab-")
    {
        alert("Please select year and slab");
        flag=false;
    }
    if(year==="-select year-" && slab!=="-select slab-")
    {
        alert("Please select year");
        flag=false;
    }
    if(slab==="-select slab-" && year!=="-select year-")
    {
        alert("Please select slab");
        flag= false;
    }

    return flag;

}
</script>

</head>
<body>
    <jsp:include page="/header.jsp"></jsp:include>

    <%
        response.setHeader("Cache-Control", "no-cache"); //Forces caches 
        //to obtain a new copy of the page from the origin server
        response.setHeader("Cache-Control", "no-store"); //Directs caches 
        //not to store the page under any circumstance
        response.setDateHeader("Expires", 0); //Causes the proxy cache 
        //to see the page as "stale"
        response.setHeader("Pragma", "no-cache"); //HTTP 1.0 backward 
        //compatibility
            response.setHeader("Refresh", "1");
        final String USER = "user";
        final String LOGIN_PAGE = "/login.jsp";
        final int CDEC_HEAD_ID = 74;
        final int FINANCE_HEAD_ID = 552;
        final int UK_OPERATION_HEAD_ID = 115;
        final int QUALITY_HEAD_ID = 55694;
        final int SALES_AND_MARKETING_HEAD_ID = 130;
        final int CHINA_OPERATION_HEAD_ID = 1731;
        final int COE_BU_HEAD = 101;
        final int FINANACE_BU_HEAD = 23;
        final int NBU_FINANCE = 12;
        final int NBU_IT = 15;
        final int NBU_SHARED = 22;
        final int COMPETENCE_HEAD = 13;
        final RequestDispatcher rd = request
        .getRequestDispatcher(LOGIN_PAGE);
        User user = (User) session.getAttribute(USER);
        int empId = user.getEmpId();
        String id = String.valueOf(empId);
        if (user == null) {
            rd.forward(request, response);
        }
    %>

    <form method="post" action="GsrReportManager">
        <!-- name="grossMarginreportForm" id="exitEmpForm"
                        onsubmit="return isValidData();" -->
        <div class="mainalignment">

        <h3 align="left"><B><font color="teal">Create Slab</font></B></h3> 



    <table>
        <!--    <tr>
        <td colspan="2" style="font-weight: bold; font-size: 14px;">
            View Spot Excellence Awards</td>
        </tr> -->

        <tr align="center">
        <td>Year:</td>
        <td><select id="year" name="year">
<option value="-1" selected="selected">-select year-</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
<option value="2023">2023</option>
<option value="2024">2024</option>
<option value="2025">2025</option>
<option value="2026">2026</option>
<option value="2027">2027</option>
<option value="2028">2028</option>
<option value="2029">2029</option>
<option value="2030">2030</option>

                                </select></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
<td>Slab:</td>
                                                <option value="-1" selected="selected">-select slab-</option>
<option value="H1">H1</option>
<option value="H2">H2</option>
</select></td>

</tr>
                            <tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr><tr></tr>
<tr>
<td>&nbsp;</td>
<td align="left"><button value="Create" name="Create" onclick="return myFunction()">Create</button>
</tr>

</table></form>
<br><br>
<TABLE cellpadding="2" style=background-color: bgcolor="#d3d3d3" width="400px">
<TBODY>

<TR style="background-color: teal; color: white;">
<TD align="center" width="10px"><b>Year</b></TD>
<TD align="center" width="20px"><b>Rating Slab</b></TD>
</TR>
 <%
try{
slabList = (List)request.getAttribute("slabList");
for (Iterator itr = slabList.iterator(); itr.hasNext();) 
{
%>
 <tr><td align="center"><%
Object[] SlabBO = (Object[]) itr.next();
%><%=SlabBO[2] %></td><td align="center"><%=SlabBO[1] %></td></tr>
<% 
}
}
catch(Exception e)
{
e.printStackTrace();
}
%>
</TBODY>
</TABLE>

  </div>
</form>

</body>

</html>


观看现场卓越奖
#酷菜单{
宽度：170px；
背景色：#ffffff；
}
*html#酷菜单{
/*IE only规则，用于否定IE包含在菜单宽度中的下方填充*/
宽度：160；
}
#酷菜单{
字体：粗体11px Verdana；
填充：2px；
左侧填充：4px；
显示：块；
宽度：100%；
颜色：#209C96；
文字装饰：无；
边框底部：1px点黑色；
}
html>body#coolmenu a{/*非IE规则*/
宽度：自动；
}
#酷菜单a：悬停{
背景色：#209C96；
颜色：白色；
}
函数myFunction（）
{
var标志=真；
var year=document.getElementById（“year”）.options[document.getElementById（“year”）。selectedIndex].text；
var slab=document.getElementById（“slab”）.options[document.getElementById（“slab”）.selectedIndex].text；
如果（年份==“-选择年份-”&&slab==“-选择板-”）
{
警告（“请选择年份和板”）；
flag=false；
}
如果（年份==“-选择年份-”&&slab！=“-选择板-”）
{
警报（“请选择年份”）；
flag=false；
}
如果（楼板==“-选择楼板-”&&year！==“-选择年份-”）
{
警告（“请选择板”）；
flag=false；
}
返回标志；
}
创建楼板
年份：
-选择年份-
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
2026
2027
2028
2029
2030
厚板：
-选择楼板-
H1
氢
创造



年
定额板

JavaScript

myFunction（）

是我需要静态jsp数据“slabList”的方法。

您的浏览器代码对jsp servlet一无所知，反之亦然。如果希望在浏览器中使用数据，则需要在JSP servlet中输出数组初始化代码。例如：

<script>
function myFunction() 
{
 var slabList = [<% 
// output your data from slabList in a JSON format
 %>];

}


函数myFunction（）
{
var slabList=[]；
}

或者，您可以创建RESTAPI并使用Ajax动态加载数据，但我想这将是您的下一步。

我的slabList数据是Object类型的数组。如何以JSON格式生成该数据。我对JSON一无所知，后者是一种方法。其中包含了太多我不知道的技术。除了acheive还有其他选择吗？@sajjadsohail，JSON是一种非常简单的文本格式。您可以自己将Java对象格式化为JSON，也可以使用许多JSON库。例如，这里有一个例子