Places

 

  • Download
  • Documentation
  • Forums
  • Demo
  • Contact
  • Blog
  • My account

Meteora

Javascript Widgets

Controls

  • Autocomplete
  • Bubble
  • Calendar
  • Carousel
  • Datagrid
  • Dialog
  • Editor
  • Filebrowser
  • Form Control
  • Menu
  • Notebook
  • Picbox
  • Popup
  • Searchlist
  • Selection
  • Spinbutton
  • Tablesort
  • Toolbox
  • Treeview

Features

  • JsonRpc Core

Effects

  • Visual effects

Core.JsonRpc

Before proceeding you may want to read our getting started page.

What does this control do?

This is not really a control, but a macro evaluator that allows cross-communication between a server-side script and the user's browser. It is basically a set of rules that define actions you want to execute in the HTML document without writing javascript.

For an usage example check out the Core.JsonRpc demo.

Lets suppose you use Control.Form to send data from a form to /my/action.script, then the script just answers with:

{
  'successMessage': 'Your form was saved.',
  'redirectTo':     '/my/new/location'
}
A blue box will appear at the top of the screen containing the value of successMessage and then the browser will be redirected to /my/new/location. It's plain, simple an useful.

We recommend you to check out the Core.JsonRpc demo to understand this concept.

How to use it

In order to be able to use this control, paste this line of javascript right at the beginning of your script tag:

Meteora.uses('Core.Jsonrpc');

Some examples

This is a JSON-RPC example response instructing the browser to take to user to another URL:
{
  'redirectTo': 'http://astrata.com.mx/test/form'
}
And the response belows tells the user that an error has ocurred:
{
  'errorMessage': 'Please fill the e-mail field with a valid e-mail address'
}
This is a more advanced example where after showing an error we show a message next to a email input:
{
  'errorMessage': 'Some errors ocurred during processing your form.',
  'inputError': {
    'name':     'email_field',
    'message':  'Another user has already registered this e-mail address.'
  }
}
This is a response containing custom javascript code (this function is provided to be used when doing specific thing not covered with the existent methods):
{
  successMessage: 'Your new user has been added, please login.',
  execute: [
    'var nb = document.loginNotebook; nb.selectPage(\'index\')',
    '$(\'login_field\').focus()'
  ]
}

Methods

execute(string or array of strings)

The browser will evaluate the given response as javascript code. If an array is given every element will be executed.
{
  execute: 'alert(\'hello!\')'
}
{
  execute: [
    'alert(\'Paint it black!\')',
    'document.body.style.backgroundColor = \'black\';'
  ]
}

successMessage(string)

Displays a blue box at top of the screen containing the given message.
{
  successMessage: 'Welcome, now you\'re logged in.'
}

errorMessage(string)

Displays a red box at top of the screen containing the given message.
{
  errorMessage: 'An error has ocurred'
}

deleteObject(object_id)

Will remove the element with the given object_id from the current DOM tree.
{
  deleteObject: 'my_object_id'
}

updateObject(options_tuple)

{
  updateObject: {
    objectId: 'comments_placeholder',
    dataSource: '/comments/ajax_view'
  }
}
{
  updateObject: {
    objectId: 'comments_placeholder',
    data: 'Those are all my comments'
  }
}

hideObject(object_id)

{
  hideObject: 'comments_form_container_id'
}

showObject(object_id)

{
  showObject: 'my_iconbar_id'
}

redirectTo(url)

{
  redirectTo: '/my/after_login/page'
}

injectBefore(options_tuple)

{
  injectBefore: {
    objectId: 'comment_33',
    dataSource: '/comments/view/32',
    onComplete: function() {
      alert('Ajax request completed.');
    }
  }
}
{
  injectBefore: {
  objectId: 'comment_33',
    data: 'Comment 32 text'
  }
}
injectAfter(options_tuple)</h4>
{
  injectAfter: {
    objectId: 'comment_33',
    dataSource: '/comments/view/34',
    onComplete: function() {
      alert('Ajax request completed.');
    }
  }
}
{
  injectAfter: {
    objectId: 'comment_33',
    data: 'Comment 34 text'
  }
}

appendTo(options_tuple)

{
  appendTo: {
    objectId: 'comments_placeholder',
    dataSource: '/comments/ajax_view_new'
  }
}
{
  appendTo: {
    objectId: 'comments_placeholder',
    data: 'This is a <b>new</b> comment'
  }
}

prependTo(options_tuple)

{
  prependTo: {
    objectId: 'comments_placeholder',
    dataSource: '/comments/ajax_view_new'
  }
}
{
  prependTo: {
    objectId: 'comments_placeholder',
    data: 'This is a <b>new</b> comment'
  }
}

reload()

Reloads the current page.
{
  'reload': 1
}

Powered by textmotion

(c) 2008 Astrata Software