Javascript utils

↑ Parent: Utils

← Previous: Templates utils

All the following functions are available in all pages. You can call them from any javascript file, as long as it's included after the inclusion of all the main Javascript files.

Name	Description	Parameters	Return value
disableButton	Make any button not clickable. Can be useful to avoid allowing someone to click a button again after it's been clicked. See also ⎡Make a form only submittable once⎦.	button	None
gettext	Get the translation of a term. In python, you need to provide this translation in JAVASCRIPT_TRANSLATED_TERMS MagiCircles settings.	term	translated string
freeModal	Show a bootstrap modal. Use true for modal_size to not change the size Use 0 for buttons to remove all buttons modal_size can be md, lg or sm	title, body, buttons=(Go button that closes the modal), modal_size='lg'	None
formShowMore	If your form is long, you decide to hide some fields and show a button to show more, which will show all the fields on click.	form, cutOff (field name, without id_), includingCutOff (bool, optional, default = false), until (optional, field name of last, default = all the remaining fields), includingUntil (bool, optional, default = false)	None
formSeparator	Adds a vertical line to make a visual separation in a single form.	form, cutOff (field name, without id_), includingCutOff (optional, default = false), title (optional string title to show on the separator)	None
confirmModal	Show a modal to confirm a critical action. It takes a callback that you can use to perform the action.	onConfirmed, onCanceled=undefined, title=gettext('Confirm'), body=gettext('You can't cancel this action afterwards.')	None
genericAjaxError	You may use this function to handle errors in your ajax calls. It will simply display the error in an alert	xhr, ajaxOptions, thrownError	None
directAddCollectible	To be used with buttons to add an item to your collection. Instead of loading the form to add in a modal, will attempt to load it in the background and submit it, then update the counter of total collected items. uniquePerOwner can also be set in data-unique-per-owner.	buttons, uniquePerOwner (optional, default=False)	None
modalCuteFormSeparators	Separates CuteForm modals choices into sections. Can be useful for merged fields (See "Merge fields" in MagiFiltersForm)	object with required keys: by (choice of 'by_name_prefix_nth', 'by_name_prefix_value', 'by_name', 'by_value_prefixes'), and optional keys: hr (bool), margin (bool), callback_before	None

Commons

A bunch of "common" functions are called together when:

• on load of any page
• when a view is loaded in a modal
• when a new pagination page is loaded

You may call loadCommons again if needed, for example if you load new HTMl within the page. You may also call these functions individually.

Functions called (in this order):

Name	Description
loadToolTips	Load Bootstrap tooltips. Learn more.
loadPopovers	Load Bootstrap popovers. Learn more
formloaders	See ⎡Make a form only submittable once⎦.
dateInputSupport	Check if the current browser has support for HTML5 date input and if not (= just a text input), will show a help text with the date format.
hideStaffButtons	See ⎡Hide staff-only buttons⎦.
ajaxModals	See ⎡Load an Ajax page in a modal⎦.
loadCountdowns	See ⎡Countdowns⎦
loadTimezones	See ⎡Timezones⎦
loadMarkdown	See ⎡Markdown⎦
reloadDisqus	Will force reload Disqus script that displays the total number of comments in the link to the comment section of a page.
directAddCollectible($('[data-quick-add-to-collection="true"]'))	Will load Javascript utility to quickly add collectibles to your collection.

You can add your own code to the code that runs when loadCommons is called. See JAVASCRIPT_COMMONS in Website settings.

Pass Python variables to Javascript

• For Views, you can override extra_context and add variables to js_variables.
• For Single pages, see js_variables in base templates.

In both cases, you'll need to first check that js_variables exists, add it to the context if it doesn't , then insert your variables after calling the jsv function in ⎡Python Utils⎦ to ensure it's correctly formatted.

from magi.utils import jsv

...
if 'js_variables' not in context:
    context['js_variables'] = {}
context['js_variables']['new_variable'] = jsv(new_variable)

↓ Content

• HTML elements with automatic Javascript behavior

→ Next: More