At 14:09 04/21/2003 -0700, you wrote:
Brad,

I have struggled with a similar problem. There are many sites that require this same type of mechanism. I found an excellent working solution at

http://www.hertzcarsales.com/findcar/index.html

At this site they do not pre-load the arrays, rather they do the server round trip and redraw the page. This does not solve your problem but suggests that others with the same problem have not found an efficient way to avoid the trip to the server. It all boils down to a balance between server trips, page loading times, memory, and other considerations.

I've done this type of thing in the past. Works well if the resulting pages are small but isn't desirable if the returned result is large. If you look at my original post I mentioned that one thing I'd like to do is be able to enter a value and automatically fill in a row. We have an interface in mind that will be a data entry grid. Using the above approach would require you to redraw the grid everytime you did a lookup. With a large grid with many prefilled values, this could be difficult to do. Being able to just update the necessary fields in a row would be much more efficient (and pretty slick too!).


It would be useful to hear if you discover an effective mechanism for reducing the server trips.


I think I have.

Others on this list (Zach Dennis, Peter Tippett) indicated that what I wanted to do is possible. After a number of off-list discussions with Zach, a few evenings pouring over my _javascript_ books, and Michael Bond's post this morning regarding autogenerating _javascript_ I have come up with a solution that doesn't necessarily cut down round trips to the server, but does result in responses that are much smaller and don't require complete page redraws.

I'll try to explain it here via code. Hopefully you mailer won't munge the code listings.
I'd put a working example up on the web, but I'm working behind a firewall.


To begin with, I have a frameset with two frames. Each frame is an Active4D Page.

+-------------------------------------+
|                                     |
|            Variable Height          |
|          Main Display Frame         |
|               aka topFrame          |
|                                     |
+-------------------------------------+
|   1 - Pixel High "Processor" frame  |
|            aka bottomFrame          |
+-------------------------------------+

The "Processor" frame doesn't display anything. It just runs Active4D Code, and some static and dynamically generated _javascript_.
In the Main Display Frame I have a <SELECT> menu which is defined as follows.

<select name="lists" id="lists" >
Here is the _javascript_ "jumpFrame" function.

function jumpFrame(newLoc){
   nextPage = newLoc.options[newLoc.selectedIndex].value        
   if (nextPage != ""){
      parent.frames['bottomFrame'].location = nextPage;
   }
}

What this does is call the Active4D page that is in the processer frame. The code for that page looks like this.

<%
array text ($listItemKeys_AT;0)
array text ($listItemNames_AT;0)
if (defined($key))
        
        query ([DBLIST_ITEM];[DBLIST_ITEM]dblist_key=$key)
        if (records in selection ([DBLIST_ITEM])>0)
            order by ([DBLIST_ITEM];[DBLIST_ITEM]dblstitm_key;>)
            selection to array ([DBLIST_ITEM]dblstitm_key;$listItemKeys_AT;[DBLIST_ITEM]dblstitm_label;$listItemNames_AT)
        end if
        
end if
$arrSize := size of array ($listItemKeys_AT)
%>

<script language="_javascript_1.1">
// build two JS arrays based on query
var aKeys = new Array();
var aNames = new Array();

// assign a4D generated array values to js arrays
// Active4D is doing the loop, i.e. writing the array assignments
<% for ($i;1;size of array ($listItemKeys_AT)) %>
        aKeys[<%= $i-1 %>] = "<%= $listItemKeys_AT{$i} %>";
        aNames[<%= $i-1 %>] = "<%= $listItemNames_AT{$i} %>";
<% end for %>

// call function that will update select menu in the calling frame
parent.topFrame.updateSelectMenu(aNames,aKeys);
aNames.length = 0;
aKeys.length = 0;
</script>

What this does is gets a value for the selected menu item from the Display Frame. The menu contains a list of "lists". It uses the key to query for matching list items and builds two _javascript_ arrays containing item keys and item text. It then calls a _javascript_ function which is in the displayframe named "updateSelectMenu". That function dynamically builds a select menu containing the selected list's list items. Here's "updateSelectMenu".

function updateSelectMenu(aLabels,aValues){
  document.forms['menusForm'].listItems.options.length = 0; //clear preset menu
  for( i = 0 ; i < aLabels.length ; i++){
        document.forms['menusForm'].listItems.options[i] = new Option(aLabels[i],aValues[i]);
  }
}

While I have only used this for a simple example, I think it has many possibilities. Granted _javascript_ has to be enabled for this to work, and you do have to deal with cross-browser issues, etc., but I see this as being well suited for intranet, extranet type apps where you can have some say in what is turned on and what browsers are used. I also think that this technique could be applied to do real-time web client to server data validation such as the one gentlemen (See "Very new to Active4D") inquired about.

best,

Brad


Reply via email to