Multiple Forms in Domino Web Applications

UPDATE: A co-worker found some bugs in my standard javascript or “JSHeader” code that I had posted on this site. Most of the issues were related to how I was checking for “null” instead of checking to see if a variable was “undefined.” Also, the “getMyForm” function was not working if you sent a checkbox as the field. These issues have been fixed and the code has been posted below.

I’m having some fun in a legacy application at work. The Lotus Notes/Domino forms I am creating and maintaining are embedded into an ActiveX frame (like a portal).

Prior to this application, I think all of my development has been under the assumption that the Domino generated HTML form was the only form. Hence, document.forms[0] was my standard. Well, now that I’m working in this embedded application, that isn’t always true. I’ve had to rewrite some of my javascript to work with the current form.

The first thing I had to create was a function to get the current form.

function getMyForm(field) {
// returns form element
	if (typeof(field) == "string") {
		for (var i = 0; i < document.forms.length;i++) {
			if (document.forms[i][field] != null) {
				return document.forms[i];
			}
		}
	} else {
		if (field.length >= 0) {
			var element = field[0];
		} else {
			var element = field;
		}
		while (element != null) {

			element = element.parentElement;
			if (element.tagName == "FORM") {
				return element;
				break;
			}

		}
	}

}

I am still debating how to implement the next function. I wasn’t sure if I should pass the form into the function, expect that I already have it (bad design), or get it using the function above. I actually do a mixture of the last two options.

function getFieldValues(field) {
// Returns array of values. Depends on getMyForm.
	var value = new Array;
	if (typeof(form) == "undefined" || form == null || form.tagName != "FORM") {
		form = getMyForm(field);
	}
	if (typeof(field) == "object") {
		var theField = field;
	} else if (typeof(field) == "string") {
		var theField = form[field];
	} else {
		var theField = form[field.name];
	}

	if (theField == null) { // Exit quietly if field cannot be found.
		window.status = "Cannot get value for field:" + field.toString();
		return [''];

	}

	if (theField.length == null && theField.options == null) {
		if (theField.type == "checkbox" && theField.checked == false) {
			value =  [''];
		} else {
			value =  [theField.value];
		}
	} else if (theField.options != null) {
		for (var i = 0; i < theField.options.length;i++) {
			if (theField.options[i].selected == true) {
				if (theField.options[i].value === "") {
					value.push(theField.options[i].text);
				} else {
					value.push(theField.options[i].value);
				}
			}
		}
	} else if (theField.length >= 0) {
		for (var i = 0; i < theField.length;i++) {
			if (theField[i].checked == true) {
				value.push(theField[i].value);
			}
		}
	}
	if (value.length == 0) {
		value = [''];
	}
	return value;
}

I also have a function to set the value(s) of any field.

function setFieldValue(field,values) {
// Sets array of values. Depends on getMyForm.
	if (typeof(form) == "undefined" || form == null || form.tagName != "FORM") {
		form = getMyForm(field);
	}
	if (typeof(field) == "object") {
		var theField = field;
	} else if (typeof(field) == "string") {
		var theField = form[field];
	} else {
		var theField = form[field.name];
	}
	if (typeof(values) == "object") {
	} else {
		values = [values];
	}
	if (theField == null) { // Exit quietly if field cannot be found.
		window.status = "Cannot set value for field:" + field.toString();
		return;

	}
	if (theField.length == null && theField.options == null && theField.type != "checkbox") {
		theField.value = values[0];
	} else if (theField.options != null) {
		for (var x = 0; x < values.length;x++) {
			for (var i = 0; i < theField.options.length;i++) {
				if (theField.options[i].value == values[x] || (theField.options[i].value == "" &&
				 theField.options[i].text == values[x])) {
					theField.options[i].selected = true;
				}
			}
		}
	} else if (theField.length >= 0) {
		for (var x = 0; x < values.length;x++) {
			for (var i = 0; i < theField.length;i++) {
				if (theField[i].value == values[x] || (theField[i].value == "" &&
				 theField.options[i].text == values[x])) {
					theField[i].checked = true;
				}
			}
		}
	} else if (theField.type == "checkbox" && values[0] !== "") {
		theField.checked = true;
	}
}

Finally, a function to set the focus of a field (if it can find it).

function setFocus(field) {
	if (typeof(field) == "undefined" || field == null) {
		return;
	}
	var value = new Array;
	if (typeof(form) == "undefined" || form == null || form.tagName != "FORM") {
		form = getMyForm(field);
	}
	if (typeof(field) == "string") {
		var theField = form[field];
	} else {
		var theField = form[field.name];
	}
	if (theField == null || theField.name === "") {
		window.status =  "Unable to set focus for field " + field;
		return;
	}
	if (theField.length == null || theField.options != null) {
		theField.focus();
	} else if (theField.length >= 0) {
		theField[0].focus();
	}
}

This is nothing new for a lot of developers and frameworks like jQuery and Prototype handle a lot of this. But in many instances, you're stuck in legacy code that doesn't allow you to throw in frameworks (or you really don't want to have to explain what you're doing to the other developers).