Include jQuery

Phoenix provides jQuery as core JS environment, you can use PHP to auto add jQuery to HTML output.


The jQuery will auto included in <head>.

No Conflict

You can also add first argument as no-conflict mode:


Then you must use jQuery instead $ in global scope:

jQuery(document).ready(function ($) {

jQuery UI

Add jQuery UI to HTML, the jQuery core will auto included when you call this method:


Add UI components, every component will only include once:

\Phoenix\Script\JQueryScript::ui(['droppable', 'effect']);

Available components:

  • draggable
  • droppable
  • resizable
  • selectable
  • sortable
  • effect

Color Picker

A jQuery based color picker:

// Use default settings

// Custom settings
\Phoenix\Script\JQueryScript::colorPicker('.selector', ['control' => 'hue', 'position' => 'top']);

See Minicolors

Highlight Text

Highlight plugin is useful when you want to mark a text in search result:

// Find text in whole page
\Phoenix\Script\JQueryScript::highlight(null, 'Text');

// Find in an element
\Phoenix\Script\JQueryScript::highlight('.hasHighlight', 'Text');

// Set options
\Phoenix\Script\JQueryScript::highlight('.hasHighlight', 'Text', ['element' => 'em', 'className' => 'my-highlight']);

See jQuery Highlight

If you found a typo or error, please help us improve this document.