fistcommit
This commit is contained in:
210
assets/scripts/x-editable.demo.js
Normal file
210
assets/scripts/x-editable.demo.js
Normal file
@ -0,0 +1,210 @@
|
||||
/**
|
||||
* Theme: Ninja Admin Template
|
||||
* Author: NinjaTeam
|
||||
* Module/App: X-Editable
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
"use strict";
|
||||
|
||||
$(document).ready(function(){
|
||||
$('#inline-username').editable({
|
||||
type: 'text',
|
||||
pk: 1,
|
||||
name: 'username',
|
||||
title: 'Enter username',
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-firstname').editable({
|
||||
validate: function(value) {
|
||||
if($.trim(value) == '') return 'This field is required';
|
||||
},
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-sex').editable({
|
||||
prepend: "not selected",
|
||||
mode: 'inline',
|
||||
source: [
|
||||
{value: 1, text: 'Male'},
|
||||
{value: 2, text: 'Female'}
|
||||
],
|
||||
display: function(value, sourceData) {
|
||||
var colors = {"": "#98a6ad", 1: "#5fbeaa", 2: "#5d9cec"},
|
||||
elem = $.grep(sourceData, function(o){return o.value == value;});
|
||||
|
||||
if(elem.length) {
|
||||
$(this).text(elem[0].text).css("color", colors[value]);
|
||||
} else {
|
||||
$(this).empty();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('#inline-status').editable({mode: 'inline'});
|
||||
|
||||
$('#inline-group').editable({
|
||||
showbuttons: false,
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-dob').editable({mode: 'inline'});
|
||||
$('#inline-event').editable({mode: 'inline'});
|
||||
|
||||
$('#inline-comments').editable({
|
||||
showbuttons: 'bottom',
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-fruits').editable({
|
||||
pk: 1,
|
||||
limit: 3,
|
||||
source: [
|
||||
{value: 1, text: 'banana'},
|
||||
{value: 2, text: 'peach'},
|
||||
{value: 3, text: 'apple'},
|
||||
{value: 4, text: 'watermelon'},
|
||||
{value: 5, text: 'orange'}
|
||||
],
|
||||
mode: 'inline'
|
||||
});
|
||||
});
|
||||
|
||||
$("#switch-inline").on("change",function(){
|
||||
if ($(this).prop("checked")){
|
||||
destroy_all();
|
||||
$('#inline-username').editable({
|
||||
type: 'text',
|
||||
pk: 1,
|
||||
name: 'username',
|
||||
title: 'Enter username',
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-firstname').editable({
|
||||
validate: function(value) {
|
||||
if($.trim(value) == '') return 'This field is required';
|
||||
},
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-sex').editable({
|
||||
prepend: "not selected",
|
||||
mode: 'inline',
|
||||
source: [
|
||||
{value: 1, text: 'Male'},
|
||||
{value: 2, text: 'Female'}
|
||||
],
|
||||
display: function(value, sourceData) {
|
||||
var colors = {"": "#98a6ad", 1: "#5fbeaa", 2: "#5d9cec"},
|
||||
elem = $.grep(sourceData, function(o){return o.value == value;});
|
||||
|
||||
if(elem.length) {
|
||||
$(this).text(elem[0].text).css("color", colors[value]);
|
||||
} else {
|
||||
$(this).empty();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('#inline-status').editable({mode: 'inline'});
|
||||
|
||||
$('#inline-group').editable({
|
||||
showbuttons: false,
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-dob').editable({mode: 'inline'});
|
||||
$('#inline-event').editable({mode: 'inline'});
|
||||
|
||||
$('#inline-comments').editable({
|
||||
showbuttons: 'bottom',
|
||||
mode: 'inline'
|
||||
});
|
||||
|
||||
$('#inline-fruits').editable({
|
||||
pk: 1,
|
||||
limit: 3,
|
||||
source: [
|
||||
{value: 1, text: 'banana'},
|
||||
{value: 2, text: 'peach'},
|
||||
{value: 3, text: 'apple'},
|
||||
{value: 4, text: 'watermelon'},
|
||||
{value: 5, text: 'orange'}
|
||||
],
|
||||
mode: 'inline'
|
||||
});
|
||||
}else{
|
||||
destroy_all();
|
||||
$('#inline-username').editable({
|
||||
type: 'text',
|
||||
pk: 1,
|
||||
name: 'username',
|
||||
title: 'Enter username'
|
||||
});
|
||||
|
||||
$('#inline-firstname').editable({
|
||||
validate: function(value) {
|
||||
if($.trim(value) == '') return 'This field is required';
|
||||
}
|
||||
});
|
||||
|
||||
$('#inline-sex').editable({
|
||||
prepend: "not selected",
|
||||
source: [
|
||||
{value: 1, text: 'Male'},
|
||||
{value: 2, text: 'Female'}
|
||||
],
|
||||
display: function(value, sourceData) {
|
||||
var colors = {"": "#98a6ad", 1: "#5fbeaa", 2: "#5d9cec"},
|
||||
elem = $.grep(sourceData, function(o){return o.value == value;});
|
||||
|
||||
if(elem.length) {
|
||||
$(this).text(elem[0].text).css("color", colors[value]);
|
||||
} else {
|
||||
$(this).empty();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('#inline-status').editable();
|
||||
|
||||
$('#inline-group').editable({
|
||||
showbuttons: false
|
||||
});
|
||||
|
||||
$('#inline-dob').editable();
|
||||
$('#inline-event').editable();
|
||||
|
||||
$('#inline-comments').editable({
|
||||
showbuttons: 'bottom'
|
||||
});
|
||||
|
||||
$('#inline-fruits').editable({
|
||||
pk: 1,
|
||||
limit: 3,
|
||||
source: [
|
||||
{value: 1, text: 'banana'},
|
||||
{value: 2, text: 'peach'},
|
||||
{value: 3, text: 'apple'},
|
||||
{value: 4, text: 'watermelon'},
|
||||
{value: 5, text: 'orange'}
|
||||
]
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function destroy_all(){
|
||||
$('#inline-username').editable('destroy');
|
||||
$('#inline-firstname').editable('destroy');
|
||||
$('#inline-sex').editable('destroy');
|
||||
$('#inline-status').editable('destroy');
|
||||
$('#inline-group').editable('destroy');
|
||||
$('#inline-dob').editable('destroy');
|
||||
$('#inline-event').editable('destroy');
|
||||
$('#inline-comments').editable('destroy');
|
||||
$('#inline-fruits').editable('destroy');
|
||||
}
|
||||
|
||||
})(jQuery);
|
Reference in New Issue
Block a user