Ignite UI API Reference

mobile.loader

mobile.loader_image

The Mobile Loader class is also available through a static object component that allows you to initialize the Mobile Loader class properties as JavaScript path, Cascading Styles Sheets path and resources.

When the loader has recognized that all resources are loaded on to the page, then a callback is run that operates much like the document ready event in jQuery. The following code snippet demonstrates how to initialize the Mobile Loader static object.

Code Sample

 
    <!doctype html>
        <html>
        <head>
                <!-- jQuery Core -->
                <script src="js/jquery.js" type="text/javascript"></script>
	            <!-- jQuery Mobile -->
                <script src="js/jquery.mobile.js" type="text/javascript"></script>
	            <!-- Moderznizr -->
                <script src="js/modernizr.js" type="text/javascript"></script>
                <!-- Infragistics Loader Script -->
                <script src="js/infragistics.loader.js" type="text/javascript"></script>    
                <!-- Infragistics Loader Initialization -->
                <script type="text/javascript">
                    $.ig.loader({
                        scriptPath: "js/",
                        cssPath: "css/",
                        resources: "igmRating"
                    });
                </script>
            </head>
            <body>
                <div id="igRating1" 
		            data-role="igrating"
		            data-value="2">
	            </div>
            </body>
        </html>
    

Related Samples

Related Topics

Dependencies

The current widget has no options.
The current widget has no events.
  • loader

    .loader( [param1:object], [param2:string], [param3:object] );

    Static object that can be used similarly to document ready statement in jQuery.
    The callback will not be invoked until the document is ready.
    Accepts three parameters all of which are optional and can be passed in in any order:

    Examples:

    1. Initialize and be notified all through the passed in options:

    $.ig.loader({
    scriptPath: '../../../Source/ClientUI/js/',
    cssPath: '../../../Source/ClientUI/css/',
    resources: 'igGrid.*,igTree',
    ready: function () {} });


    2. Initialize separately, be notified later

    $.ig.loader({
    scriptPath: '../../../Source/ClientUI/js/',
    cssPath: '../../../Source/ClientUI/css/',
    resources: 'igGrid'});

    $.ig.loader(function () {
    // Create a couple of igGrids
    $("#grid1").igGrid({
    virtualization: false,
    autoGenerateColumns: true,
    ...
    }
    }

    3. Load resources on demand with separate initialization

    $.ig.loader({
    scriptPath: '../../../Source/ClientUI/js/',
    cssPath: '../../../Source/ClientUI/css/'
    });

    $.ig.loader('igGrid', function () {
    // Create a couple of igGrids
    $("#grid1").igGrid({
    virtualization: false,
    autoGenerateColumns: true,
    ...
    }
    }

    4. Use chained methods

    $.ig.loader().load('igGrid', function () {...}).load('igTree', function() {...});.

    • param1
    • Type:object
    • Optional
    • Initialization object. Described in loaderClass settings.
    • param2
    • Type:string
    • Optional
    • Comma separated list of resources to load.
    • param3
    • Type:object
    • Optional
    • Returns an instance of the loader class implementation.

    Code Sample

     
                $.ig.loader({
                    scriptPath: "js/", 
                    cssPath: "css/", 
                    resources: "igmList", 
                    ready: function () { onReady(); } 
                });
              

Copyright © 1996 - 2024 Infragistics, Inc. All rights reserved.

#