jquery查询后台数据库，如何显示到当前页面

Question

jquery联动菜单的值从数据库获得数据，如何显示在当前页面（当面页面已有一行表格字段）jquery

Answer 1

发个给你参照一下var arrayId = new Array(); 
var language;
var getData  =function(_num){
if(_num==undefined || _num=='undefined'){
_num = 0;
}
//alert(_num);
urlPath = "user/getTicketInfo.do?num="+_num+"&selectedIds="+arrayId;
$.ajax({
type: "post",
contentType : 'application/json',     
processData : false, 
url: urlPath,
dataType:'json' ,
beforeSend: function(XMLHttpRequest){
//ShowLoading();
},
success: function(data, textStatus){
var str = "<table  width=\"900\"  cellpadding=\"0\" cellspacing=\"2\"  >";
var back = data.back;
var next = data.next;
var begin = data.begin;
language = data.language;
var selectedIds = data.selectedIds;
//for(var i=0;i<selectedIds.length;i++){
//arrayId.push(selectedIds[i]);
//}
//alert(selectedIds);
var ticketInfos = data.ticketInfoList;
//alert();
for(var i=0;i<ticketInfos.length;i++){
var ticketInfo = ticketInfos[i];
str += "<tr>";
str += "    <td height=\"30\" width=\"20\" valign=\"middle\"></td><td height=\"30\" width=\"30\" align=\"right\" >"; 
if(ticketInfo.ticketPrintState=="true" || ticketInfo.canPrint == false){
str += "         <img  src=\"image/other/noselect.gif\" id=\""+ticketInfo.ticketNo+"\" width=\"35\" height=\"35\">";
}else{
var flag = false;
for(var k=0;k<selectedIds.length;k++){
if(selectedIds[k]==ticketInfo.ticketNo){
flag = true;
break;
}else{
flag =false;
}
}
if(flag){
str += "     <img  src=\"image/other/select.jpg\"  name=\"checkbox\" id=\""+ticketInfo.ticketNo+"\" fid=\"1\" width=\"35\" height=\"35\" onmousedown=\"changeSelected(this)\">";
}else{
str += "     <img  src=\"image/other/noselect.jpg\"  name=\"checkbox\" id=\""+ticketInfo.ticketNo+"\" fid=\"0\" width=\"35\" height=\"35\" onmousedown=\"changeSelected(this)\">";
}

}

str += "    </td>";
if(language=="eng"){
str += "<td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"><strong>Ticket No</strong></td>";
}else{
str += "<td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"><strong>票号</strong></td>";
}
str += "    <td height=\"30\" width=\"195\" align=\"left\" bgcolor=\"#999999\"><strong>&nbsp;&nbsp;"+ticketInfo.ticketNo+"</strong></td>";
str += "    <td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"></td>";
str += "    <td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"></td>";
if(ticketInfo.ticketPrintState="true"){
if(language=="eng"){
str += "    <td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"><strong>Itinerary unprint</strong></td>";
}else{
str += "    <td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"><strong>行程单未打印</strong></td>";
}

}else{
if(language=="eng"){
str += "    <td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"><strong>Itinerary printed</strong></td>";
}else{
str += "    <td height=\"30\" width=\"195\" align=\"center\" bgcolor=\"#999999\"><strong>行程单已打印</strong></td>";
} }

str += "</tr>";
str += "<tr>";
str += "    <td></td>";
str += "    <td height=\"30\" align=\"center\"></td>";
if(language=="eng"){
str += "    <td align=\"center\"><strong><font color=\"red\">Flight No</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">From</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">To</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">Date</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">Class</font></strong></td>";
}else{
str += "    <td align=\"center\"><strong><font color=\"red\">航班号</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">始发站</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">目的站</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">航班日期</font></strong></td>";
str += "    <td align=\"center\"><strong><font color=\"red\">仓位</font></strong></td>";
}

str += "</tr>";
for(var j=0;j<ticketInfo.airrangers.length;j++){
var airrangers = ticketInfo.airrangers[j];
str += "<tr>";
str += "<td></td>";
str += "<td height=\"30\" align=\"center\"></td>";
str += "<td align=\"center\">"+airrangers.fltNo+"</td>";
str += "<td align=\"center\">"+airrangers.from+"</td>";
str += "<td align=\"center\">"+airrangers.to+"</td>";
str += "<td align=\"center\">"+airrangers.fltDate+"</td>";
str += "<td align=\"center\">"+airrangers.bunk+"</td>";
str += "</tr>";
}
} 
str += "</table>";
document.all.ticketInfo.innerHTML = str;
document.all.num.value = begin;
if(back==false){
document.all.backIMG2.disabled = true;
document.all.backIMG2.src= "image/other/arrow_02_disable.png";
}else{
document.all.backIMG2.disabled = false;
document.all.backIMG2.src = "image/other/arrow_02_up.png";
}
if(next==false){
document.all.nextIMG2.src = "image/other/arrow_03_disable.png";
document.all.nextIMG2.disabled = true;
}else{
document.all.nextIMG2.disabled = false;
document.all.nextIMG2.src = "image/other/arrow_03_up.png";
}
//alert(document.all.printTicket.disabled);
document.all.printTicket.className = "disabled";
if(language=="eng"){
document.all.dzkp.innerHTML = "<strong><span>The itinerary e-tickets which you are about to print are:<br/></span>"+selectedIds+"</strong>";
}else{
document.all.dzkp.innerHTML = "<strong><span>你即将打印的行程单的电子客票号是:<br/></span>"+selectedIds+"</strong>";
}

return false;

},
complete: function(XMLHttpRequest, textStatus){
//HideLoading();
},
error: function(){
//请求出错处理
}
});
}function  changeSelected(object){
var checkbox = object;

if(checkbox.fid=="1"){
checkbox.src = "image/other/noselect.jpg";
checkbox.fid="0";
for(var i=0;i<arrayId.length;i++){
if(arrayId[i] == checkbox.id)
arrayId.splice(i,1);
}
}else if(checkbox.fid=="0"){
if(arrayId.length==4){
if(language=="eng"){
alertOK("popup_container","popup_title","popup_alert","警告(warn)", 'sorry,the count of selected tickets is more than 4 ET!');
//alert("sorry,the count of selected tickets is more than 4 ET!");
}else{
alertOK("popup_container","popup_title","popup_alert","警告(warn)", '最多只能同时打印4张电子客票!');
//alert("最多只能同时打印4张电子客票!");
}

return false;
}
checkbox.src = "image/other/select.jpg";
checkbox.fid="1";
arrayId.push(checkbox.id);
}
if(arrayId!=""){
if(language=="eng"){
document.all.dzkp.innerHTML = "<strong><span>The itinerary e-tickets which you are about to print are:</span><br>"+arrayId+"</strong>";
}else{
document.all.dzkp.innerHTML = "<strong><span>你即将打印的行程单的电子客票号是:</span><br>"+arrayId+"</strong>";
}
document.all.selectedTickets.value = arrayId ;
}else{
if(language=="eng"){
document.all.dzkp.innerHTML = "<strong><span>The itinerary e-tickets which you are about to print are:</span><br></strong>";
}else{
document.all.dzkp.innerHTML = "<strong><span>你即将打印的行程单的电子客票号是:</span><br></strong>";
}

}
}

Answer 2

请百度  ajax 多级联动

Answer 3

jquery异步请求数据，返回json?xml?text，js操作dom动态改变页面控件值。

Answer 4

ajax 异步请求 百度个例子看看吧~~

Answer 5

就是取到数据后 自己手动添加到dom里

Answer 6

无论是以什么样的形式解答，很谢谢大家对一个java新人的帮助和教导，个人会改变自己解决问题的思路