java - ajax调用加载器url多次加载相同的div标签问题
问题描述
您能否帮我解决这个问题,因为我只是学习 ajax 并试图融入我的要求。
我的要求:
当我单击特定图像时,它应该调用同一页面,但会根据调用的参数值加载具有不同值的表数据。因此建议我使用 AJAX,因为它不会重新加载整个页面。
查询
$("#goToCostTypeID").click(function () {
var costType = document.getElementById("costType").value;
if(costType == "Actual"){
costType = "Budget";
document.getElementById("costType").value = "Budget";
} //if actuals ends
if(costType == "Budget"){
costType = "Forecast";
document.getElementById("costType").value = "Forecast";
} //if actuals ends
if(costType == "Forecast"){
costType = "Actual";
document.getElementById("costType").value = "Actual";
} //if actuals ends
var Budget = costType;
$.ajax({
dataType : "html",
url:'my.jsp?productID=6&appID=6&txtHidden=Costs&mode=Edit&costType='+costType,
type:'POST',
contentType :'application/x-www-form-urlencoded; charset=UTF-8',
data:{costType:Budget},
success:function(result){
console.log("YES");
$("#costContent").load('my.jsp?productID=6&appID=6&txtHidden=Costs&mode=Edit&costType='+costType);
}
});
});
HTML
<td width="2%" id="goToCostTypeID"> <a href="#" ><img src="../images/goto.png"/></a></td>
<div id="costContent">
<td width="13%" ><input type="hidden" id="cost_type_<%=i+1 %>" name="cost_type_<%=i+1 %>[]" value="<%=Bean.getLevelTwoOrgId()%>"/><%=Bean.getCcLevel2()%></td>
<td width="12%" ><input type="hidden" id="intival_<%=i+1 %>" name="intival_<%=i+1 %>[]" value="<%=Bean.getInitProj()%>"/><%=Bean.getInitProj()%></td>
爪哇
String costType = request.getParameter("costType");
uploadCostList =DAO.doGetAppCostUploadedList(PK_AppID,costType,iPresentYear);
单击图像时,我多次获得同一张桌子。请帮我。
问候, Saranya C
解决方案
据我所知,您只需要这样做:
$("#goToCostTypeID").on('click', function() {
const currentCostType = $('#cost_type').val();
const nextCostType = currentCostType === 'Actual' ? 'Budget' : currentCostType === 'Budget' ? 'Forecast' : 'Actual';
$('#cost_type').val(nextCostType)
const url = 'my.jsp?' + $.param({
productID: '68',
appID: '68',
txtHidden: 'Costs',
mode: 'Edit',
costType: $("#costType").val()
});
$("#costContent").load(url);
});
推荐阅读
- kubernetes - istio-engressgateway 在 microk8s 中不起作用
- node.js - 无法在 Windows 容器上部署 Node JS 模块
- vue.js - 在 V-Card 中使用 V-flex 未按预期工作
- java - 如何在午夜自动移动日志文件?
- linux - Bash 脚本键入控制台“退出”,然后按 ENTER 键
- javascript - 重用 Javascript 代码,而无需一次又一次地重新粘贴它
- flutter - 任务“:flutter_facebook_login:verifyReleaseResources”执行失败。在发布模式下出现此问题
- sql - 更新表中的不同行数
- spring - Spring testcontainers Driver org.testcontainers.jdbc.ContainerDatabaseDriver 声称不接受 jdbcUrl
- html - 如何在文件中选择文件后检查文件的更改?