Subject: RE: refreshing a document on a browser
Where are you storing your choices? Can you post the method here where you’re doing this? In order to do this with AJAX (using xml or JSON) there has to be a relationship there someplace that we can use to say “values x, y, and z should be in box 2 when box 1 contains a”. How we do this will depend on where your choices are coming from in the first place.
This example uses only the prototype library, and as such, other frameworks may provide a slightly easier way of doing this. Download the prototype library and then import it into the database as a javascript library. In the js header on the form, insert a resource pointer to this library.
The code below is entered directly onto the form and marked as html. It should go above your fields. As you can see, my first field is departments, and the dependant field is depnumber. I have created two documents to store this data. The first one contains all of the store numbers, and the second all of the department numbers. In my environment, whenever the form containing the fields is opened, I have an onLoad event that triggers and updates the two storage documents from their respective databases. This is simply to ensure that I am working with the most up to date information and any method you like can be used to do this, if it is even needed. The key here, is the formatting of the view to create the xml. I have a view with an alias of stores.xml with two columns:
Col 1
“<department name="” + kDiv + “">” where kDiv is the department name field (the FIRST FIELD)
Col 2
@Implode(“” + kStore + “”) where kStore is the field that contains all of the stores (the SECOND, DEPENDANT FIELD)
Col 3
“</department”> used to close off the tag at the end of each row in the view.
This provides me with xml output like so for each document row:
1
2
1
2
3
4
This view is embedded in a ViewTemplate for stores.xml form (standard view template name)
Above the view is
<?xml version="1.0" encoding="UTF-8"?>
which handles namespacing the xml and below the view is the closing tag of
The embedded view property selected is Display using xml, of course, and for good measure, in the VIEW properties (5th tab), choose treat view contents as html.
<script>
function populate()
{
var url = 'http://domino2.steinmart.com/TestAjaxKeywordList.nsf/stores.xml?openview';
var myAjax = new Ajax.Request(
url,
{
method: 'get',
onComplete: showResponse
});
}
function showResponse(originalRequest)
{
//$('result').value = originalRequest.responseText;
//window.alert(originalRequest.responseText);
var empID = document.forms[0].departments.options[document.forms[0].departments.selectedIndex].text
//window.alert(empID);
var xmlDoc = originalRequest.responseXML.documentElement;//not being seen by firefox
//window.alert(xmlDoc);
var entriesNode = xmlDoc.selectSingleNode("//department[@name='" + empID + "']");
var entries = entriesNode.selectNodes("model");
//window.alert(entries);
//Remove current options!!
document.forms[0].depnumber.length = 0;
//window.alert(document.forms[0].depnumber.length);
//Add new options container!!
leng = entries.length;
window.alert(leng);
document.forms[0].depnumber.length = leng;
window.alert(document.forms[0].depnumber.length);
//Loop through the "child" nodes and add all the new values...
for (var i=0; i < entries.length; i++){
document.forms[0].depnumber[i].text = entries[i].text;
document.forms[0].depnumber[i].selected=false;
}
document.forms[0].depnumber[0].selected=true;
}
regular notes fields go here on the form. The onChange event should call the populate() function.
Even though I used a view, any method of creating valid xml can be used. I have other applications which change the selected value of a combobox using an agent (just use that url in the xml line instead of the view url) which looks up a Vendor Name based on a Vendor Number entered, OR, looks up the vendor numbers for a vendor name entered. One of the powers of AJAX is that you can return data however you need it from your agent or view… it’s all xml, just format it as you need, then grab the text with your javascript (the showResponse function handles this in the example given).
