-
Notifications
You must be signed in to change notification settings - Fork 8
Functions
Assuming you have already setup the plugin, here are some examples to get you up and running on its functions
The following functions, should be used inside your [action].js.cfm files. Please keep in mind that these are wrapper functions to the javascript library in use, you are free to use both ColdFusion and JavaScript inside this view, as long as the final output is pure javascript.
Inserts HTML content at the specified position and HTML element. If we want to add the content of a partial above a DOM element with the class “comments”, out code will look like this:
pageInsertHTML(selector=".comments", position="before", partial="comment")
Replace the HTML content of the specified element. Let’s say we want to modify data at the comment #23 (assuming the comment has a CSS class name of comment23), our code should look like:
pageReplaceHTML(selector=".comment23", partial="comment")
Removes the specified element. If you wish to remove a notification message with an ID of error-message, just use this line of code:
pageRemove(selector="##error-message")
Shows the specified element. Used to display a DOM element that has been previously hidden by CSS or the pageHide function.
pageShow(selector=".important-notice")
Hides the specified element. Similar to pageRemove you can use this function to temporality hide content for the view. You can use this function with pageShow to toggle the visibility of a DOM element.
pageHide(selector=".important-notice")
Redirects the user to the desired location according to the URLFor rules. Let’s say we have an authenticate action, and after a successful validation we want the user to be redirected to their dashboard, our authenticate.js.cfm file will look like this:
pageRedirectTo(controller="users", action="dashboard")
Note: the previous code may look a bit strange, since Wheels already has a redirectTo function, but due to the AJAX nature of your request, Wheels can’t redirect the current user away from its current position, you will need to use this method instead.
Uses javascript to inject a specific flash key or all flash keys into the DOM for display on a page. If you don’t specify a key, then all keys contained in the flash will be output as paragraph tags with a class the same name as the key. This function returns the javascript necessary to add flash keys to the DOM.
The `reset` argument is a boolean for clearing all flash messages from the page when this function is called. If this is set to true all flash messages currently displayed will be removed.
pageInsertFlash("success")
Uses javascript to create a visual effect at the specified selector (using the jQuery’s UI library)
The `name` argument takes the following values: ‘blind’, ‘bounce’, ‘clip’, ‘drop’, ‘explode’, ‘fold’, ‘highlight’, ‘puff’, ‘pulsate’, ‘scale’, ‘shake’, ‘size’, ‘slide’, ‘transfer’. The `duration` represents one of the three predefined speeds (‘slow’, ‘normal’, or ‘fast’) or the number of milliseconds to run the animation (e.g. 1000).
pageVisualEffect(selector='.comments', name='highlight', duration='slow')