When a user clicks Change, a record in the Eval database is inserted or updated. When a user clicks Delete, a record is deleted. Because these actions change the content of the left pane list, the list must be updated. The topics in the following procedure describe how functions in the LoadList.js file reload the list after a user adds, changes, or deletes a record.
To reload the list after table actions
The PostActions method in the SQLXML component handles all updates to tables. PostActions: Where the Data Writing Process Begins and Calling the Client-Side updateView Function describe calls to the updateView function in the JavaScript files that are associated with the PT application forms; for example, if a user reloads the list in the left pane of the Group form, updateView in Group.js is called.
The following code fragments, which are from the updateView function in Group.js, show how to reinitialize the hidden fields in Group.htm according to the action the user performs on the table.
function updateView(actn,id) {
switch (actn) {
When the user adds a record, id is passed to the reloadList function as a parameter value.
case 'ADD':
// set new ID in form
document.frmGroup.elements("ID").value = id;
document.frmGroup.GroupId.value = id;
// return form to "CHANGE" mode
document.frmGroup.actionBtn.value = "CHANGE";
document.frmGroup.procName.value = "lw_changeGroup";
parent.frames("LEFTPANE").reloadList(id);
loaded();
break;
When the user deletes a record, null, not id, is passed to reloadList as a parameter value.
case 'DELETE':
document.frmGroup.reset();
parent.frames("LEFTPANE").reloadList(null);
break;
When the user changes a record, id is passed to reloadList as a parameter value.
case 'CHANGE':
parent.frames("LEFTPANE").reloadList(id);
break;
The reloadList function in LoadList.js first calls the resetRows function to reinitialize the TargetTable. Next, reloadList loads the searchId variable with the value of the parameter, associates the dataAvailable function with the onreadystatechange event of xmldso (an XML Data Source Object), and loads the SourceTable, which is bound to xmldso, with an XML data stream. The following code fragment shows the sequence of statements that refresh the list:
function reloadList(id) {
resetRows();
searchId = id;
var xmldoc = xmldso.XMLDocument;
xmldoc.ondataavailable = noOp; // won't accept null
xmldoc.onreadystatechange = dataAvailable;
xmldoc.load(xmldoc.url); // reload the current dataset
When the readystate property of the XMLDocument object changes, the dataAvailable event is called and it, in turn, calls the doLoad function. Reloading the List After Table Actions, Reloading Lists, and Reloading List Content After Full-Text Search describe how the dataAvailable function is used. After doLoad is called, the process of loading the TargetTable with an initial dataset is identical to the steps described in Run Script in doLoad Function, which is part of Loading the List When Forms First Appear.
Reloading a list after an add or change operation differs from the initial load process because the current record (the one that appears in the right pane) must be the first visible entry in the list. The following line of code from the copyRows function shows the first attempt to find the row of the current record during the process of inserting rows in the TargetTable. You can find additional information about copyRows in Call copyRows Function, which is part of Loading the List When Forms First Appear.
if (searchId == row.cells[0].innerText) lastElem = copyCell;
If the searchId is not found, the following code runs and the functions page through the data to locate the row of the current record. Functions in LoadList.js contains a brief description of the selectFirst and testForScroll functions.
if (lastElem) {
searchId = null;
selectFirst();
testForScroll();