function loadData() {
	var oTable = $('#notice').DataTable( {
	"serverSide": true,
	  "ajax": {
		"url": "/notice/list",
		"type": "POST",
	  },
	"language": {
			"aria": {
				"sortAscending": ": activate to sort column ascending",
				"sortDescending": ": activate to sort column descending"
			},
			"emptyTable": "No data available in table",
			"info": "Showing _START_ to _END_ of _TOTAL_ entries",
			"infoEmpty": "No entries found",
			"infoFiltered": "(filtered1 from _MAX_ total entries)",
			"lengthMenu": "_MENU_ entries",
			"search": "Search:",
			"zeroRecords": "No matching records found"
		},
	"ordering": false,
	"bInfo": false,
	"bAutoWidth ": false,
	buttons: [
		{ extend: 'print', className: 'btn dark btn-outline' },
		{ extend: 'excel', className: 'btn yellow btn-outline ' },
		{ extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
	],
	"lengthMenu": [ [10, 25, 50,100,99999999], [10, 25, 50,100, "All"] ],
	
	"bLengthChange": false,
	});
	var oTable = $('#contacts').DataTable( {
	"serverSide": true,
	  "ajax": {
		"url": "/notice/contacts",
		"type": "POST",
	  },
	"ordering": false,
	"bInfo": false,
	"bAutoWidth ": false,
	buttons: [
		{ extend: 'print', className: 'btn dark btn-outline' },
		{ extend: 'excel', className: 'btn yellow btn-outline ' },
		{ extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
	],
	"lengthMenu": [ [10, 25, 50,100,99999999], [10, 25, 50,100, "All"] ],
	
	"bLengthChange": false,
	});
	var oTable = $('#companies').DataTable( {
	"serverSide": true,
	  "ajax": {
		"url": "/notice/companies",
		"type": "POST",
	  },
	"ordering": false,
	"bInfo": false,
	"bAutoWidth ": false,
	buttons: [
		{ extend: 'print', className: 'btn dark btn-outline' },
		{ extend: 'excel', className: 'btn yellow btn-outline ' },
		{ extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
	],
	"lengthMenu": [ [10, 25, 50,100,99999999], [10, 25, 50,100, "All"] ],
	
	"bLengthChange": false,
	});
	$('.search-input-text').on( 'keyup click change', function () {   // for text boxes
		var i =$(this).attr('data-column');  // getting column index
		var v =$(this).val();  // getting search input value
		oTable.columns(i).search(v).draw();
	} );
	$('.search-input-select').on( 'change', function () {   // for select box
		var i =$(this).attr('data-column');  
		var v =$(this).val();  
		oTable.columns(i).search(v).draw();
	} );
	$('.filter-cancel').on( 'click', function () {   // for select box
		$('.search-input-text').val('');
		$('.search-input-select').val('');
		$('.search-input-text').trigger('change');
		$('.search-input-select').trigger('change');
		
		oTable.draw();
	} );
	$("#notice_filter").css("display","none"); 
	$('#sample_3_tools > li > a.tool-action').on('click', function() {
		var action = $(this).attr('data-action');
		oTable.DataTable().button(action).trigger();
	});

}
var FormWizard = function () {


    return {
        //main function to initiate the module
        init: function () {
            if (!jQuery().bootstrapWizard) {
                return;
            }
		var form = $('#stepy_form');
		var error = $('.alert-danger', form);
		var success = $('.alert-success', form);
		form.validate({
			doNotHideMessage: true, //this option enables to show the error/success messages on tab switch.
			errorElement: 'span', //default input error message container
			errorClass: 'help-block help-block-error', // default input error message class
			focusInvalid: false, // do not focus the last invalid input
			rules: {
                message: {
                    required: true,
                },
            },
            messages: {
                message: {
                    required: "You need to have message in order to continue",
                },            
            },
			// errorPlacement: function (error, element) { // render error placement for each input type
				// error.insertAfter(element); // for other inputs, just perform default behavior
			// },
			
			invalidHandler: function (event, validator) { //display error alert on form submit   
				success.hide();
				error.show();
				App.scrollTo(error, -200);
			},

			highlight: function (element) { // hightlight error inputs
				$(element)
					.closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group
			},

			unhighlight: function (element) { // revert the change done by hightlight
				$(element)
					.closest('.form-group').removeClass('has-error'); // set error class to the control group
			},
			success: function (label) {
				if (label.attr("for") == "gender" || label.attr("for") == "payment[]") { // for checkboxes and radio buttons, no need to show OK icon
					label
						.closest('.form-group').removeClass('has-error').addClass('has-success');
					label.remove(); // remove error label here
				} else { // display success icon for other inputs
					label
						.addClass('valid') // mark the current input as valid and display OK icon
					.closest('.form-group').removeClass('has-error').addClass('has-success'); // set success class to the control group
				}
			},
			submitHandler: function (form) {
				
				var dataString = $('#stepy_form').serialize();
				$.ajax({
					type: "POST",
					url: "/notice/add-notice",
					data: dataString,
					cache: false,
					beforeSend: function(){ 
						$("#finish").hide();
						$("#wait").show();
						$("#suksesupdate").hide();
						$("#gagalupdate").hide();
					},
					complete: function(e, xhr, settings){
						if(e.status === 200){
							$("#finish").show();
							$("#wait").hide();
							$("#suksesupdate").show();
							//$("#gagalupdate").hide();
							location.reload();
						}else{
							$("#finish").show();
							$("#wait").hide();
							//$("#suksesupdate").show();
							$("#gagalupdate").show();
						}
					}
					
				});
			
			return false;
			}
		 });
		 var displayConfirm = function() {
                $('#tab3 .form-control-static', form).each(function(){
                    var input = $('[name="'+$(this).attr("data-display")+'"]', form);
                    if (input.is(":radio")) {
                        input = $('[name="'+$(this).attr("data-display")+'"]:checked', form);
                    }
                    if (input.is(":text") || input.is("textarea")) {
                        $(this).html(input.val());
                    } else if (input.is("select")) {
                        $(this).html(input.find('option:selected').text());
                    } else if (input.is(":radio") && input.is(":checked")) {
                        $(this).html(input.attr("data-title"));
                    } else {
						$(this).html(input.val());
					}
                });
            }

            var handleTitle = function(tab, navigation, index) {
                var total = navigation.find('li').length;
                var current = index + 1;
                // set wizard title
                $('.step-title', $('#form_wizard_1')).text('Step ' + (index + 1) + ' of ' + total);
                // set done steps
                jQuery('li', $('#form_wizard_1')).removeClass("done");
                var li_list = navigation.find('li');
                for (var i = 0; i < index; i++) {
                    jQuery(li_list[i]).addClass("done");
                }

                if (current == 1) {
                    $('#form_wizard_1').find('.button-previous').hide();
                } else {
                    $('#form_wizard_1').find('.button-previous').show();
                }

                if (current >= total) {
                    $('#form_wizard_1').find('.button-next').hide();
                    $('#form_wizard_1').find('.button-submit').show();
                    displayConfirm();
                } else {
                    $('#form_wizard_1').find('.button-next').show();
                    $('#form_wizard_1').find('.button-submit').hide();
                }
                App.scrollTo($('.page-title'));
            }

            // default form wizard
            $('#form_wizard_1').bootstrapWizard({
                'nextSelector': '.button-next',
                'previousSelector': '.button-previous',
                onTabClick: function (tab, navigation, index, clickedIndex) {
                    return false;
                    
                    success.hide();
                    error.hide();
                    if (form.valid() == false) {
                        return false;
                    }
                    
                    handleTitle(tab, navigation, clickedIndex);
                },
                onNext: function (tab, navigation, index) {
                    success.hide();
                    error.hide();

                    if (form.valid() == false) {
                        return false;
                    }

                    handleTitle(tab, navigation, index);
                },
                onPrevious: function (tab, navigation, index) {
                    success.hide();
                    error.hide();

                    handleTitle(tab, navigation, index);
                },
                onTabShow: function (tab, navigation, index) {
                    var total = navigation.find('li').length;
                    var current = index + 1;
                    var $percent = (current / total) * 100;
                    $('#form_wizard_1').find('.progress-bar').css({
                        width: $percent + '%'
                    });
                }
            });

            $('#form_wizard_1').find('.button-previous').hide();
            $('#form_wizard_1 .button-submit').click(function () {
                // alert('Finished! Hope you like it :)');
            }).hide();

        }

    };

}();

jQuery(document).ready(function() {
    FormWizard.init();
	$('#contact').multiSelect();
	$('#company').multiSelect();
    loadData(1); 
});
