Button which clear a form form field

[jacob.parker]

Hi Gents, 

ISE: 2.3.0.298; Patch 5 

we use a self registered guest portal. 

Now - i need on the "registration form" an additional button which clear the 

form field "ui_person_visited" if needed. 

It should replace or fill in the text within the form field. 

For this goal i use the following script:

---

<script>

jQuery('.cisco-ise-form-buttons').append("<div class='ui-submit ui-btn ui-shadow'><input type='submit' value='Registration for a half year' class='hotspot-btn'/></div>");

jQuery('.hotspot-btn').on('click', function(evt){

evt.preventDefault();

jQuery('#guestUser\\.fieldValues\\.ui_person_visited').val("");
jQuery('#guestUser\\.fieldValues\\.ui_person_visited').attr("placeholder","");
jQuery("input[name='guestUser.fieldValues.ui_person_visited']").attr("value","servicxxxx@xxxxxx.xxx")

});
</script>

---

This script works, if the text field of the ui_person_visited is empty after the page load. 

But if something is filled in like an eMail address (firstname@domain.com) nothing happens. 

Have any person an idea what is going wrong with the script? 

For an early answer i will be thankfully. 

Kind regards

Jacob

[hslai · Accepted solution]

I am no expert on this but it does not look like you are clearing the form.

Using JavaScript to reset or clear a form might do it. For example, I copied the function and then am calling it within the function(evt).

<script>
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;
	}
    }
}

jQuery('.cisco-ise-form-buttons').append("<div class='ui-submit ui-btn ui-shadow'><input type='submit' value='Clear Form' class='hotspot-btn'/></div>");

jQuery('.hotspot-btn').on('click', function(evt){

clearForm(this.form);
evt.preventDefault();

jQuery('#guestUser\\.fieldValues\\.ui_person_visited').val("");
jQuery('#guestUser\\.fieldValues\\.ui_person_visited').attr("placeholder","");
jQuery("input[name='guestUser.fieldValues.ui_person_visited']").attr("value","servicxxxx@xxxxxx.xxx")

});
</script>

[Jason Kunst]

let us know if it works, otherwise will have others look at it

[jacob.parker]

Hello hslai,

i try the script and it works perfect.

Very good job. 

Thank you very much. 

Kind regards

Jacob

[Jason Kunst]

can you reply with screenshot of what you have, trying to clean and post here: https://community.cisco.com/t5/security-documents/ise-portals-general-customization-options-global/ta-p/3742904#toc-hId-1883691839

[Jason Kunst · Accepted solution]

Please find the consolidated script which remove the text entered in the form fields. Please check this and confirm whether it works expected.

<script>

function clearForm(oForm) {  

  var elements = oForm.elements;

  oForm.reset();

}



jQuery('.cisco-ise-form-buttons').append("<div class='ui-submit ui-btn ui-shadow'><input type='submit' value='Clear Form' class='hotspot-btn'/></div>");



jQuery('.hotspot-btn').on('click', function(evt){



clearForm(this.form);

evt.preventDefault();

jQuery("#guestUser\\.fieldValues\\.ui_person_visited").attr("value","servicxxxx@xxxxxx.xxx");



});

</script>

[jacob.parker · Accepted solution]

it works also fine.....

Perfect!!!

Many thanks to hslai and Jason

Kind regards

Jacob