Dynamic List Boxes

[Pat Patullo]

Have two list boxes "Department" and "Employees" on the main page. When selecting
a particular department, the employees list box gets updated accordingly.
After submitting the form and the information of the employee is displayed
on the resulting page, I click on the <BACK> button and find that the values
in the employee box gets reset.

I used the sample code from Boris Feldman "Fill a Select List with Javascript"
found at "http://www.inquiry.com/techtips/js_pro/10min/10min1298/10min1298.asp"

Can someone please show me how to code this properly so that the list boxes
and selections don't get reset when returning back to the main page ?

[Gary]

Pat, I use <div id="mydiv"> tags as place holders for my dynamic select boxes.
I then dynamically change the contents of the page (NO ROUND TRIP TO SERVER)
with syntax like:

mydiv.innerHTML = "...code for an entire select tag..."

I use Remote Scripting to fetch complete HTML code blocks for an entire select
tag, given a parameter.

In your case, you could have a COM object running on the server, with a method
"GetEmployeeList(DepartmentID)". On the change event of the DepartmentID
you would call the method. Here's part of the select tag code for the Department
list:

<SELECT name="selDepartments" size=1 OnChange="GetEmployeeList(this.options[this.selectedIndex].value)">

You then need to create a jscript function called "GetEmployeeList" which
will make the call up the server via RemoteScripting. When the block of
HTML is returned back to the client, the jscript function would then insert
the HTML into the div tag using the syntax I gave above.

This eliminates the problem of having your select boxes reset. Since you
remain on the same page, you cannot use the browsers "back" button to get
back to a previous state. I actually use the innerHTML method alot to control
the UI. For instance, after an employee is selected from the Employee list,
I'd use Remote Scripting to fetch the employee record (the COM object could
return a fully formatted HTML table containing the employee data, for instance),
which I would then insert that HTML code into a div tag that sits empty at
the bottom of the original page until this call is made.

You can easily write a jscript function to reset the screen (it would just
overwrite the innerHTML property of each div tag to some initial value, like
empty "").

It's an entirely different approach, but something to ponder.
I hope this sparked some ideas for you.

Gary

"Pat Patullo" <ppatullo@800gosuper.com> wrote:
>
>Have two list boxes "Department" and "Employees" on the main page. When
selecting
>a particular department, the employees list box gets updated accordingly.
>After submitting the form and the information of the employee is displayed
>on the resulting page, I click on the <BACK> button and find that the values
>in the employee box gets reset.
>
>I used the sample code from Boris Feldman "Fill a Select List with Javascript"
>found at "http://www.inquiry.com/techtips/js_pro/10min/10min1298/10min1298.asp"
>
>Can someone please show me how to code this properly so that the list boxes
>and selections don't get reset when returning back to the main page ?