文章/答案/技术大牛

发布

社区首页 >问答首页 >使用AJAX从两个页面上的数据填充网页

问使用AJAX从两个页面上的数据填充网页
EN

Stack Overflow用户

提问于 2014-10-17 21:15:36

回答 1查看 64关注 0票数 0

我正在尝试使用AJAX填充一个选择框，它从两个页面获取数据。mainPage.jsp有以下代码..

<td>Product</td>
        <td><select name="selProduct" id="selProduct"  onchange='loadXMLDoc();' >
            <option value="-1"> Select Product</option>
            <option value="0"> JSA Three Wheelers</option>
            <option value="1"> Rotavators</option>
            <option value="2"> ACE Tractors</option>
            <option value="3"> BCS Reaper Binder</option>
            <option value="4"> Lubi Pumps</option>
            <option value="5"> New Golden Punjab Thresers</option>

          </select>
        </td>
        </tr>
        <tr>
        <td>Model</td>
        <td>
            <div id="myDiv">

            </div>



        </td>
        </tr>

函数loadXMLDoc()是as

function loadXMLDoc()
{
function byId(e) {return document.getElementById(e);}
var sel=byId('selProduct');
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","NewFile.jsp?str="+sel.value,true);
xmlhttp.send();
}

文件NewFile.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>
  <%  //String selProduct= request.getParameter("str");
  //int valProduct= Integer.parseInt(selProduct);
  String sel= request.getParameter("str");
  int valProduct= Integer.parseInt(sel);


 %>
<script>
function loadXMLDoc1()
{
  function byId(e) {return document.getElementById(e);}
  var selModel=byId('selModel');
  alert(selModel.value);
  var selProduct=<%=valProduct%>;

  var xmlhttp;
  if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
  else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  { 
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("divRate").innerHTML=xmlhttp.responseText;
    //document.getElementsByName(txtTest).Text=xmlhttp.responseText;

    }
  }
       xmlhttp.open("GET","selPrice.jsp?selProduct="+selProduct+"&"+"selModel="+selModel.value,true);
   xmlhttp.send();

}
 </script>
 </head>
 <body>


<select name="selModel1" id="selModel" onchange='loadXMLDoc1();'>
<option  value="-1">select Model </option>
 <%if(valProduct==0){ %>

 <option value="1">Victory 1000 DIII Passenger</option>
 <option value="2">Victory plus 1000 DIII Passenger </option>
 <option value="3">Victory 1000 DIII Loader </option>
 <option value="4">Victory 1000 DIII Chassis </option>
 <option value="5">Victory 1360 DIII Passenger </option>
 <option value="6">Victory 1360 DIII Window Dx Passenger </option>
 <option value="7">Victory 1360 DIII Loader </option>
 <%}
 else if (valProduct==1){%>


<option value="1">SRT-6/540 (SEMI CHAMPION)</option>
<option value="2">SRT-5.5/1000 (SEMI CHAMPION)</option>
<option value="3">SRT-6/1000 (SEMI CHAMPION)</option>
<option value="4">SRT-7/1000 (SEMI CHAMPION)</option>
<option value="5">SRT-5.5/MS LIGHT SERIES (1.65/1000)</option>
<option value="6">SRT-6/MS LIGHT SERIES (1.85/1000)</option>
<option value="7">SRT-7/MS LIGHT SERIES (2.05/1000)</option>
 <%} 
 else if (valProduct==2){%>


 <option value="1">Ace Tractors</option>
 <option value="2">Ace Tractors</option>
 <%} 
 else if (valProduct==3){%>


<option value="1">Complete Reaper Binder</option>
<option value="2">Tractor Mounted Reaper Binder</option>
<%} 
else if (valProduct==4){
%>

 <option value="1">MDH-50A (HP-0.5) Self Priming</option>
 <option value="2">MDH-27A (HP-0.5) Self Priming</option>
 <option value="3">MDH-27ASF (HP-1.0) Self Priming</option>
 <option value="4">MCJ051SP (HP-0.5) Shallow Well Jet</option>
 <option value="5">MCJ101SP (HP-1.0) Shallow Well Jet</option>
<%} %>
</select>
<div id="divRate"> 

</div>

</body>
</html>

此外，selPrice.jsp也是as。

<%@ 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>
<% String selModel= request.getParameter("selModel");
String selProduct=request.getParameter("selProduct");
//int valModel=1;
int valProduct= Integer.parseInt(selProduct);
valModel= Integer.parseInt(selModel);
System.out.println(selModel);
System.out.println(valProduct);
System.out.println(valModel);
System.out.println(session.getAttribute("name"));
%>

<%if(valProduct ==0 && valModel==1 ){ %>
 <input type="text" value="173000" readonly="readonly">
<%} 
else if(valProduct ==0 && valModel==2 ){ %>
<input type="text" readonly="readonly" value="183000">
<%}
else if (valProduct==1 && valModel==1){%>
<input type="text" readonly="readonly" value="400000" >


<%} 
else if (valProduct==1 && valModel==2){%>
<input type="text" readonly="readonly" value="450000">
<%} %>


</body>
</html>

这应该像我选择产品一样，根据它的值，模型是从NewFile.jsp填充的。这工作得很好。在NewFile.jsp中，在选择模型时，将使用值selProduct和selModel填充价格。当我运行NewFile.jsp时，这个价格会增加，但当我运行mainFile.jsp时，NewFile.jsp会将selModel作为null传递给selPrice.jsp。所以我被困在这里了，我可能在这里做错了什么，但我找不到它。所以在这里任何帮助都是很好的。

谢谢

java

javascript

ajax

jsp

回答 1

Stack Overflow用户

发布于 2014-10-17 21:26:07

有很多方法可以使用。

例如，您可以将所需的记录存储在临时数据库表中，或者使用以下代码作为更好的方法：

localStorage.setItem("ID", MyVar);

然后使用

var MyID= localStorage.getItem("ID");

从另一个页面读取值

希望我的英语讲得很清楚。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/26425881

复制

相似问题

问使用AJAX从两个页面上的数据填充网页
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用AJAX从两个页面上的数据填充网页EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用AJAX从两个页面上的数据填充网页
EN