Need help on how to use the same code and display in different divs.
What I want to be able to do is have the user chose to start the display by either ORG, DIR, MGR, COACH or EMP. From that starting point the user can drill down to the next level or do a sub report or see the tickets at that level. I use the same php code to query the database depending on the level that is chosen.
An example would be for the user to chose MGR from the query screen. It would display all the MGRs and then the user could drill down to the next level or chose the sub report or tickets.
I have it working for only the ORG level with no drill downs to the next level. They can only do the subreport or tickets. Below is the ajax code and the divs associated.
// run the report
$.ajax({
url: href,
type: "POST",
cache: false,
data: serializedData,
beforeSend: function(){
$("#loadingORGReport").show();
$("#ipmReportORGOutput").hide();
},
complete: function(){
$("#loadingORGReport").hide();
$("#ipmReportORGOutput").show();
$(window).scrollTop($('#ipmReportORGOutput').offset().top);
},
success: function(response, textStatus, jqXHR)
{
$("#ipmReportORGOutput").html(response);
//NEW STUFF
$(".view-subreport").click(function(event){
var f = document.query;
var href = $(this).attr('href');
var href3 = document.location.pathname + "report.php";
serializedSubData = serializedData + "&"
+ href.substring(href.indexOf("?")+1);
// run the tickets drilldown report
$.ajax({
url: href3,
type: "post",
cache: false,
data: serializedSubData,
beforeSend: function(){
$("#loadingSubReport").show();
$("#ipmSubReport").hide();
$("#ipmTickets").hide();
$(window).scrollTop($('#loadingSubReport').offset().top);
},
complete: function(){
$("#loadingSubReport").hide();
$("#ipmSubReport").show();
$(window).scrollTop($('#ipmSubReport').offset().top);
},
success: function(responseDrill, textStatusDrill, jqXHRDrill)
{
$("#ipmSubReport").html(responseDrill);
$(".view-tickets").click(function(event){
var f = document.query;
var href = $(this).attr('href');
var href4 = document.location.pathname + "tickets.php";
serializedDataDrill = serializedSubData + "&"
+ href.substring(href.indexOf("?")+1);
// run the tickets drilldown report
$.ajax({
url: href4,
type: "post",
cache: false,
data: serializedDataDrill,
beforeSend: function(){
$("#loadingTickets").show();
$("#ipmTickets").hide();
$(window).scrollTop($('#loadingTickets').offset().top);
},
complete: function(){
$("#loadingTickets").hide();
$("#ipmTickets").show();
$(window).scrollTop($('#ipmTickets').offset().top);
},
success: function(responseDrill, textStatusDrill, jqXHRDrill)
{
$("#ipmTickets").html(responseDrill);
$(".modalpopupIframe").modalpopup({width:"100%", height:"75%", iframe:true});
} //function(responseDrill, textStatusDrill, jqXHRDrill):
}); //ajax
return false;
}); //(function(event))
} //function(responseDrill, textStatusDrill, jqXHRDrill):
}); //ajax
return false;
}); //(function(event))
$(".view-tickets").click(function(event){
var f = document.query;
var href = $(this).attr('href');
var href2 = document.location.pathname + "tickets.php";
serializedDataDrill = serializedData + "&"
+ href.substring(href.indexOf("?")+1);
// run the tickets drilldown report
$.ajax({
url: href2,
type: "post",
cache: false,
data: serializedDataDrill,
beforeSend: function(){
$("#loadingTickets").show();
$("#ipmTickets").hide();
$("#ipmSubReport").hide();
$(window).scrollTop($('#loadingTickets').offset().top);
},
complete: function(){
$("#loadingTickets").hide();
$("#ipmTickets").show();
$(window).scrollTop($('#ipmTickets').offset().top);
},
success: function(responseDrill, textStatusDrill, jqXHRDrill)
{
$("#ipmTickets").html(responseDrill);
$(".modalpopupIframe").modalpopup({width:"100%", height:"75%", iframe:true});
} //function(responseDrill, textStatusDrill, jqXHRDrill):
}); //ajax
return false;
}); //(function(event))
} //function(response)
}); //ajax
}
}); //query submit
}); //ready function
<div id="loadingORGReport" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmReportORGOutput" style="clear: left;"></div>
<br />
<div id="loadingDIRReport" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmReportDIROutput" style="clear: left;"></div>
<br />
<div id="loadingMGRReport" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmReportMGROutput" style="clear: left;"></div>
<br />
<div id="loadingCOACHReport" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmReportCOACHOutput" style="clear: left;"></div>
<br />
<div id="loadingEMPReport" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmReportEMPOutput" style="clear: left;"></div>
<br />
<div id="loadingSubReport" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmSubReport" class="ipmSubReport" style="clear: left;"></div>
<br />
<div id="loadingTickets" style="clear: left;"><img src="/images/running_man.gif" alt="LOADING" width="42" height="42"></div>
<br />
<div id="ipmTickets" class="ipmTickets" style="clear: left;"></div>
</div>