Back to the main menu
Layout
Image cropper
Javascript Template
JavaScript Organogram
Javascript Heatmap
Base
Core features
JavaScript Dropdown
JavaScript Calendar
Tags and keywords
JavaScript tabs plugin
Color picker plugin
Context menu plugin
Input mask plugin
JavaScript Modal
Rich FORM - Are you Sure?
JavaScript rating plugin
JavaScript toolbar
Text editor plugin
Picker plugin
Contact
Examples
jSuites | Javascript vanilla web components jSuites is a multi purpose responsive, cross platform javascript web components. A collection of simple and ligthweight javascript, fully responsive plugins.jSuites | Javascript vanilla web components | Examples jSuites is a multi purpose responsive, cross platform javascript web components. A collection of simple and ligthweight javascript fully responsive plugins.Dropdown and autocomplete javascript vanilla component Full examples on how to handle simple, advanced, autocomplete and conditional javascript dropdowns, selectbox, selectJavascript dropdown quick reference Javascript dropdown plugin quick reference documentationAdding new options to the JavaScript autocomplete How to enable the new option controls on your javascript autocompleteJavascript dropdown basic example Basic example of jsuites javascript dropdown plugin. How to create a dropdown from a select HTML tag or progratically via JavaScript.Multiple option javascript dropdown How to create a multiple option jsuites javascript dropdown.Large sample javascript dropdown with lazyloading Large sample on a jsuites javascript dropdown plugin exampleJavascript autocomplete remote searching Create a new HTML dropdown with autocomplete from a remote source.Adding icons on the javascript dropdown items How to include icons on the javascript dropdown items.Adding items with colors on the javascript dropdown How to include colors on the javascript dropdown items.Countries dropdown with flags Create a country dropdown with automcomplete and flag icons.Javascript dropdown with categories and group of items How to group the items from a dropdown in categories.Javascript dropdown javascript events Dealing with javascript dropdown events.Javascript dropdown programmatically interactions. Javascript dropdown programmatically changes and updates.Responsive javascript dropdown Create a fully responsive javascript dropdown. Mobile rendering.React dropdown Create a dropdown component with react and jSuitesJavascript calendar, date, datetime picker The jsuites calendar is a lightweigh, full responsive javascript calendar date and datetime picker with easy integration.Javascript calendar plugin quick reference Learn how to use the javascript calendar plugin. Configurations rules, methods, intialization prperties, and much more.Javascript calendar basic example How to render a javascript calendar as a plugin or a javascript webcomponent.Javascript calendar with time picker How to render a javascript calendar with a timepicker.Javascript calendar and timepicker events How to handle the events of the jsuites calendar picker.Javascript calendar valid range Learn how to create a valid selectable range of dates in the javascript calendar. Any date out of the range would be gray out.Javascript calendar international options Customize the javascript calendar texts and international options.Javascript calendar programmatically changes How to interact with the calendar and time picker via javascript.Responsive javascript calendar Responsive javascript calendar. How to load on the calendar on mobile or small screens.JavaScript year-month picker JavaScript year month picker.Inline JavaScript Calendar Create nice applications with the jsuites inline javascript calendar picker.React calendar Create a calendar picker component with react and jSuitesJavascript tags The jSuites.tags is very light javascript webcomponent and plugin to allow users to insert and manage multiple entries as tags into a text input.A quick reference to the javascript tags plugin A quick reference for using the javascript tags plugin.Javascript tags basic example A javascript tags plugin basic example.Javascript tags remote searching Enable the autocomplete suggestions in your javascript tags plugin.Javascript tags events Learn how to use events on the javascripts tags plugin.Javascript tags validations Include a validation for the tags in the javascript tags plugin.React tags Create a tags component with react and jSuitesJavascript color picker plugin Vanilla javascript colorpicker pluginJavascript color picker quick reference Learn how to use the jsuites color picker javascript plugin.A basic example of the javascript color plugin Create a basic color picker using the javascript color picker plugin.Javascript color picker events Handling javascript events in your color picker plugin.Customize the colors on the javascript color picker plugin How to customize the colors on the jsuites javascript color plugin.Integrating the javascript color picker plugin with jsuites palettes. How to integrate jsuites palettes with the jsuites javascript color plugin.Customize the colors on the javascript color picker plugin How to customize the colors on the jsuites javascript color plugin.React color picker Create a color picker component with react and jSuitesAdd a simple contextmenu in your web based application A simple javascript contextmenu that helps to provide a custom right click contextmenu over HTML elements in a web-based application.Quick reference documentation for the jsuites javascript contextmenu The documentation reference to use the jsuites javascript contextmenu plugin.A javascript contextmenu webcomponent example A basic example on how to use the jsuites contextmenu as a javascript webcomponent.A javascript contextmenu vanilla javascript example A basic example on how to use the jsuites contextmenu as a javascript plugin.Javascript contextmenu with submenus How to include submenus on the jsuites javascript contextmenu plugin.Javascript contextmenu with Icons How to include icons on the jsuites javascript contextmenu plugin.Javascript string and number mask A simple javascript mask pluginJavascript mask quick reference A quick reference on how to use the javascript mask plugin.Javascript mask basic examples A few examples of basic usage of the javascript mask plugin.Javascript mask plugin events How to check the status of a input mask. A property is added to the element to tell the system, the entry has been entered in full.Programmatically updates Programmatically appying a mask to a string or a number using the jSuites mask plugin.Javascript modal plugin Vanilla javascript modal plugin and modal javascript webcomponent.Javascript modal quick reference How to use the jsuites modal as a javascript plugin or webcomponent.Javascript modal plugin basic example A basic example on how to use the javascript modal as a webcomponent or a javascript plugin.Javascript modal events Learn how to use the events available on the jsuites javascript modal plugin.React modal Create a modal component with react and jSuitesJavascript rich form plugin The jsuites rich form plugin allow developers to create smart form validations, tracking changes on the form elements and simplify the data persistance to a remote server.Javascript rich form quick reference Explorer the jsuites rich form plugin and its usuful implementations, validation, tracking changes (Are you sure?) and data managament.Tracking changes in elements from a form This feature of the rich form plugin alerts the user when leaving a page without saving any changes in a HTML form.Data managment options How to use the data management options of the jsuites rich form plugin.HTML form validations How to implement HTML form validations using the rich form plugin.JavaScript five star rating plugin Vanilla JavaScript star rating plugin.Javascript rating plugin quick reference Learn how to use this simple rating plugin.Javascript events Dealing with the javascript rating plugin events.React rating Create a rating component with react and jSuitesJavascript HTML editor plugin with filters A simple HTML editor with several interactive features and easy integration.HTML editor quick reference A simple HTML editor with several interactive features and easy integration.HTML editor basic example Basic example of the jsuites HTML editor.Customize the toolbar on the jsuites HTML editor How to customize the toolbar in the jsuites HTML editor.HTML editor image dropping zone. Using the HTML editor dropping zone to help upload images or files.HTML editor snippet Learn how to retrieve remote information from website, videos, etc.Javascript image slider plugin Simple vanilla javascript image slider pluginJavaScript toolbar Integrate a toolbar to third part javascript componentsJavaScript toolbar Basic methods and properties in the javascript toolbar component.JavaScript toolbar How to integrate fontawsome to the javascript toolbar.JavaScript toolbar How to integrate custom icon images to the javascript toolbar.JavaScript tabs plugin Group your content on tabs with jsuites javascript tabs plugin.JavaScript tabs plugin quick reference JavaScript tabs plugin quick reference.Basic JavaScript tabs example Create tabs content from a javascript array of objects.Custom JavaScript tabs style How to change the tabs style to a more modern style.JavaScript tabs with remote content Create a tabs content from a remote source using javascript.JavaScript tabs events Dealing with events from the jsuites tabs javascript plugin.JavaScript tabs methods Programatically updates on the javascript tabs plugin.JavaScript image cropper Edit images online via JavaScript with the jSuites javascript cropper plugin. Useful features such crop, brightness, contrast, rotate and zoom are available.JavaScript image cropper quick reference The quick reference on How to implment a JavaScript online image copper.JavaScript image cropper filters Example on how to implement controls and how apply filters such as brightness and contrast programatically.JavaScript image cropper controls Example on how to programatically rotate and zoom the image in the javascript cropper plugin.JavaScript image cropper integration with Lemonadejs Online image editor plugin, with image crop, brightness, contrast, rotate and zoom using lemonadejs.JavaScript AJAX requests management abstraction layer JavaScript AJAX requests management pluginJavaScript basic animations A collection of basic JavaScript animations, slide left, slide right, slide bottom, slide top, fade in, fade outJavaScript toast notification Basic responsive JavaScript toast notificationJavaScript loading spin JavaScript loading spin web compoment.JavaScript drag and drop plugin JavaScript drag and drop plugin.React image cropper React image cropper and online image editor.JavaScript template Load data remotely or locally into a template automatically.jSuites template quick reference The quick reference on how to use jsuites template to easily render templates with remote or local data.Javascript template data loading Example on how to programatically load data remotely or locally into a template.Javascript template pagination and searching Example on how to programatically add pagination and search in the template.Javascript template main functionalities Example on how to programatically add and remove elements from the template.Javascript template events Example on how to programatically add events to the template.Javascript picker A lightweight and fast javascript picker plugin.Javascript picker quick reference jSuites picker plugin quick reference documentation.Javascript picker basic example How to use the jSuites picker plugin.Javascript picker stylize options How to style the picker options.Javascript picker static front How to use a front that is not changed when changing the option.Javascript picker handle changes how to trigger a function when changing the picker option.Javascript heatmap plugin A lightweight javascript activity github-like heatmap plugin.Javascript heatmap quick reference jSuites heatmap plugin quick reference documentation.Jaascript heatmap basic example Basic github-like activity heatmap plugin.Javascript heatmap colors How to set the colors of your heat map.Javascript heat map title and tooltip How define a title and show the tooltip.JavaScript organogram Create amazing interactive web-based JavaScript organogram.JavaScript organogram - Quick reference Learn how to customize the JavaScript interactive web-based organogram plugin.JavaScript organogram - Basic example How to create a basic instance of the javascript organogram.JavaScript organogram - Examples - Programatically changes Interact with the JavaScript organogram plugin.JavaScript organogram - Examples - React organogram Integrate organogram plugin with react