Magic JavaScript Variables

Suppose you want to create a variable in JavaScript whose value can be easily managed using MagicEdit. It turns out to be very easy by simply using the cl_variables method.

Here's an example. Suppose we have a page title that is edited via MagicEdit:

  <h1><magicedit me_name="pageTitle" me_plain>Default Title</magicedit></h1>

In my script, I want to also have a pageTitle variable that I can do some fancy stuff with. To define a variable with a value that is stored in the MagicEdit database, use the following script declaration in your page (usually the head of your page):

  <script type="text/javascript" cl_variables="pageTitle=$pageTitle"></script>

If the page title has been edited (and its value is available in the database), the resultant code as written to the page will be:

  <script type="text/javascript">
     var pageTitle = "Title as Edited for the Page";
  </script>

You can now use this variable in other scripts on the page.

A Couple of Notes

• Don't use src when you use cl_variables. Use a separate script declaration.
• This only works with values that have been edited. Placeholder text will not be written in as variables since it is not available in the database.
• If you are in a repeated region or page and need to access a non-repeated MagicEdit element, use $$me_name instead of $me_name to bind to the non-repeated element. This is similar to setting me_repeat="no".