TextSide Util Class


TextSide provides a built in static Javascript class called Util. This static class provides some handy utility methods and function calls. These range from functions to Hide and Show div elements, to invoking an Ajax Handler in your PHP Code. The Util class can be found in site\webroot\js\core.js.

AJAX Methods


AjaxRequest(AjaxHandler, data, OnSuccess, OnFailure=null)
Performs an AjaxRequest, directed to the named AjaxHandler in the current CodeBehind Page. On completion of the Ajax call, the returned results will be passed to the function specified in OnSuccess. If the call fails, OnFailure will be called. For more details on using this method, including examples, please see CodeBehind AJAX Handlers.

AjaxHandler - The name of the AjaxHandler in your CodeBehind page to execute. Example: "MyHandler"
data - Data to pass to the AjaxHandler in the form of a string. For example, "name=zedd&email=asdf".
OnSuccess - A method that will be called when the Ajax request completes. This will contain the response from the Ajax Handler (see CodeBehind Ajax Handler documentation for an example)
OnFailure - (Optional) A method taht will be called if the Ajax request fails.

AjaxPartRequest(AjaxHandler, partid, data, OnSuccess, OnFailure=null)
Performs an AjaxRequest, directed to the AjaxHandler in the named Part. This is the name as AjaxRequest, except that it is directed to AjaxHandlers contained within Parts instead of within CodeBehind pages. For example example, please see Part AJAX Handlers.

AjaxHandler - The name of the AjaxHandler in your CodeBehind page to execute. Example: "MyHandler"
partid - The id of the part to direct the current request to. See Part Ajax Handler reference for information on obtaining this value
data - Data to pass to the AjaxHandler in the form of a string. For example, "name=zedd&email=asdf".
OnSuccess - A method that will be called when the Ajax request completes. This will contain the response from the Ajax Handler (see Part Ajax Handler documentation for an example)
OnFailure - (Optional) A method taht will be called if the Ajax request fails.


Form Methods


Focus(id)
Gives focus to the element with the given id. This can be used for force user focus for the keyboard to a form element.

id - The id of the html element to switch focus to.

SetAutoFocus(id)
Sets auto focus to the given input box / html element on page load. Use this to cause the users cursor input to jump to a given point automatically on page load. For example, if you had a search box on the page you could jump to that box when the page loads so the user can enter a term immediately.

id - The id of the html element to set focus on after page load

Submit(formName, destination)
Performs the same operation as SubmitForm

SubmitForm(formName, destination = "")
Submits the given form element. Accepts an optional second parameter that allows you to specify the destination url that the form should be submitted to.

formName - The name of the form to submit
destination - (Optional) A url where the form should be submitted to. If no destination is specified, the form is submitted to the url specified by its action tag.

SubmitIfEnter(formName, event)
Submits the given form if the passed event is the enter key. Allows forms to be submitted when the user presses enter over a form element, rather than having to submit the form by clicking a submit button.
Note: Do not use for forms with only a single input box. In this case (only) the browser will automatically bind the enter key for you. If you use this code, it will result in your form being submitted twice.

formName - The name of the form you wish to submit (ie, the forms 'name' attribute)
event - The keyboard key press event to examine.

Example:


<form enctype="multipart/form-data" action="<?=$PHP_SELF?>" method="POST" name="myform">
<input type="text" name="name" onkeypress="Util.SubmitIfEnter('myform',event)">
<input type="text" name="email" onkeypress="Util.SubmitIfEnter('myform',event)">
</form>


SubmitIfEnter(formName, event, destination)
The same as SubmitIfEnter with an optional 3rd parameter of destination. This is a url of a destination that the form should be submitted to if there was an enter event.

IsEnterEvent(event)
Returns true if the given keyboard event represents the user pressing the enter key.

event - The keyboard event to examine

InsertIntoTextBox(textBoxId, text)
Inserts the given text into the contents of the given textbox. The text will be appended at the current selection cursor. If the textbox was not selected, text will be appended to the end of it

textBoxId - The id of the textbox to append text to
text - The text to append to the text box.


Misc. Utility Methods


AddOnLoad(function)
Adds a function to be loaded on page load. Use this to cause your own script to execute automatically after the page has fully finished loaded. This function allows multiple functions to be appended. For example, you can call this function multiple times. Each passed function will be executed on page load, in the order that they were added.

function - A reference to the function to execute on page load

AddSlashes(string)
Adds slashes to the given string, escaping single and double quotes.

string - The string to escape

ConvertPxToInt(string)
Converts a pixel string, for example "50px" to an int equivalent "50". This is useful for parsing out the size of elements when fetched via element.width.

string - The pixel string to parse. For example "50px"

ConvertToInt(string)
Converts the given string to an int. For example "50" is converted to 50.

string - The string to convert

StripSlashes(string)
Reverses AddSlashes, unescaping single and double quotes.

string - The string to un-escape


Visibility Methods


Show(id)
Causes the element with the given ID to be made visible.

id - The id of the html element to show.


<div id="sample" style="display:none">My Hidden Text</div>

<script type='javascript'>
Util.Show('sample');
</script>


Hide(id)
Causes the element with the given ID to become hidden.

id - The id of the html element to show.


<div id="sample" style="display:block">My Hidden Text</div>

<script type='javascript'>
Util.Hide('sample');
</script>


Toggle(id)
Toggles the element with the given ID to switch between being hidden or visible. If it is called when the element is visible, the element is made hidden and vice versa.

id - The id of the html element to toggle visibility of.

Toggle(id, focusAfterId)
Toggles the element with the given ID to switch between being hidden or visible. If it is called when the element is visible, the element is made hidden and vice versa. After the element has been toggled, the element with id 'focusAfterId' will be given focus. This can be used to show an element and shift focus to form element contained within.

id - The id of the html element to toggle visibility of.
focusAfterId - The id of an html element (usually a form element) to switch focus to after the first element has been toggled.

SlideToggle(id, duration, focusAfter)
Toggles the element with the given ID to switch between being hidden or visible using a sliding animation. If it is called when the element is visible, the element is made hidden and vice versa. After the element has been toggled, the element with id 'focusAfterId' will be given focus. This can be used to show an element and shift focus to form element contained within.

id - The id of the html element to toggle visibility of.
duration - How long (in seconds) the animation should take. For example .5 = half a second.
focusAfterId - The id of an html element (usually a form element) to switch focus to after the first element has been toggled.

Flash(id, time = 1000, fadein = false)
Flashes visibility of the element with the given id. The element will be made visible, remain visible for the given time, then disappear.

id - The id of the html element to make visible temporarily.
time - (Optional) How long the element should be visible. In Milliseconds. Defaults to 1 second. Example: 1000 = 1 second
fadein - (Optional) Boolean flag that determines if the element should be faded in / out. Defaults to false.

Fade(id, time=1)
Fades the element with the given id until it is invisible.

id - The id of the element to fade out
time - (Optional) How long (in seconds) that the fade should take. Defaults to 1 second.