How to pass form name dynamically in to a javascript method?

Question

Hi all,

I am trying to pass form name dynamically. But this script is showing an error.

"document.formName is undefined". How to solve this. Thanks in advance.

<script language="javascript">

function showAll(form,fieldName) {
    var formName = form.name;
    alert(formName);
    document.formName.search_mode.value = "";   
    document.formName.fieldName.value="";
    document.formName.submit(); 
}
</script>
<form name = "dealsManagement" method="post" action="<?=$_SERVER['PHP_SELF']?>">
<input type="hidden" name="search_mode" value="<?php echo $_REQUEST['search_mode'];?>" >
<table border="0" cellpadding="0" cellspacing="0" align="center" width="400" style="padding:2px; border:#ccc solid 1px; margin:15px auto 15px auto;">
<tr>
<td colspan="2" class="text3" align="center" height="35" bgcolor="#cccccc">Search</td>
</tr>
<tr>
<td width="153" height="35" align="right" class="text2" style="padding-right:10px;">Search By  City:</td>
<td width="245"><input type="text" name="city" value= "<?php echo $_POST['city']; ?>" size="24" ></input></td>
</tr>
<tr>
<td height="30">&nbsp;</td>
<td><input name="button" type="button" class="btn" onClick="javascript:dealSearchCity()" value="Search" />
<input name="btnShowAll" type="button" class="btn"value="Show All" onClick="javascript:showAll(this.form,'city');" /></td>
</tr>
</table>
</form>

Answer 1

What you are doing is not necessary. You can use form directly:

function showAll(form,fieldName) {
    var formName = form.name;
    alert(formName);
    form.elements.search_mode.value = ""; 
    form.elements[fieldName].value="";     
    form.submit(); 
}

two sidenotes:

The language attribute is deprecated, better use

<script type="text/javascript">

and you don't need to prefix event handlers with javascript:.

Answer 2

If you want to use a string rather than a literal property name, you have to use square bracket notation.