Quick hint needed on loading grid data with AJAX
Hi,
maybe just a stupid question, but... As I said in other post, I am making some app for my Boss, and i get stacked a bid with this (not sure if it belongs here, but propably at last some one could help me here ;-) ):
I am dynamicaly loading form into the page using Ajax.updater method from prototype.js library. It works fine and puts the form into "appWin_div". If the form contains grid, it calls the updater again and puts some script to evaluate but puts it into "profreFrame" (DIV).
The problem is, that the new loaded script calls methods to update data in the grid but allwayd throws error : "gridClients - method not supported" but it exist and is visible in "appWin_div".
So how should i call the methods of that dynamicaly loaded object ? Cause direct call just does not work :(
Here is the main from the code:
Main page:
Form grid definition called by:
Form grid definition is:
Form grid data sample:
maybe just a stupid question, but... As I said in other post, I am making some app for my Boss, and i get stacked a bid with this (not sure if it belongs here, but propably at last some one could help me here ;-) ):
I am dynamicaly loading form into the page using Ajax.updater method from prototype.js library. It works fine and puts the form into "appWin_div". If the form contains grid, it calls the updater again and puts some script to evaluate but puts it into "profreFrame" (DIV).
The problem is, that the new loaded script calls methods to update data in the grid but allwayd throws error : "gridClients - method not supported" but it exist and is visible in "appWin_div".
So how should i call the methods of that dynamicaly loaded object ? Cause direct call just does not work :(
Here is the main from the code:
Main page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<LINK href="default.css" rel=stylesheet type="text/css" charset="utf-8">
<meta http-equiv="pragma" content="no-cache">
<title>PNC WAIS 2.0 :: </title>
<style type="text/css">
.WAIS_icon_new_off {background: url(AW/styles/main_icons_off.png) -280px 0px; position:absolute; left:10px; top: 2px; visibility:hidden;}
.WAIS_icon_save_off {background: url(AW/styles/main_icons_off.png) -40px 0px; position:absolute; left:30px; top: 2px; visibility:hidden;}
.WAIS_icon_report_off {background: url(AW/styles/main_icons_off.png) -360px 0px; position:absolute; left:50px; top: 2px; visibility:hidden;}
</style>
<style type="text/css">
.aw-system-control {position: absolute;}
.aw-ui-group {background-image:url('./AW/styles/aqua/bg1.png');}
Contextual .aw-gecko .aw-ui-group {background-image:url('./AW/styles/aqua/bg1.png');}
.aw-grid-row {border-bottom: 1px solid threedlightshadow;}
.aw-cells-selected, .aw-rows-selected {color: #fff!important; background: #396FA2!important;}
.aw-rows-selected .aw-grid-cell {background: none!important;}
</style>
<script type="text/javascript" src="./prototype/dist/prototype.js"></script>
<SCRIPT language=JavaScript1.2 src="./Engine/stm31.js" type=text/javascript></SCRIPT>
<script src="./AW/lib/aw.js"></script>
<link href="./AW/styles/aqua/aw.css" rel="stylesheet" charset="utf-8">
<script>
function getHTML(target_div,url, pars)
{
var appWinLoader = new Ajax.Updater( target_div, url, { method: 'post', parameters: pars, evalScripts: true });
}
function getDATA(target_div,url, pars)
{
var appDataLoader = new Ajax.Updater( target_div, url, { method: 'post', parameters: pars, evalScripts: true });
}
AW.UI.Input.prototype.onControlActivated = function(event){
this.setStyle('background', '#CFDEFF');
}
AW.UI.Input.prototype.onControlDeactivated = function(event){
this.setStyle('background', 'white');
}
</script>
</head>
<body bgcolor="#ffffff" text="#000000" link="#009966" vlink="#5493B4" leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0" style=" background-image:url('./AW/styles/aqua/bg2.png'); margin:Opx; padding:0px;" onLoad="javascript:getHTML('appWin_div','http://itc.ace-com.cz/PNC/templates/Login_screen.html', '');">
<div id="main_WAIS_menu" style="position:absolute; top:Opx; left:0px; height:25px; width:100%; background-image: url(./images/design/cellpic3.gif);">
<SCRIPT language=JavaScript1.2 src="./Engine/hmenu_to_var.php" type=text/javascript></SCRIPT>
</div>
<div id="mainMenuButtons" style="position:relative; top:5px; height:25px; text-align:right">
<a id="setup_link" name="setup_link" href="javascript:alert('Not Implemented Yet');" style=" border-width:0px"><img src="./images/icons/configure.png" alt="setup" align="baseline" style="border-width:0px"></a>
<a id="help_link" name="help_link" href="javascript:alert('Not Implemented Yet');" style="border-width:0px"><img src="./images/icons/help.png" alt="help" align="baseline" style="border-width:0px"></a>
<a id="logout_link" name="logout_link" href="javascript:alert('Not Loged In!');" style="border-width:0px"><img src="./images/icons/exit_small.png" alt="exit" align="baseline" style="border-width:0px"></a>
</div>
<div style="background-image:url('./images/design/midle_menu_back.gif'); height:23px; width:100%; position:absolute; left:Opx; top:26px;">
<div class="WAIS_icon_new_off"><a href="" title="Nový záznam"><img src="images/design/blank.gif" alt="Spacer" width="23" height="23" border="0" /></a></div>
<div class="WAIS_icon_save_off"><a href="" title="Uloit"><img src="images/design/blank.gif" alt="Spacer" width="23" height="23" border="0" /></a></div>
<div class="WAIS_icon_report_off"><a href="javascript:appWin.grid1.sendRequest('POST','http://itc.ace-com.cz/PNC/includes/getRecords.php','')" title="Sestavy"><img src="images/design/blank.gif" alt="Spacer" width="23" height="23" border="0" /></a></div>
</div>
<div align="center" id="appWin_div" style="width:100%; position:absolute; top:50px; vertical-align:middle">
</div>
<div id="progresFrame" align="center" style="background:#CC9966; position:absolute; left:500px; top:200px; width:200px; height:100px; visibility: hidden;">
<h3>
Zpracovávám informace
</h3>
</div>
<script>
window.document.body.scroll="no";
top.document.getElementById("Stm0p0i").style.visibility="hidden";
var userIDcard = new Object;
userIDcard.userId = '';
</script>
</body>
</html>Form grid definition called by:
getHTML('appWin_div','http://itc.ace-com.cz/PNC/templates/485_form.php?', '')Form grid definition is:
var gridClients_data =
[
["","","","","", "", "", "",""],
];
var gridClients_Columns = ["ID","Č.Z.","Společnost", "Ulice", "č.p.", "Město", "Stř.", "OTZ","Postavení"];
var gridClients = new AW.Grid.Extended;
var str = new AW.Formats.String;
var num = new AW.Formats.Number;
gridClients.setCellFormat([num,num,str,str,str,str, num, num,str,str]);
gridClients.setCellText(gridClients_data);
gridClients.setHeaderText(gridClients_Columns);
gridClients.setRowCount(2);
gridClients.setColumnCount(9);
gridClients.setSelectionMode("single-row");
gridClients.setSelectorVisible(false);
gridClients.setSelectorText(function(i){return this.getRowPosition(i)+1});
gridClients.setSelectorWidth(28);
gridClients.setHeaderHeight(20);
gridClients.setCellEditable(false);
gridClients.setFixedLeft(3);
gridClients.setVirtualMode(true);
gridClients.defineRowProperty("Mybackcolor", function(row){
return this.getCellValue(8, row);
});
gridClients.getRowTemplate().setStyle("background-color", function(){
return this.getRowProperty("Mybackcolor");
});
gridClients.onCurrentRowChanged = function()
{
inputClientName.setControlText(gridClients.getCellText(2,gridClients.getCurrentRow()));
inputStreet.setControlText(gridClients.getCellText(3,gridClients.getCurrentRow()));
inputTown.setControlText(gridClients.getCellText(4,gridClients.getCurrentRow()));
inputZip.setControlText(gridClients.getCellText(5,gridClients.getCurrentRow()));
}
gridClients.setSelectedRows([0]);
gridClients.setPosition(20, 210);
gridClients.setSize(960, 280);
var page1 = [ groupClientId,
pictureGroupClientId,
labelClientName, labelStreet,labelTown,labelOwner,labelWebPage,
inputClientName, inputStreet, inputHouse,inputTown,inputZip,inputOwner, inputWebPage,
groupClientType,
pictureGroupClientType,
labelClientResort, labelBussinesType, labelClientType, labelOtz,
comboClientResort, comboBussinesType, comboClientType,
inputOtz,
gridClients
];
document.getElementById("appWin_div").innerHTML = tabs+formFrame+container;
container.element().innerHTML = page1.join("");
getDATA('progresFrame','http://itc.ace-com.cz/PNC/templates/485_data.php?tabno=1','');
tabs.onCurrentItemChanged = function(i) {
container.element().innerHTML = pages[i].join("");
getDATA('progresFrame','http://itc.ace-com.cz/PNC/templates/485_data.php?tabno=' + i,'');
}Form grid data sample:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<LINK href="default.css" rel=stylesheet type="text/css" charset="utf-8">
<meta http-equiv="pragma" content="no-cache">
</head>
<body>
<script type="text/javascript">
// insert javascript arrays produced by PHP functions
var myHeaders = ["ID","cisodb","jméno společnosti","ulice","čp","PSČ","město","středisko","postavení","druh společnosti","OTZ","status klienta","frekvence návtěv"];
var myCells = [
["8","1","Antonín Bárta, Pneuservis","Bílovecká","116","747 06","OPAVA - Kyleovice","12","","","","1",""],
["9","2","A.S. CAR v.o.s.","Gen. Krátkého","9","787 01","UMPERK","21","","","","2",""],
["10","3","AGROFOREST a.s.","Nová pláň","26","792 01","BRUNTÁL","","","","","3",""],
["11","4","AGROMARKET Opava","Jaselská","10","746 01","OPAVA","","","","","4",""],
["12","5","AGROPODNIK a.s., Mydlovary","stř. Mydlovary","0","373 49","MYDLOVARY 90","","","","","5",""],
¨
...
["13","6","AGROPODNIK Tábor a.s.","Ústecká","704","390 01","TÁBOR","41","","","","6",""],
["14","7","AGROSLUBY","","","793 97","SLEZSKÉ RUDOLTICE","","","","","7",""],
["15","8","ALE Václav","Malá","2736","738 01","FRÝDEK-MÍSTEK","","","","","1",""],
["16","9","Alfa Plastik a.s.","Opavská","45","792 11","BRUNTÁL","","","","","1",""],
["3371","2659","JOB FACTORY s.r.o.","Dr.Martínka 1491/7","14917","700 30","OSTRAVA-Ostrava Jih-Hrabůvka","12","","","","1",""]
];
// set grid text
gridClients.setHeaderText(myHeaders);
gridClients.setCellText(myCells);
//alert('Počet sloupců:' + myHeaders.length +'\n Počet řádků: ' + myCells.length);
// set number of columns/rows
gridClients.setColumnCount(myHeaders.length);
gridClients.setRowCount(myCells.length);
gridClients.refresh();
</script>
</body>
</html>ASJ
May 1,