Giter Site home page Giter Site logo

Ignite UI for jQuery

Node.js CI Coverage Status CodeQL Discord

npm version Bower version

Ignite UI for jQuery™ helps you build powerful, high-performance web-based applications. Inside Ignite UI for jQuery you'll find user experience controls and components for creating engaging line-of-business web applications which target the browsers for both mobile & desktop environments.

About Ignite UI for jQuery

Ignite UI for jQuery is built on jQuery and jQuery UI and ties in seamlessly with the jQuery core model and conventions including all styling support via jQuery UI Theme Roller. Beyond jQuery Ignite UI for jQuery features support for Bootstrap themes, AngularJS, Knockout and jQuery Mobile.

Available Features in Ignite UI for jQuery open-source version

Feature Ignite UI for jQuery OSS Ignite UI for jQuery Full Infragistics Ultimate Help
Editors
igCombo ✅ ✅ ✅ api \ help \ topics source
igHtmlEditor ✅ ✅ ✅ api \ help \ topics source
igRating ✅ ✅ ✅ api \ help \ topics source
igValidator ✅ ✅ ✅ api \ help \ topics source
igCurrencyEditor ✅ ✅ ✅ api \ help \ topics source
igDateEditor ✅ ✅ ✅ api \ help \ topics source
igMaskEditor ✅ ✅ ✅ api \ help \ topics source
igNumericEditor ✅ ✅ ✅ api \ help \ topics source
igPercentEditor ✅ ✅ ✅ api \ help \ topics source
igTextEditor ✅ ✅ ✅ api \ help \ topics source
igCheckboxEditor ✅ ✅ ✅ api \ help \ topics source
igDatePicker ✅ ✅ ✅ api \ help \ topics source
Frameworks
igLoader ✅ ✅ ✅ api \ help \ topics source
igDataSource ✅ ✅ ✅ api \ help \ topics source
Templating Engine ✅ ✅ ✅ api \ help \ topics source
JS Excel Engine ❌ ✅ ✅ api \ help \ topics source
igGridExcelExporter ❌ ✅ ✅ api \ help \ topics source
Interactions
igTree ✅ ✅ ✅ api \ help \ topics source
igDialog ✅ ✅ ✅ api \ help \ topics source
igToolbar ✅ ✅ ✅ api \ help \ topics source
igToolbarButton ✅ ✅ ✅ api \ help \ topics source
igSplitButton ✅ ✅ ✅ api \ help \ topics source
igNotifier ✅ ✅ ✅ api \ help \ topics source
igPopover ✅ ✅ ✅ api \ help \ topics source
igRadialMenu ❌ ✅ ✅ api \ help \ topics source
igColorPicker ✅ ✅ ✅ api \ help \ topics source
igColorPickerSplitButton ✅ ✅ ✅ api \ help \ topics source
igUpload ✅ ✅ ✅ api \ help \ topics source
igVideoPlayer ✅ ✅ ✅ api \ help \ topics source
igScroll ✅ ✅ ✅ api \ help \ topics source
Data Visualization
igDataChart ❌ ✅ ✅ api \ help \ topics source
igCategoryChart ❌ ✅ ✅ api \ help \ topics source
igShapeChart ❌ ✅ ✅ api \ help \ topics source
igPieChart ❌ ✅ ✅ api \ help \ topics source
igDoughnutChart ❌ ✅ ✅ api \ help \ topics source
igFunnelChart ❌ ✅ ✅ api \ help \ topics source
igBulletGraph ❌ ✅ ✅ api \ help \ topics source
igLinearGauge ❌ ✅ ✅ api \ help \ topics source
igRadialGauge ❌ ✅ ✅ api \ help \ topics source
igMap ❌ ✅ ✅ api \ help \ topics source
igSparkline ❌ ✅ ✅ api \ help \ topics source
igQRCodeBarcode ❌ ✅ ✅ api \ help \ topics source
igZoombar ✅ ✅ ✅ api \ help \ topics source
Scheduling
igScheduler ❌ ✅ ✅ api \ help \ topics source
Layout
igLayoutManager ✅ ✅ ✅ api \ help \ topics source
igSplitter ✅ ✅ ✅ api \ help \ topics source
igTileManager ✅ ✅ ✅ api \ help \ topics source
Grids
igGrid ❌ ✅ ✅ api \ help \ topics source
igHierarchicalGrid ❌ ✅ ✅ api \ help \ topics source
igTreeGrid ❌ ✅ ✅ api \ help \ topics source
Spreadsheet ❌ ✅ ✅ api \ help \ topics source
Grid Features
Column Management Features ❌ ✅ ✅ api \ help \ topics source
Column Fixing ❌ ✅ ✅ api \ help \ topics source
Column Grouping ❌ ✅ ✅ api \ help \ topics source
Column Hiding ❌ ✅ ✅ api \ help \ topics source
Column Moving ❌ ✅ ✅ api \ help \ topics source
Column Resizing ❌ ✅ ✅ api \ help \ topics source
Column Summaries ❌ ✅ ✅ api \ help \ topics source
Column Template ❌ ✅ ✅ api \ help \ topics source
Multi-Column Headers ❌ ✅ ✅ api \ help \ topics source
Collapsible Column Groups ❌ ✅ ✅ api \ help \ topics source
Filtering ❌ ✅ ✅ api \ help \ topics source
Sorting ❌ ✅ ✅ api \ help \ topics source
Unbound Columns ❌ ✅ ✅ api \ help \ topics source
Feature Chooser ❌ ✅ ✅ api \ help \ topics source
Row Selectors ❌ ✅ ✅ api \ help \ topics source
Selection ❌ ✅ ✅ api \ help \ topics source
Tooltips ❌ ✅ ✅ api \ help \ topics source
Updating ❌ ✅ ✅ api \ help \ topics source
Paging ❌ ✅ ✅ api \ help \ topics source
Cell Merging ❌ ✅ ✅ api \ help \ topics source
Responsive Web Design (RWD) Mode ❌ ✅ ✅ api \ help \ topics source
jsRender Integration ❌ ✅ ✅ api \ help \ topics source
REST Updating ❌ ✅ ✅ api \ help \ topics source
Knockout Support ❌ ✅ ✅ api \ help \ topics source
Columns and Layout ❌ ✅ ✅ api \ help \ topics source
Virtualization ❌ ✅ ✅ api \ help \ topics source
Grid Multi-Row Layout ❌ ✅ ✅ api \ help \ topics source
Grid Load On Demand ❌ ✅ ✅ api \ help \ topics source
OLAP Pivot
igPivotDataSelector ❌ ✅ ✅ api \ help \ topics source
igPivotGrid ❌ ✅ ✅ api \ help \ topics source
igPivotView ❌ ✅ ✅ api \ help \ topics source
Knockout Extensions
Combo ✅ ✅ ✅ help \ topics source
Editors ✅ ✅ ✅ help \ topics source
Tree ✅ ✅ ✅ help \ topics source
Grid ❌ ✅ ✅ help \ topics source
Chart ❌ ✅ ✅ help \ topics source
Theming
Metro ✅ ✅ ✅ help \ topics source
iOS ✅ ✅ ✅ help \ topics source
Bootstrap Default ✅ ✅ ✅ help \ topics source
Bootstrap 4 Default ✅ ✅ ✅ help \ topics source
Bootstrap Superhero ✅ ✅ ✅ help \ topics source
Bootstrap Flatly ✅ ✅ ✅ help \ topics source
Bootstrap Yeti ✅ ✅ ✅ help \ topics source
Infragistics ✅ ✅ ✅ help \ topics source
Infragistics2012 ✅ ✅ ✅ help \ topics source
MVC Extensions ❌ ✅ ✅ help \ topics source
Developer Support 24/5 ❌ ✅ ✅

Install

The package for this development repository is available on both npm and bower. To get started follow the respective package manager installation:

Ignite UI for jQuery CLI

To get started with the Ignite UI for jQuery CLI and Ignite UI for jQuery:

npm i -g igniteui-cli
ig new <project name> --framework=jquery
cd <project name>
ig add combo <component name>
ig start

npm

npm install ignite-ui

bower

bower install ignite-ui

Package contains similar files and structure to what you'd find in the full version of Ignite UI for jQuery with complete styles and lite versions of the combined script files:

<script src="<node_modules|bower_components>/ignite-ui/js/infragistics.core-lite.js" type="text/javascript"></script>
<script src="<node_modules|bower_components>/ignite-ui/js/infragistics.lob-lite.js" type="text/javascript"></script>

The full built content for both packages can be browsed at the Ignite UI for jQuery Bower Shim repository.

Running demos locally

Besides browsing our online samples, you can also run the demos included with this repo in a local clone. Those are useful for quickly trying out some control features, as a base for other samples or even testing local changes.

To setup the repository run the following in the root directory:

npm install

The command will install all build dependencies as well as bower packages used in the demos.

To build the product:

grunt build

This will create source files under the dist/ folder complete with merged locales, combined script and structure CSS and can be called again to include new changes.

The html demos under demos/<control> can now be run directly from the file system.

Getting Help

Contributing

You can find all guidelines on how to contribute on the wiki page.

Ignite UI's Projects

app-builder icon app-builder

App Builder™ is a cloud-based WYSIWYG drag & drop tool that helps teams design and build complete business apps 80% faster than before. It has an integrated design system – Indigo.Design – and packs real UI components for Angular, Blazor, and Web Components.

asp.net-core-samples icon asp.net-core-samples

The repository consists of samples using the Ignite UI For Javascript library in a context of ASP.NET Core Web Application.

autosales-dashboard-sample icon autosales-dashboard-sample

The Auto Sales Tracking sample is an example application showcasing some of the most powerful Ignite UI controls including the map, grid, and various charts. The map control shows the geographical region represented in the sales data. Bullet graphs, data charts, and pie charts show sales figures over time and in relation to target figures. Sales are detailed using the grid control by dealership and manufacturer and bullet graphs embedded in the grid provide glanceable sales summaries. The application demonstrates how Ignite UI controls are used together to build an immersive and attractive user experience.

crypto-portfolio-app icon crypto-portfolio-app

Application that uses Ignite UI for Angular components along with Firebase data storage and a lot more ..

er-dashboard-sample icon er-dashboard-sample

The ER Dashboard sample demonstrates the capabilities of multiple Ignite UI controls working together into a single complex view designed for mobile tablet devices. The main part of the sample is several charts displaying different kinds of information about patients admitted to the emergency ward of a hospital. The sample shows how the same information can be displayed in a grid and how to switch between views. Combo boxes are used to select different medical parameters to be displayed dynamically update the data behind the charts. Additional buttons let you change the chart visualization with the same data.

finance-sample icon finance-sample

The Finance Dashboard sample demonstrates the data chart, combo, dialog, and zoom bar controls for the Financial Services industry. The data chart is optimized for high-speed financial charting. This sample uses large datasets with millions of data points and real-time updates. The data chart enables key statistical and technical indicators and comparisons to key competitors.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.