www.webdeveloper.com
Results 1 to 4 of 4

Thread: clear form

Hybrid View

  1. #1
    Join Date
    Apr 2005
    Posts
    8

    clear form

    Hey,

    I have the simple test form below. When I enter something into Sale Order field, hit the submit button. Once the submitted button is clicked, I click on Reset Form button to clear out all fields. However the code below did not working, but if I removed the <fieldset> form the form below then it clear out the value from the form. Can anyone please help?

    Thanks

    <script type="text/javascript">
    function clearForm(oForm) {

    var elements = oForm.elements;

    oForm.reset();

    for(i=0; i<elements.length; i++) {

    field_type = elements[i].type.toLowerCase();

    switch(field_type) {

    case "text":
    case "password":
    case "textarea":
    case "hidden":

    elements[i].value = "";
    break;

    case "radio":
    case "checkbox":
    if (elements[i].checked) {
    elements[i].checked = false;
    }
    break;

    case "select-one":
    case "select-multi":
    elements[i].selectedIndex = -1;
    break;

    default:
    break;
    }
    }
    }

    </script>

    //FORM STARTS
    <cfform action="##" method="post">
    <fieldset>
    <legend>Ital Search Form</legend>
    <ol>
    <li>
    <label for="so">Sales Order Number</label>
    <cfinput id="so" type="text" name="so" value="#form.so#" size="20" />
    </li>
    </ol>
    </fieldset>
    <cfinput type="submit" name="submit" class="button" value="Search"/>
    <cfinput type="button" name="reset_form" value="Reset Form" onclick="clearForm(this.form);">
    </cfform>

  2. #2
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    1,843
    using break in default will cause the for() to break. instead of the expected break on the switch().
    Code:
    function clearForm(oForm){
    	var elements = oForm.elements;
    	oForm.reset();
    
    	for(var i = 0, size = elements.length; i < size; ++i){
    		var field_type = elements[i].type.toLowerCase();
    
    		switch(field_type){
    			case "text":
    			case "password":
    			case "textarea":
    			case "hidden":
    				elements[i].value = '';
    				break;
    			case "radio":
    			case "checkbox":
    				if(elements[i].checked){
    					elements[i].checked = false;
    				}
    				break;
    			case "select-one":
    			case "select-multi":
    				elements[i].selectedIndex = -1;
    				break;
    			//default: // don't need default if it has nothing to run... 
    			//break; // don't use break after default
    		}
    	}
    }

  3. #3
    Join Date
    Apr 2005
    Posts
    8
    Did not working of what i try to achieve. Does anyone have any ideas?

  4. #4
    Join Date
    Mar 2005
    Location
    Behind you...
    Posts
    969
    It looks like you are using a <cfform> and <cfinput> tag, which isn't valid. A quick google search tells me it's something from ColdFusion, which I'm sure it's fine there but as far as any standard HTML/javascript goes they won't be valid and thus the script won't work.

    To be fair though, I've never worked with ColdFusion so if that's what you are building this page in you can always verify by opening the page, pressing F12 and opening the 'Console' tab. When you click the 'Reset Form' button you will see any errors that occur when you script runs.

    If I copy and paste your code and then make the changes with the two tags I mentioned earlier (changing them to their standard HTML tag) I get no errors and the script works. Hence why I think it's just an issue with invalid tags.
    "Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles