Widgets > Smart Widgets

Heads up! If the widgets are not reacting to your drag and drop events on chrome, try to turn off chrome touch events by going to, chrome://flags/#touch-events if you do not have a touch screen.

Smart Widgets (aka JarvisWidgets) v 2.0
Exclusive to SmartAdmin!

The all new and revolutionary JarvisWidgets v2.0 ($35 value) is now only exclusive to SmartAdmin. JarvisWidgets allows you to do more than your normal widgets. You can now use realtime AJAX loading in a snap with auto refresh. Add Infinite buttons and controls to widget header. All widgets are Sortable across all bootstrap col-spans and uses HTML5 localStorage. Also now supports RTL Support, Crosbrowser Support, Callback functions and More..

Default Widget

Change title to update and save instantly!

Widget comes with a default 10 padding to the body which can be removed by adding the class .no-padding to the .widget-body class. The default widget also comes with 5 widget buttons as displayed on top right corner of the widget header.

Big Button

Title Change

Change title to update and save instantly!

Activate Options Button

data-widget-editbutton

Full Screen

Make any widget full screen

data-widget-fullscreenbutton

Usefull when viewing images, gallery, tables with large data and maps. There are much useful applications to this method

Delete Widget

By deleting a widget you will remove the widget from the page and will need to connect the backend with the onevent handler to delete it from database.
data-widget-deletebutton

Widget Colors

Change and save widget color
data-widget-colorbutton

Change widget color at will and SmartAdmin will permanently remember the color of your chosen widget. Do this to any widget in any page and SmartAdmin will keep track of all your widgets!

widget colorpicker

Label & Badges

2.35%
99
small badge
I am a big label

Add label inside widget footer / toolbar

Tabs / Pills Widget

Insert tabs / pills to widget header

I have six locks on my door all in a row. When I go out, I lock every other one. I figure no matter how long somebody stands there picking the locks, they are always locking three.

Checkout the General Elements page for more tab options

Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee.

Refresh Widget

This content will be replaced via ajax loader...

Collapsable Widget

This widget is opened by default

data-widget-togglebutton

Notice the header text size slightly larger than other widget headers

Collapsed Widget

This widget is collapsed by default

data-widget-collapsed

Progress bars

55 %

Widget buttons

Btn

Insert buttons to header manually or dynamically

With Paging

Alert without body padding...

Notice this widget body has no padding!

Widget with Dropdown

Add dropdowns to header with ease. Making sure to add btn-xs class when using dropdowns on the widget header.

Widget Switch

Style 1

Insert switches to widget header

Locked Widget

Locked widgets lock the widget to the base grid (you will not be able to drag this widget ). This also allows you to append and use input text elmenets on the widget header.

data-widget-sortable="false"

Fixed Height

Change title to update and save instantly!
License Key Username ! Date
C87E48EF-605A-B4FF erat@montesnasceturridiculus.org 10/03/13
5DDA79E7-890F-064D Nunc.lectus@ipsum.co.uk 28/12/13
468459AA-7933-C017 vitae.mauris.sit@tempordiamdictum.net 25/02/14
C3006C18-4677-D2CE nec.urna.suscipit@acrisusMorbi.edu 06/07/14
E535C188-FDF4-90CB lobortis@pedeacurna.com 28/12/12
95489E95-9602-18B7 egestas.lacinia.Sed@In.ca 17/07/14
D34E6661-D81A-9328 arcu@lectus.ca 14/10/14
C72D2C04-458F-EBD0 ut.pharetra.sed@vulputatevelit.net 30/04/14
10CAFA5C-AB4B-8B45 arcu.eu.odio@Duis.co.uk 14/02/13
AA4F5CBA-1CE8-85B7 nec@rutrum.net 06/02/14
2D816071-8F99-B315 Praesent.luctus.Curabitur@elementum.ca 27/09/13
41BDB60C-C6EA-54EB Nunc.sed.orci@sitamet.org 18/11/13
43F3D48B-FEF3-776E eu.erat@nequevitaesemper.com 23/04/13
2521899F-79B9-B309 mattis.velit@risusQuisque.ca 04/07/13
D08994C9-DCB1-948B Proin@metusAliquam.net 27/07/13
7AD2C774-36BA-0B2B tincidunt@Lorem.com 01/07/14
162C0373-FF3B-2469 ante.dictum.cursus@ultrices.org 10/02/13
05641987-3D48-DD72 lorem.ut.aliquam@Sednecmetus.org 16/08/14
3A173E5A-192A-0D5D nunc.risus@vitae.org 04/04/13
67081066-E0B5-9E37 lectus@sed.org 10/12/14
C677C05F-7D98-C3E9 auctor.quis@Morbi.org 30/03/13

Basic Usage

Note: You must delete the data-attribute* associated in order to act as true. For example data-widget-togglebutton="true" will still act as false, you must remove the data-attribute for the statement to be true.
HTML5 data attributes / CSS / HTML Place after Example value(s) Desctription
data-widget-sortable header false Prevent a widget from being sortable (can only be used with the value 'false').
data-widget-icon .jarviswidget fa fa-trash Use a icon in the widgets header (see icons section for all list of icons).
data-widget-togglebutton .jarviswidget false Prevent a widget from having a toggle button (can only be used with the value 'false').
data-widget-deletebutton .jarviswidget false Prevent a widget from having a delete button (can only be used with the value 'false').
data-widget-editbutton .jarviswidget false Prevent a widget from having a edit button (can only be used with the value 'false').
data-widget-fullscreenbutton .jarviswidget false Prevent a widget from having a fullscreen button (can only be used with the value 'false').
data-widget-load .jarviswidget widget-ajax.php The file that is loaded with ajax.
data-widget-refresh .jarviswidget 10 Seconds to refresh a ajax file (see 'data-widget-load').
data-widget-refreshbutton .jarviswidget false Prevent a ajax widget from showing a refresh button (can only be used with the value 'false').
data-widget-hidden .jarviswidget true Hide a widget at load (can only be used with the value 'true').
data-widget-colorbutton .jarviswidget false This is active by default, set it to false to hide.
data-widget-collapsed .jarviswidget false Collapse a widget upon load (can only be used with the value 'true'). This will allways be collapsed every page load.
data-widget-grid article false You can exclude grids from being a sortable/droppable area, this means that all widgets in this area will work, but cant be sortable/droppable and that all other widgets cant be dropped in this area. Add this attribute (can only be used with the value 'false') to a grid element.
.no-padding .widget-body n/a Removes all padding inside widget body
.well .jarviswidget n/a Converts a widget to a well
These HTML5 attributes are used as individual widget options. Main options can be changed in the widgets plugin it self. Notice: data attributes can only have 1 boolan value(see above)!