Clear specific form fields using JQuery

Tue Jan 08, 2013 1:14 am

Clear HTML form input fields using JQuery but each one alone.
javascript code

<html>
<head>
<title>Clear specific form fields using JQuery</title>

<!--
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
 Note you can download the JQuery package instead of using Google version. --> 
<script src="jquery-1.8.3.js"></script>
<style type="text/css">
body
{
background:#F6751E;
font-size:22px;
}
 
</style>
 
<script>
  
  function clear_form_elements(HTMLid) {
     // find based on html element type.
	 
	 var inputElement =$(HTMLid);
	  if(inputElement.is(":input"))
	     {
		   if(inputElement.attr('type')!='checkbox'&&inputElement.attr('type')!='radio')
			{
		      inputElement.val('');
		    }
			else{ 
			  inputElement.attr('checked', false);
			}
		 }
}

  
</script>
</script>
</head>
<body>
 

<b>Reset Each Element freely :</b><br/>
 
 <form action="#" method="GET">
 
<b> Full Name:</b><input type="text" name="FullName" id="FullNameID" />
<input onclick="javascript:clear_form_elements('#FullNameID')" type="button" value="Clear" />
<br/>
<b> Bio: </b> <textarea rows="6" cols="14" id="BioID" ></textarea>
<input onclick="clear_form_elements('#BioID')" type="button" value="Clear" />
<br/>

<b> CV: </b><textarea rows="6" cols="14" id="CV" ></textarea>
<input onclick="clear_form_elements('#CV')" type="button" value="Clear" /><br/>
<b> Do you agree on policy </b>
<input type="checkbox" name="checkbox" id="checkboxID" />
<input onclick="javascript:clear_form_elements('#checkboxID')" type="button" value="Clear" />
 
</form>
 
 
</body>
</html>