zendash - Admin Dashboard HTML Template

Telephone Input

International Telephone Input for entering and validating international telephone numbers . It adds a flag dropdown to any input, detects the user's country, displays a relevant placeholder and provides formatting/validation methods.General Telephone Input HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- Internal TelephoneInput js -->
<script src="../../assets/plugins/telephoneinput/telephoneinput.js"></script>
<script src="../../assets/plugins/telephoneinput/inttelephoneinput.js"></script>

		
	

Date range Picker

A JavaScript component for choosing date ranges, dates and times.General Date Range Picker HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- Internal Daternagepicker js -->
<script src="../../assets/plugins/bootstrap-daterangepicker/moment.min.js"></script>
<script src="../../assets/plugins/bootstrap-daterangepicker/daterangepicker.js"></script>

		
	

//Date range picker
$('#reservation').daterangepicker();


		
	

Date Picker

A JavaScript component for choosing dates and times.General Date Picker HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- Internal Datepicker js -->
<script src="../../assets/plugins/date-picker/date-picker.js"></script>
<script src="../../assets/plugins/date-picker/jquery-ui.js"></script>

		
	

// Datepicker
   $('.fc-datepicker').datepicker({
	 showOtherMonths: true,
	 selectOtherMonths: true
   });



		
	

Multiple Select Styles

Multiple Select also supports multi-value select boxes. The select below is declared with the multiple attribute. Select2 automatically picks up on this.General Multiple Select HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- InternalSumoselect js -->
<script src="../../assets/plugins/sumoselect/jquery.sumoselect.js"></script>

		
	

//muti
window.asd = $('.SlectBox').SumoSelect({ csvDispCount: 3, selectAll:true, captionFormatAllSelected: "Yeah, OK, so everything." });
window.Search = $('.search-box').SumoSelect({ csvDispCount: 3, search: true, searchText:'Enter here.' });
window.sb = $('.SlectBox-grp-src').SumoSelect({ csvDispCount: 3, search: true, searchText:'Enter here.', selectAll:true });
$('.testselect1').SumoSelect();
$('.testselect2').SumoSelect();
$('.selectsum1').SumoSelect({ okCancelInMulti: true, selectAll: true });
$('.selectsum2').SumoSelect({ selectAll: true });


		
	

Time picker

A JavaScript component for choosing Time picker, times.General Time picker HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- Internal Time picker js -->
<script src="../../assets/plugins/time-picker/jquery.timepicker.js"></script>
<script src="../../assets/plugins/time-picker/toggles.min.js"></script>

		
	

Color Picker

DataTables 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.

• HTML
• CSS
• JS

    

 <!-- Internal Specturm-colorpicker js -->
 <script src="../../assets/plugins/spectrum-colorpicker/spectrum.js"></script>;

	
	

//transparency selection

$('#showAlpha').spectrum({
	color: 'rgba(23,162,184,0.5)',
	showAlpha: true
});



// Palettes selection

$('#showPaletteOnly').spectrum({
	showPaletteOnly: true,
	showPalette: true,
	color: '#DC3545',
	palette: [
		['#1D2939', '#fff', '#0866C6', '#23BF08', '#F49917'],
		['#DC3545', '#17A2B8', '#6610F2', '#fa1e81', '#72e7a6']
	]
});
		
	

File Upload

General File Upload HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- Internal Fileuploads js -->
<script src="../../assets/plugins/fileuploads/js/fileupload.js"></script>
<script src="../../assets/plugins/fileuploads/js/file-upload.js"></script>

		
	

Fancy uploader

General File Upload HTML structure in Zendash template. Here is the Folder structure.

• HTML
• CSS
• JS

    
<!-- InternalFancy uploader js -->
<script src="../../assets/plugins/fancyuploder/jquery.ui.widget.js"></script>
<script src="../../assets/plugins/fancyuploder/jquery.fileupload.js"></script>
<script src="../../assets/plugins/fancyuploder/jquery.iframe-transport.js"></script>
<script src="../../assets/plugins/fancyuploder/jquery.fancy-fileupload.js"></script>
<script src="../../assets/plugins/fancyuploder/fancy-uploader.js"></script>

		
	

Select All Styles

Sumoselect 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.

• HTML
• CSS
• JS

    

 <!-- Internal Sumoselect js -->
 <script src="../../assets/plugins/sumoselect/jquery.sumoselect.js">;

	
	

Dual List Box

Transfer 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.

• HTML
• CSS
• JS

    

 <!-- Internal Transfer js -->
 <script src="../../assets/plugins/jQuerytransfer/jquery.transfer.js">;