[RESOLVED] Cancelling default form action & clearing text fields

[Dan0]

I have a form with 3 text fields. When the form is submitted a js function is called. This function retrieves the field values, stores them, and sends them to a php page. Right before sending the values to the php page, the form is hidden. The default action of the form is canceled. A callback function later re-displays the form and clears the text field values, via setting the value properties to "".

Currently, the form submits and hides correctly, but when re-displayed text fields retain their values rather then being cleared. Below is my code, help resolving this problem is appreciated. Thanks.

ajax function(){...
var msgForm = document.getElementById("msgForm");
msgForm.style.display = "none";
...}

function sendMsgCallback(ajaxResponse){
	if (ajaxResponse.match(/sent/i)){
	alert("send successful!");
	var msgForm = document.getElementById("msgForm");
	var progressImg = document.getElementById("progressImg");
	progressImg.parentNode.removeChild(progressImg);
	msgForm.style.display = "block";
	msgForm.getElementById("msgRecipient").value = "";
	msgForm.getElementById("msgSubject").value = "";
	msgForm.getElementById("msgContent").value = "";
	} else {
		alert(ajaxResponse)
	}
} // end sendMsgCallback

[Fang]

function sendMsgCallback(ajaxResponse){
	if (ajaxResponse.match(/sent/i)){
	alert("send successful!");
	var msgForm = document.getElementById("msgForm");
	var progressImg = document.getElementById("progressImg");
	progressImg.parentNode.removeChild(progressImg);
	msgForm.style.display = "block";
	document.getElementById("msgRecipient").value = "";
	document.getElementById("msgSubject").value = "";
	document.getElementById("msgContent").value = "";
	} else {
		alert(ajaxResponse)
	}

[Dan0]

Thanks; I can't believe I missed that.