我们有一个报告，当用户单击特定行的对话框链接时，会出现一个模式对话框，其中包含有关该特定行的其他详细信息。目前，我们没有动态加载这些数据，我们之前有这样做的原因，因为我们希望对话框中的数据与聚合的行匹配。
原来我从一个我不拥有的存储过程中提取的这些数据需要很多秒才能加载（因为它是计算的而不是聚合的），并且由于它不动态加载对话框内容，它显着减慢了这个报告，因为页面上的数据是聚合的，但对话框中的数据不是。IMO 数据调用是根本原因，需要修复，但目前我必须将加载时间移到对话框加载数据的时间。
我希望从这里开始动态加载这些内容，类似于这里
但是，由于对话框链接我还为该单击的元素打开了一个独特的对话框，并从数据库中检索了该特定链接的内容，我不确定我是否可以简单地执行特定页面的 .load() 而不传递它点击了什么链接，等等。
当前功能：
HTML：
<c:if test="${seg.user.sbaEnabled && seg.sbaParamEnabled}">
<c:set var="dialogcount" value="0" scope="page" />
<c:forEach var="segment" items="${seg.dataList}">
<c:set var="dialogcount" value="${dialogcount + 1}" scope="page"/>
<div id="dialog<c:out value="${dialogcount}"/>" class="hidden" title="<spring:message code="perfseg.sbasegtitle"/> (<c:out value="${segment.segment}"/>)">
<div class="theaddiv">
<table class="reportingheader" style="width:100%;">
<thead>
<tr>
<th style="width:32%;">
<spring:message code="perfseg.sbasalesassociate"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbasales"/>
</th>
<th style="width:15%;">
<spring:message code="perfseg.sbapersales"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbatrans"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbaads"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbaupt"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbaspah"/>
</th>
<!--Spacing for scrollbar alignment-->
<th style="width:3%;">
</th>
</tr>
</thead>
</table>
</div>
<div class="tbodydiv" style="width: 100%;">
<table class="reportingbody" style="width:100%;">
<tbody>
<c:forEach var="sba" items="${segment.sbaList}">
<tr>
<td style="width:32%">
<c:if test="${sba.name ne 'Unassigned'}"><c:out value='${sba.name}'/></c:if>
<c:if test="${sba.name eq 'Unassigned'}"><spring:message code="perfseg.sbaunassigned"/></c:if>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sba.sales}' type="number"/>
</td>
<td class="center" style="width:15%;">
<fmt:formatNumber value='${sba.percentSales}' type="number" minFractionDigits="1" maxFractionDigits="1"/>%
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sba.trans}' type="number"/>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sba.ads}' type="number" minFractionDigits="2" maxFractionDigits="2"/>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sba.upt}' type="number" minFractionDigits="2" maxFractionDigits="2"/>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sba.spah}' type="number" minFractionDigits="2" maxFractionDigits="2"/>
</td>
<td style="width:3%;">
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
<hr style="height:1px; border:none; color: #AAAAAA; background-color: #AAAAAA;"/>
</div>
</c:forEach>
<div id="dialogbtnttl" class="hidden" title="<spring:message code="perfseg.sbadaytitle"/>">
<div class="theaddiv">
<div class="hidden center">
<b class="infoTextBig"><spring:message code="perfseg.sbadaytitle"/></b>
<br>
<div class="infoText">
<c:out value="${seg.brandName}"/> - <%=SystemConfig.getTranslatedTextByKey(LBIBOConstants.LANG_KEY_COMMON_TXTSTORE, userLocale)%> <c:out value="${seg.legacyStoreId}"/>
</div>
<br>
<%@ include file="../include/print_header.jsp" %>
<br>
<fmt:formatDate pattern="${seg.rptDateFormat}" value="${seg.transDate}" />
<br>
<br>
</div>
<table class="reportingheader" style="width:100%;">
<thead>
<tr>
<th style="width:32%;">
<spring:message code="perfseg.sbasalesassociate"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbasales"/>
</th>
<th style="width:15%;">
<spring:message code="perfseg.sbapersales"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbatrans"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbaads"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbaupt"/>
</th>
<th style="width:10%;">
<spring:message code="perfseg.sbaspah"/>
</th>
<!--Spacing for scrollbar alignment-->
<th style="width:3%;">
</th>
</tr>
</thead>
</table>
</div>
<div class="tbodybtndiv" style="width: 100%;">
<table class="reportingbody" style="width:100%;">
<tbody>
<c:forEach var="sbaTotal" items="${seg.sbaList}">
<tr>
<td style="width:32%">
<c:if test="${sbaTotal.name ne 'Unassigned'}"><c:out value='${sbaTotal.name}'/></c:if>
<c:if test="${sbaTotal.name eq 'Unassigned'}"><spring:message code="perfseg.sbaunassigned"/></c:if>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sbaTotal.sales}' type="number"/>
</td>
<td class="center" style="width:15%;">
<fmt:formatNumber value='${sbaTotal.percentSales}' type="number" minFractionDigits="1" maxFractionDigits="1"/>%
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sbaTotal.trans}' type="number"/>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sbaTotal.ads}' type="number" minFractionDigits="2" maxFractionDigits="2"/>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sbaTotal.upt}' type="number" minFractionDigits="2" maxFractionDigits="2"/>
</td>
<td class="center" style="width:10%;">
<fmt:formatNumber value='${sbaTotal.spah}' type="number" minFractionDigits="2" maxFractionDigits="2"/>
</td>
<td style="width:3%;">
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>
</c:if>
用于链接和对话框的 JS：
$( "[id^=dialog]").dialog({
width: 555,
height: 315,
autoOpen: false,
resizable: false,
modal: true,
closeOnEscape: true
});
$( "#dialogbtnttl").dialog({
width: 555,
height: 315,
autoOpen: false,
resizable: false,
modal: true,
buttons: dialogButtons,
closeOnEscape: true
});
// Link to open the dialog
$( ".dialog-link" ).click(function() {
//event.preventDefault();
var btnflag = $( this ).attr("data-btnflag");
var seg = $( this ).attr( "data-seg" );
if (btnflag == "false"){
$( "#dialog"+seg ).removeClass("hidden");
$( "#dialog"+seg ).dialog( "open" );
}
else {
$( "#dialogbtnttl" ).removeClass( "hidden" );
$( "#dialogbtnttl" ).dialog( "open" );
}
});
有人对我必须做的这个改变有什么建议吗？加载时，如何加载该特定报告行独有的数据？
编辑 1-
我正在阅读 .load 的 API，显然我们可以传递一些参数，这些参数可能有助于唯一地识别正在请求其数据的行，但我不确定这些参数如何被使用/检索我必须创建包含对话框内容的页面本身。
不过，在这一点上，可能有一些更好的解决方案，我只是没有想到。