Spaner - Simple light Bootstrap Nice Admin Panel Dashboard Design Responsive HTML5 Template

Note:-

Please refer Faq's page in documentation itself for queries and customization like Colors, RTL, Dark style..etc.

File Browser

jQuery input type file upload, The following HTML,JS, should have in your page to implement a File upload.

	
		
	

Open file-upload.js file (assets/js/file-upload.js) You can see below js



$(document).on('change', '.file-browserinput', function() {
	var input = $(this),
		numFiles = input.get(0).files ? input.get(0).files.length : 1,
		label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
	input.trigger('fileselect', [numFiles, label]);
	});

	// We can watch for our custom `fileselect` event like this
	$(document).ready( function() {
		$(':file').on('fileselect', function(event, numFiles, label) {

			var input = $(this).parents('.input-group').find(':text'),
				log = numFiles > 1 ? numFiles + ' files selected' : label;

			if( input.length ) {
				input.val(log);
			} else {
				if( log ) alert(log);
			}

		});
	});

	
Radio Buttons
	
		
	
	
Checkboxes
	
		
	
	
Toggle Switches
	
		
	
	
Range Slider

Range-Slider is very simple to use as a jQuery plug-in with a huge range of customizable option..

1. You need to add these files to make it work.
	
		
	
	
    
		
		
	


 <!-- INTERNAL ion.rangeSlider.min js -->
 <script src="../assets/plugins/ion-rangeslider/js/ion.rangeSlider.min.js"></script>;
 <script src="../assets/js/rangeslider.js"></script>;

	
	
Type URL
Plugin Link http://ionden.com/a/plugins/ion.rangeSlider/demo.html