Contrexx Javascript Framework UI

Home

cx.ui.dialog(options)

Display a dialog (based on jQuery UI Dialog). Options:

• title a title string. optional.
• content a div-element or pure html code.
• modal boolean (defaults to true)
• autoOpen whether the dialog should open on creation. boolean (defaults to true)

Example:

//display a simple message
cx.ui.dialog({
    title: 'test',
    content: '<p>just a message.</p>',
});

//create the dialog and save a reference
var d = cx.ui.dialog({
    title: 'test',
    content: '$(#messageDiv)',
    autoOpen: false
});

d.open();

Events

dialog.bind('close', myFunction) will add a listener for the dialogs close-event.

All jquery ui dialog events as specified in the documentation can be bound. #Resources The default skin is located at lib/javascript/jquery/ui/css/jquery-ui.css.

The default images are in lib/javascript/jquery/ui/images

cx.ui.confirm(text, type)

Creates a confirm dialog (like ECMA confirm() but using cx.ui.dialog())

cx.ui.messages

This provides an interface to handle user messages on client-side, similar to \Message class on server-side. It provides the following methods:

cx.ui.messages.add(msg, type);

Shows a message for 10s.

msg is the messages as a string

type is one of error, warning, info, success

cx.ui.messages.showLoad();

Shows a "loading" message until another message is added or removeAll() is called.

cx.ui.messages.removeAll();

Removes all currently shown messages (is called by the other two methods before adding their message)

cx.ui.forms

This provides tools for handling forms generated by View Autogeneration.

cx.ui.forms.get((<id>));

This method returns an array of all auto-generated forms present on this page.

id ID is an optional integer identifying the form to get the element of.

cx.ui.forms.validate(<form>(, <skipMessage>));

Validates the given form, shows error messages if validation fails and returns if the validation was successful or not.

form is the jQuery element of a form. Can be fetched using cx.ui.forms.get(<id>).

skipMessage is optional. If set to true, no error messages are shown.

If a cx-ui form is fetched using AJAX by using another method than cx.ajax() call cx.ui.forms.fix() to avoid duplicate IDs as soon as the DOM is loaded.

cx.ui.intro

Create intros for components or features in Cloudrexx. See dedicated article Intros.

jQuery UI I18n

The framework provides automatical I18n according to the frontend language id set.

example: displaying a localized datePicker

cx.ready(function() {
    cx.jQuery('input[name=newsDate]').datetimepicker();
});