edit-on Pro Technical FAQ

OverviewFAQs

Licensing

Technical

1.12 How can I return the focus to a form field after edit-on Pro requested it?

The focus is automatically passed to the applet after it has finished loading. This is a general behavior of all applets, as the loading is handled by the Java Runtime Environment which passes the focus from your web page to the applet. Consequently, it is not possible from the applet's side to return the focus back to the previously edited form field as it's not possible to execute any applet method before it has finished loading.

Using the following JavaScript work-around it is possible to set the focus back into the form field which was edited before initializing edit-on Pro but it won't be possible to continue typing during the editor's loading process:

1. Define a global JavaScript variable "editedField"

// global variable editedField

var editedField;

</script>

2. Use edit-on Pro's JavaScript API method "setOnDataLoaded"

The function referenced within this API method will be called right after inserting content into the editor using e.g. setHTMLData or setHTMLDataFromURL
The referenced function will set the focus back to the previously edited form field

// applet configuration

eop = new editOnPro(898, 400, "eop4_inst1", "myId", "eop");

.....

// the method "setOnDataLoaded" calls the JS function setFocusOnField()

eop.setOnEditorLoaded("loadContent");

eop.setOnDataLoaded("setFocusOnField");

.....

eop.loadEditor();

</script>

3. Set up a JavaScript function saveFieldName(field)

This function should store the name of the previously edited form field (currentFormField) within the global variable editiedField

function saveFieldName(currentFormField)

{

editedField=currentFormField;

}

</script>

4. Set up another JavaScript function "setFocusOnField"

This function should return the focus to the form field stored in the variable "editedField"

function setFocusOnField(editedField)

{

document.forms["yourform"].elements[editedField].focus();

}

</script>

5. Define the "onblur" attribute for the HTML form fields contained in your website.

Setting this attribute will call the JavaScript function "saveFieldName(field)" after the focus has been requested by edit-on Pro. Example:

<html>

.....

.....

</html>

back to overview