g-input-text g-input-text dark example
<div class="g-input-text">
<label for="input-dark">Dark Example</label>
<input id="input-dark" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-dark').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
includeClearIcon: true,
value: null,
addPrefix: false,
prefix: null,
});
})
});
</script>g-input-text g-input-text light example
<div class="g-input-text">
<label for="input-light">Light Example</label>
<input id="input-light" name="g-textbox" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-light').GlinttTextBox({
theme: 'light',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script>g-input-text g-input-text medium example
<div class="g-input-text">
<label for="input-medium">Medium Example</label>
<input id="input-medium" name="g-textbox" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#input-medium').GlinttTextBox({
theme: 'medium',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script>g-input-text-disabled g-input-text-disabled dark example
<div class="g-input-text">
<label for="input-dark-disabled">Dark Disabled Example</label>
<input id="input-dark-disabled" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-dark-disabled').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: false,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script>g-input-text g-input-text light example
<div class="g-input-text required">
<label for="input-light">Light Example</label>
<input id="input-light-required" name="g-textbox" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-light-required').GlinttTextBox({
theme: 'light',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script>g-input-text g-input-text medium example
<input id="input-login" name="g-textbox" class="g-textbox g-form login-username" />
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#input-login').GlinttTextBox({
theme: 'medium',
placeholder: 'username',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script>g-textbox-filter g-textbox-filter example
<input id="input-filter" name="g-textbox" class="g-textbox g-form g-textbox-filter" />
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#input-filter').GlinttTextBox({
theme: 'medium',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script><div class="g-input-text">
<label for="input-dark">Dark Example</label>
<input id="input-dark" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-dark').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
includeClearIcon: true,
value: null,
addPrefix: false,
prefix: null,
});
})
});
</script><div class="g-input-text">
<label for="input-light">Light Example</label>
<input id="input-light" name="g-textbox" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-light').GlinttTextBox({
theme: 'light',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script><div class="g-input-text">
<label for="input-medium">Medium Example</label>
<input id="input-medium" name="g-textbox" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#input-medium').GlinttTextBox({
theme: 'medium',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script><div class="g-input-text">
<label for="input-dark-disabled">Dark Disabled Example</label>
<input id="input-dark-disabled" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-dark-disabled').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: false,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script><div class="g-input-text required">
<label for="input-light">Light Example</label>
<input id="input-light-required" name="g-textbox" class="g-textbox g-form" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('input#input-light-required').GlinttTextBox({
theme: 'light',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script><input id="input-login" name="g-textbox" class="g-textbox g-form login-username" />
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#input-login').GlinttTextBox({
theme: 'medium',
placeholder: 'username',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script><input id="input-filter" name="g-textbox" class="g-textbox g-form g-textbox-filter" />
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#input-filter').GlinttTextBox({
theme: 'medium',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: true,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
});
});
});
</script>g-textbox-light g-textbox-light example
<div class="g-input-container g-input-light">
<div class="g-input-wrapper">
<input id="light_example" name="g-textbox" class="g-textbox" />
<span class="g-icon g-icon-tools-pesquisa"></span>
</div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#light_example').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: false,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
bind: [{
type: 'onTimeout',
callback: function(e) {
alert("Glinttology escreveu: " + e);
}
},
{
type: 'onEnter',
callback: function(e) {
alert("Foram escritos 3 caracteres");
}
}
]
});
});
});
</script>g-textbox-medium g-textbox-medium example
<div class="g-input-container g-input-medium">
<div class="g-input-wrapper">
<input id="medium_example" name="g-textbox" class="g-textbox" />
<span class="g-icon g-icon-tools-pesquisa"></span>
</div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#medium_example').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: false,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
onTextChanged: function(value) {
}
});
});
});
</script>g-textbox-dark g-textbox-dark example
<div class="g-input-container g-input-dark">
<div class="g-input-wrapper">
<input id="dark_example" name="g-textbox" class="g-textbox" />
<span class="g-icon g-icon-tools-pesquisa"></span>
</div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#dark_example').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: false,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
onTextChanged: function(value) {
}
});
});
});
</script>g-calendar g-calendar example
<div class="g-content dark no-radius" style="width:200px">
<!--Esta div é meramente para demonstração não incluir exatamente igual -->
<div id="agenda_calendar" class="g-calendar"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#agenda_calendar').GlinttCalendar({
id: 'agenda_calendarid',
dateFormat: "dd-mm-yy",
mobileDateFormat: "dd-MM-yy",
disabled: true,
beforeShowDay: function(date) {
return [true, 'day'];
},
onSelect: function(dateText, elem) {
setTimeout(function() {
loadDummy();
}, 50);
}
});
});
});
</script>g-calendar light-dark g-calendar light-dark example
<div class="g-content dark no-radius" style="width:200px">
<!--Esta div é meramente para demonstração não incluir exatamente igual -->
<div id="agenda_calendar_light_dark" class="g-calendar light-dark"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#agenda_calendar_light_dark').GlinttCalendar({
id: 'agenda_calendarid',
dateFormat: "dd-mm-yy",
mobileDateFormat: "dd-MM-yy",
disabled: true,
beforeShowDay: function(date) {
return [true, 'day'];
},
onSelect: function(dateText, elem) {
setTimeout(function() {
loadDummy();
}, 50);
}
});
});
});
</script>g-gcheckbox g-gcheckbox g-checkbox com glinttcheckbox
<div id="g_checkbox_1"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_1').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'dark',
labelUnique: 'GlinttCheckBox',
onSelectionChanged: function(element, value) {
}
});
});
});
</script>g-gcheckbox circle g-gcheckbox g-checkbox com glinttcheckbox em circulo
<div id="g_checkbox_circle" class="circle"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_circle').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxCircle',
onSelectionChanged: function(element, value) {
}
});
});
});
</script>g-gcheckbox md g-gcheckbox g-checkbox com glinttcheckbox md
<div id="g_checkbox_md" class="g-md"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_md').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'dark',
labelUnique: 'GlinttCheckBox',
onSelectionChanged: function(element, value) {
}
});
});
});
</script>g-gcheckbox lg g-gcheckbox g-checkbox com glinttcheckbox lg
<div id="g_checkbox_lg" class="g-lg"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_lg').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'dark',
labelUnique: 'GlinttCheckBox',
onSelectionChanged: function(element, value) {
}
});
});
});
</script>g-gcheckbox circle g-gcheckbox g-checkbox com glinttcheckbox em circulo
<div id="g_checkbox_circle_md" class="circle g-md"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_circle_md').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxCircle',
onSelectionChanged: function(element, value) {
}
});
});
});
</script>g-gcheckbox circle g-gcheckbox g-checkbox com glinttcheckbox em circulo
<div id="g_checkbox_circle_lg" class="circle g-lg"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_circle_lg').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxCircle',
onSelectionChanged: function(element, value) {
}
});
});
});
</script>g-gcheckbox circle g-gcheckbox g-checkbox com glinttcheckbox em circulo
<div id="g_checkbox_light_lg" class="circle g-lg light"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_light_lg').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxLightCircle'
});
});
});
</script><div id="g_checkbox_1"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_1').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'dark',
labelUnique: 'GlinttCheckBox',
onSelectionChanged: function(element, value) {
}
});
});
});
</script><div id="g_checkbox_circle" class="circle"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_circle').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxCircle',
onSelectionChanged: function(element, value) {
}
});
});
});
</script><div id="g_checkbox_md" class="g-md"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_md').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'dark',
labelUnique: 'GlinttCheckBox',
onSelectionChanged: function(element, value) {
}
});
});
});
</script><div id="g_checkbox_lg" class="g-lg"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_lg').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'dark',
labelUnique: 'GlinttCheckBox',
onSelectionChanged: function(element, value) {
}
});
});
});
</script><div id="g_checkbox_circle_md" class="circle g-md"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_circle_md').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxCircle',
onSelectionChanged: function(element, value) {
}
});
});
});
</script><div id="g_checkbox_circle_lg" class="circle g-lg"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_circle_lg').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxCircle',
onSelectionChanged: function(element, value) {
}
});
});
});
</script><div id="g_checkbox_light_lg" class="circle g-lg light"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_checkbox_light_lg').GlinttCheckBox({
initialValue: false,
isEditable: true,
theme: 'medium',
labelUnique: 'GlinttCheckBoxLightCircle'
});
});
});
</script>g-chips g-chips example
<div id="chips"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
i18n.msgStore.GLINTT_CHIPS_CLEAN_SEARCH = "Limpar Pesquisa";
var options = {
dropDownSearch: {
dataSource: [{
"Name": "Black"
}, {
"Name": "Blue"
}, {
"Name": "Brown"
}, {
"Name": "Red"
}, {
"Name": "White"
}, {
"Name": "Yellow"
}],
textKey: 'Name',
valueKey: 'Name',
visibleItemsCount: 5,
placeholder: "editar texto"
},
dropDownChooser: {
dataSource: [{
"Texto": "Legumes",
"Id": "LEG",
"dataSource": [
"Couve",
"Alface",
"Ervilha"
]
},
{
"Texto": "Legumes2",
"Id": "LEG2",
"dataSource": [
"Couve",
"Alface",
"Ervilha"
]
},
{
"Texto": "Carros",
"Id": "CAR",
"dataSource": [
"BMW",
"Mercedez",
"Tesla",
"BMW1",
"Mercedez1",
"Tesla1",
"BMW2",
"Mercedez2",
"Tesla2"
]
}
],
textKey: "Texto",
valueKey: "Id",
visibleItemsCount: 2,
placeholder: "selecionar variável",
mode: 'dropdown',
selectionChanged: function(ev, ui) {
//console.log(ui);
}
}
}
var chipsGroup = ControlsManager.addGlinttChips('chips', "", options);
});
});
</script>g-chips multiselection g-chips multiselection example
<div id="chipsMulti"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var options = {
dropDownSearch: {
dataSource: [{
"Name": "Black"
}, {
"Name": "Blue"
}, {
"Name": "Brown"
}, {
"Name": "Red"
}, {
"Name": "White"
}, {
"Name": "Yellow"
}],
textKey: 'Name',
valueKey: 'Name',
placeholder: "editar texto",
multiSelection: {
enabled: true,
showCheckboxes: true,
itemSeparator: ', '
},
selectionChanged: function(ev, ui) {
console.log(ui);
}
},
dropDownChooser: {
dataSource: [{
"Texto": "Legumes",
"Id": "LEG",
"dataSource": [
"Couve",
"Alface",
"Ervilha"
]
},
{
"Texto": "Carros",
"Id": "CAR",
"dataSource": [
"BMW",
"Mercedez",
"Tesla"
]
}
],
textKey: "Texto",
valueKey: "Id"
}
}
var chips = ControlsManager.addGlinttChips('chipsMulti', "", options)
});
});
</script>g-chips g-chips example
<div id="chipsGroup"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var options = {
dropDownSearch: {
dataSource: [{
"Name": "Black",
"Group": "Dark"
}, {
"Name": "Blue",
"Group": "Light"
}, {
"Name": "Brown",
"Group": "Dark"
}, {
"Name": "Red",
"Group": "Dark"
}, {
"Name": "White",
"Group": "Light"
}, {
"Name": "Yellow",
"Group": "Light"
}],
textKey: 'Name',
valueKey: 'Name',
multiSelection: {
enabled: true,
showCheckboxes: true,
itemSeparator: ', '
},
placeholder: "editar texto",
grouping: {
key: "Group"
},
selectionChanged: function(ev, ui) {
console.log(ui);
}
},
dropDownChooser: {
dataSource: [{
"Texto": "Cozinha",
"Id": "COZ",
"dataSource": [{
"Name": "Banana",
"Group": "Fruta"
}, {
"Name": "Maça",
"Group": "Fruta"
}, {
"Name": "Couve",
"Group": "Legumes"
}, {
"Name": "Ervilha",
"Group": "Legumes"
}]
},
{
"Texto": "Carros",
"Id": "CAR",
"dataSource": [{
"Name": "Ford",
"Group": "Misto"
}, {
"Name": "Renault",
"Group": "Misto"
}, {
"Name": "Ferrari",
"Group": "Desportivo"
}, {
"Name": "Buggati",
"Group": "Desportivo"
}]
}
],
textKey: "Texto",
valueKey: "Id"
}
}
var chipsGroup = ControlsManager.addGlinttChips('chipsGroup', "", options);
});
});
</script>g-chips g-chips example
<div id="chips-no-prop"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var options = {
dropDownSearch: {
dataSource: [{
"Name": "Black"
}, {
"Name": "Blue"
}, {
"Name": "Brown"
}, {
"Name": "Red"
}, {
"Name": "White"
}, {
"Name": "Yellow"
}],
textKey: 'Name',
valueKey: 'Name',
placeholder: "editar texto",
selectionChanged: function(ev, ui) {
console.log(ui);
}
}
}
var chipsGroup = ControlsManager.addGlinttChips('chips-no-prop', "", options);
});
});
</script>g-chips container g-chips example
<div id="chips-container"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var options = {
dropDownSearch: {
placeholder: "editar texto",
selectionChanged: function(ev, ui) {
console.log(ui);
},
textKey: "Texto",
valueKey: "Id"
},
dropDownChooser: {
dataSource: [{
"Texto": "Legumes",
"Id": "LEG",
"dataSource": [{
"Texto": "Couve",
"Id": "COU"
},
{
"Texto": "Alface",
"Id": "ALF"
},
{
"Texto": "Ervilha",
"Id": "ERV"
}
]
},
{
"Texto": "Carros",
"Id": "CAR",
"dataSource": [{
"Texto": "BMW",
"Id": "BMW"
},
{
"Texto": "Mercedez",
"Id": "MER"
},
{
"Texto": "Tesla",
"Id": "TES"
}
]
}
],
textKey: "Texto",
valueKey: "Id"
},
initialSelectedChips: [{
"Texto": "Couve",
"Id": "COU"
},
{
"Texto": "Ervilha",
"Id": "ERV"
},
{
"Texto": "Tesla",
"Id": "TES"
},
{
"Texto": "Super Cenas",
"Id": "SUC"
}
],
input: {
showSelected: true,
},
keepDomain: false
}
var chipsContainerManager = ControlsManager.addGlinttChips('chips-container', "", options);
});
});
</script>g-chips multidomain keepdomain g-chips example
<div id="chips-multidomain-keepdomain"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var options = {
dropDownSearch: {
placeholder: "editar texto",
selectionChanged: function(ev, ui) {
console.log(ui);
}
},
dropDownChooser: {
dataSource: [{
"Texto": "Legumes",
"Id": "LEG",
"dataSource": [
"Couve",
"Alface",
"Ervilha"
]
},
{
"Texto": "Carros",
"Id": "CAR",
"dataSource": [
"BMW",
"Mercedez",
"Tesla"
]
}
],
textKey: "Texto",
valueKey: "Id"
},
showSelectedList: "bottom"
}
var chipsGroup = ControlsManager.addGlinttChips('chips-multidomain-keepdomain', "", options);
});
});
</script>g-chips multidomain keepdomain right g-chips example
<div id="chips-multidomain-keepdomain-right"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var options = {
dropDownSearch: {
dataSource: [{
"Texto": "Legumes",
"Id": "LEG",
},
{
"Texto": "Carros",
"Id": "CAR",
},
{
"Texto": "Windows",
"Id": "WIN",
},
{
"Texto": "Apple",
"Id": "Apl",
}
],
textKey: 'Texto',
valueKey: 'Id',
placeholder: "editar texto",
selectionChanged: function(ev, ui) {
console.log(ui);
},
multiSelection: {
enabled: true
}
},
input: {
theme: 'light-dark'
},
showSelectedList: "right",
includeCleanSearch: false
}
var chipsGroup = ControlsManager.addGlinttChips('chips-multidomain-keepdomain-right', "", options);
});
});
</script><div id="g_glinttcombo" class="g-glinttcombo light-dark"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var GlinttComboOptions = {};
GlinttComboOptions.id = "g_glinttcombo_id";
GlinttComboOptions.textProperty = "ProductName";
GlinttComboOptions.valueProperty = "ID";
GlinttComboOptions.prefix = undefined;
GlinttComboOptions.filteringType = "remote";
GlinttComboOptions.autoComplete = true;
GlinttComboOptions.showDropDownButton = false;
GlinttComboOptions.dropDownOnFocus = true;
GlinttComboOptions.mode = "editable";
GlinttComboOptions.enableClearButton = true;
GlinttComboOptions.nullText = '<nºde écran>';
GlinttComboOptions.isFullComboBox = false;
GlinttComboOptions.theme = "MEDIUM";
GlinttComboOptions.itemTemplate = null;
GlinttComboOptions.autoSelectFirstMatch = false;
GlinttComboOptions.dataSource = "http://igniteui.com/api/products?callback=?";
GlinttComboOptions.responseDataKey = "d.results.Results";
GlinttComboOptions.responseTotalRecCountKey = "d.results.Count";
GlinttComboOptions.visibleItemsCount = 5;
GlinttComboOptions.loadOnDemandSettings = {
enabled: true,
pageSize: 6
};
GlinttComboOptions.dataBound = function(evt, ui) {
console.log("DATABOUND");
};
GlinttComboOptions.itemsRendered = function(evt, ui) {
console.log("ITEMSRENDERED");
}
GlinttComboOptions.multiSelection = {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
};
var firstCombo = ControlsManager.addGlinttCombo('#g_glinttcombo', 'GRUPO', GlinttComboOptions);
firstCombo.setSelectedItems([{
"ID": 8,
"ProductName": "Northwoods Cranberry Sauce",
"SupplierID": 3,
"CategoryID": 2,
"QuantityPerUnit": "12 - 12 oz jars",
"UnitPrice": 40,
"UnitsInStock": 6,
"UnitsOnOrder": 0,
"ReorderLevel": 0,
"SupplierName": "Grandma Kelly's Homestead",
"CategoryName": "Condiments",
"Rating": 4,
"Discontinued": false,
"CategoryImageUrl": "http://www.igniteui.com/images/samples/nw/categories/2.png"
},
/*{"ID":22,"ProductName":"Gustaf's Knäckebröd","SupplierID":9,"CategoryID":5,"QuantityPerUnit":"24 - 500 g pkgs.","UnitPrice":21,"UnitsInStock":104,"UnitsOnOrder":0,"ReorderLevel":25,"SupplierName":"PB Knäckebröd AB","CategoryName":"Grains/Cereals","Rating":1,"Discontinued":false,"CategoryImageUrl":"http://www.igniteui.com/images/samples/nw/categories/5.png"}*/
], true);
});
});
</script><div id="g_glinttcombo_filter" class="g-glinttcombo-filter"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_filter').GlinttCombo({
id: "g_glinttcombo_id_filter",
name: "g_glinttcombo_name_filter",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: true,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script>g-datepicker-underline g-datepicker-underline
<div id="g_glinttcombo_multi" class="g-glinttcombo-filter-multi"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
data.push({
Id: "All",
Description: "Todos"
});
for (var i = 1; i < 80; i++) {
data.push({
Id: i,
Description: "Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar " + i
});
}
$('#g_glinttcombo_multi').GlinttCombo({
id: "g_glinttcombo_id_multi",
name: "g_glinttcombo_name_multi",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
theme: "MEDIUM",
itemTemplate: null,
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
},
keyAllItem: "All",
onSelectionChanged: function(eve, ui) {
console.log($("#g_glinttcombo_multi").data("GlinttCombo").getSelectedItems(true));
debugger;
},
itemTemplate: "<div class='ellipsis' title='${Description}'>${Description}</div>"
});
});
});
</script>g-datepicker-orange g-datepicker-orange-on-select
<div id="g_glinttcombo_orange" class="g-glinttcombo-filter-multi"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_orange').GlinttCombo({
id: "g_glinttcombo_id_orange",
name: "g_glinttcombo_name_orange",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null,
onSelectionChanged: function() {
}
});
});
});
</script><div id="g_glinttcombo_editable" class="g-glinttcombo"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_editable').GlinttCombo({
id: "g_glinttcombo_id_editable",
name: "g_glinttcombo_name_editable",
dataSource: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
enableSelectAllOption: true,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "editable",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
filteringType: 'local',
autoComplete: false,
theme: "MEDIUM",
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script>g-datepicker-underline blue g-datepicker-underline blue
<div id="g_glinttcombo_multi_blue" class="g-glinttcombo-filter-multi blue"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_multi_blue').GlinttCombo({
id: "g_glinttcombo_id_multi_blue",
name: "g_glinttcombo_name_multi_blue",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: null,
onSelectionChanged: function() {
},
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script>g-datepicker-multi-grouping g-datepicker-multi-grouping
<div id="g_glinttcombo_multi_tooltip" class="g-glinttcombo-filter-multi blue g-tooltip"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var colors = [{
Id: "Black",
Description: "Black",
Type: "Cool"
}, {
Id: "Blue",
Description: "Blue",
Type: "Cool"
}, {
Id: "White",
Description: "White",
Type: null
}, {
Id: "Red",
Description: "Red",
Type: "Not Cool"
}, {
Id: "Green",
Description: "Green",
Type: "Default"
}, ];
$('#g_glinttcombo_multi_tooltip').GlinttCombo({
id: "g_glinttcombo_id_multi_tooltip",
name: "g_glinttcombo_name_multi_tooltip",
hardcodedOptions: [{
Id: "All",
Description: "Todos",
Type: "Todos"
}],
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: null,
onSelectionChanged: function(eve, ui) {
console.log($("#g_glinttcombo_multi_tooltip").data("GlinttCombo").getSelectedItems(true));
},
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
},
keyAllItem: "All",
grouping: {
key: 'Type',
dir: 'desc'
}
});
$('#g_glinttcombo_multi_tooltip').data("GlinttCombo").setDataSource(colors);
});
});
</script>g-datepicker-multi-grouping g-datepicker-multi-grouping
<div id="g_glinttcombo_multi_grouping" class="g-glinttcombo-filter-multi"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_glinttcombo_multi_grouping').GlinttCombo({
id: "g_glinttcombo_multi_rooms_id",
name: "g_glinttcombo_multi_rooms_name",
//hardcodedOptions: [{ "ServiceOfficeCode": "All", "Description": "Todos", "LocalSurgeryServiceDescr": "Todos" }],
textProperty: "IndicatorDescription",
valueProperty: "IndicatorCode",
mode: "dropdown",
showDropDownButton: false,
dropDownOnFocus: true,
enableClearButton: false,
closeDropDownOnSelect: false,
keyAllItem: "All",
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
},
grouping: {
key: 'IndicatorDescriptionGroup'
}
});
var removedItems = [{
"LocalSurgeryServiceCode": "2040000000",
"LocalSurgeryServiceDescr": "Cardiologia - Int.",
"ExtensionData": {},
"Description": "CARDIOLOGIA",
"IsDefault": false,
"NurseOfficeCode": "2040100000",
"ServiceOfficeCode": "2040000000#2040100000"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 1 Sala 1 Sala 1 Sala 1 Sa",
"IsDefault": true,
"NurseOfficeCode": "410001",
"ServiceOfficeCode": "410000#410001"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 9",
"IsDefault": false,
"NurseOfficeCode": "410009",
"ServiceOfficeCode": "410000#410009"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 8",
"IsDefault": false,
"NurseOfficeCode": "410008",
"ServiceOfficeCode": "410000#410008"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 7",
"IsDefault": false,
"NurseOfficeCode": "410007",
"ServiceOfficeCode": "410000#410007"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 6",
"IsDefault": false,
"NurseOfficeCode": "410006",
"ServiceOfficeCode": "410000#410006"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 5",
"IsDefault": false,
"NurseOfficeCode": "410005",
"ServiceOfficeCode": "410000#410005"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 4",
"IsDefault": false,
"NurseOfficeCode": "410004",
"ServiceOfficeCode": "410000#410004"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 3",
"IsDefault": false,
"NurseOfficeCode": "410003",
"ServiceOfficeCode": "410000#410003"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 2",
"IsDefault": true,
"NurseOfficeCode": "410002",
"ServiceOfficeCode": "410000#410002"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Obstetricia",
"IsDefault": false,
"NurseOfficeCode": "420001",
"ServiceOfficeCode": "420000#420001"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Estomatologia",
"IsDefault": false,
"NurseOfficeCode": "420004",
"ServiceOfficeCode": "420000#420004"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Oftalmologia",
"IsDefault": false,
"NurseOfficeCode": "420003",
"ServiceOfficeCode": "420000#420003"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Dermatologia",
"IsDefault": false,
"NurseOfficeCode": "420002",
"ServiceOfficeCode": "420000#420002"
}, {
"LocalSurgeryServiceCode": "440000",
"LocalSurgeryServiceDescr": "BLOCO DE PARTOS",
"ExtensionData": {},
"Description": "BLOCO PARTOS",
"IsDefault": true,
"NurseOfficeCode": "420002",
"ServiceOfficeCode": "440000#420002"
}, {
"LocalSurgeryServiceCode": "440000",
"LocalSurgeryServiceDescr": "BLOCO DE PARTOS",
"ExtensionData": {},
"Description": "BLOCO PARTOS",
"IsDefault": true,
"NurseOfficeCode": "440001",
"ServiceOfficeCode": "440000#440001"
}, {
"LocalSurgeryServiceCode": "450000",
"LocalSurgeryServiceDescr": "BLOCO PRELADA",
"ExtensionData": {},
"Description": "Sala 1 Sala 1 Sala 1 Sala 1 Sa",
"IsDefault": false,
"NurseOfficeCode": "450001",
"ServiceOfficeCode": "450000#450001"
}, {
"LocalSurgeryServiceCode": "450000",
"LocalSurgeryServiceDescr": "BLOCO PRELADA",
"ExtensionData": {},
"Description": "Sala 2",
"IsDefault": false,
"NurseOfficeCode": "450002",
"ServiceOfficeCode": "450000#450002"
}];
$('#g_glinttcombo_multi_grouping').data("GlinttCombo").setDataSource([{
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "02",
"IndicatorDescription": "Peso Ideal",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 3,
"RefValue": null,
"Unit": null,
"UpperLimit": 300,
"UpperLimitTolerance": 300,
"IndicatorDescriptionGroup": "Peso Ideal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": "#1E90FF",
"Derivative": "N",
"IconGraph": "g-icon-tools-legenda-grafico-09",
"IndicatorCode": "053",
"IndicatorDescription": "Altura",
"LowerLimit": 20,
"LowerLimitTolerance": 40,
"Order": 6,
"RefValue": null,
"Unit": "cm",
"UpperLimit": 220,
"UpperLimitTolerance": 300,
"IndicatorDescriptionGroup": "Altura",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": "#123456",
"Derivative": "N",
"IconGraph": "g-icon-tools-legenda-grafico-04",
"IndicatorCode": "003",
"IndicatorDescription": "Frequência Cardíaca",
"LowerLimit": 0,
"LowerLimitTolerance": 50,
"Order": 1,
"RefValue": null,
"Unit": "bpm",
"UpperLimit": 250,
"UpperLimitTolerance": 130,
"IndicatorDescriptionGroup": "Frequência Cardíaca",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "N",
"IconGraph": "g-icon-tools-legenda-grafico-02",
"IndicatorCode": "010",
"IndicatorDescription": "Peso",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 2,
"RefValue": null,
"Unit": "Kg",
"UpperLimit": 200,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Peso",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": null,
"IconGraph": null,
"IndicatorCode": "PERCENTILE#010#8993",
"IndicatorDescription": "Peso dos 0 aos 5",
"LowerLimit": null,
"LowerLimitTolerance": null,
"Order": null,
"RefValue": null,
"Unit": "Kg",
"UpperLimit": null,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Peso",
"IndicatorStartDate": "2014-01-01T00:00:00",
"IndicatorEndDate": "2018-12-31T23:59:59",
"IndicatorPercentile": true
}, {
"ColorGraph": null,
"Derivative": null,
"IconGraph": null,
"IndicatorCode": "PERCENTILE#053#8995",
"IndicatorDescription": "Altura dos 0 aos 5",
"LowerLimit": null,
"LowerLimitTolerance": null,
"Order": null,
"RefValue": null,
"Unit": "cm",
"UpperLimit": null,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Altura",
"IndicatorStartDate": "2014-01-01T00:00:00",
"IndicatorEndDate": "2018-12-31T23:59:59",
"IndicatorPercentile": true
}, {
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "0999",
"IndicatorDescription": "Superfície Corporal",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 4,
"RefValue": null,
"Unit": null,
"UpperLimit": 6,
"UpperLimitTolerance": 6,
"IndicatorDescriptionGroup": "Superfície Corporal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "N",
"IconGraph": null,
"IndicatorCode": "011#012",
"IndicatorDescription": "Tensão Arterial",
"LowerLimit": 10,
"LowerLimitTolerance": 100,
"Order": 9,
"RefValue": null,
"Unit": "mmHg",
"UpperLimit": 300,
"UpperLimitTolerance": 90,
"IndicatorDescriptionGroup": "Tensão Arterial",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "09999",
"IndicatorDescription": "Área Corporal",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 1,
"RefValue": null,
"Unit": null,
"UpperLimit": 6,
"UpperLimitTolerance": 6,
"IndicatorDescriptionGroup": "Área Corporal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "099",
"IndicatorDescription": "Índice de Massa Corporal",
"LowerLimit": 10,
"LowerLimitTolerance": 10,
"Order": 3,
"RefValue": null,
"Unit": null,
"UpperLimit": 50,
"UpperLimitTolerance": 50,
"IndicatorDescriptionGroup": "Índice de Massa Corporal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": null,
"IconGraph": null,
"IndicatorCode": "PERCENTILE#099#9002",
"IndicatorDescription": "IMC dos 0 aos 5",
"LowerLimit": null,
"LowerLimitTolerance": null,
"Order": null,
"RefValue": null,
"Unit": null,
"UpperLimit": null,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Índice de Massa Corporal",
"IndicatorStartDate": "2014-01-01T00:00:00",
"IndicatorEndDate": "2018-12-31T23:59:59",
"IndicatorPercentile": true
}]);
});
});
</script>g-glinttcombo light g-glinttcombo light
<div id="g_glinttcombo_light" class="g-glinttcombo light"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_light').GlinttCombo({
id: "g_glinttcombo_light_id",
name: "g_glinttcombo_light_name",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script>g-glinttcombo clear g-glinttcombo clear
<div id="g_glinttcombo_clear" class="g-glinttcombo light-dark"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_clear').GlinttCombo({
id: "g_glinttcombo_id_clear",
name: "g_glinttcombo_name_clear",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: true,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null,
onSelectionChanged: function() {
},
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script>g-glinttcombo dark g-glinttcombo dark
<div id="g_glinttcombo_dark" class="g-glinttcombo dark"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_dark').GlinttCombo({
id: "g_glinttcombo_dark_id",
name: "g_glinttcombo_dark_name",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script>g-datepicker-single-grouping g-datepicker-signel-grouping
<div id="g_glinttcombo_single_grouping" class="g-glinttcombo-filter-multi"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var colors = [{
Name: "Black",
Type: "Cool"
}, {
Name: "Blue",
Type: "Cool"
}, {
Name: "White",
Type: "Cool"
}, {
Name: "Red",
Type: "Not Cool"
}, {
Name: "Green",
Type: "Not Cool"
},
{
Name: "Yellow",
Type: null
}
];
$('#g_glinttcombo_single_grouping').GlinttCombo({
id: "g_glinttcombo_id_single_grouping",
name: "g_glinttcombo_name_single_grouping",
hardcodedOptions: colors,
textProperty: "Name",
valueProperty: "Name",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "editable",
theme: "MEDIUM",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: null,
filteringType: "local",
highlightMatchesMode: "multi",
filteringCondition: "contains",
grouping: {
key: 'Type',
dir: 'desc'
}
});
});
});
</script>g-glinttcombo light prefix g-glinttcombo light prefix
<div id="g_glinttcombo_light_prefix" class="g-glinttcombo light"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_light_prefix').GlinttCombo({
id: "g_glinttcombo_light_prefix_id",
name: "g_glinttcombo_light_prefix_name",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: "Prefixo",
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script>g-glinttcombo disabled g-glinttcombo disabled
<div id="g_glinttcombo_disabled" class="g-glinttcombo-filter-multi"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 80; i++) {
if (i < 3) {
data.push({
Id: i,
Description: "Esta unidade esta a ver se isto está funcionar " + i,
Disable: true
});
} else {
data.push({
Id: i,
Description: "Esta unidade esta a ver se isto está funcionar " + i,
Disable: false
});
}
}
$('#g_glinttcombo_disabled').GlinttCombo({
id: "g_glinttcombo_id_disabled",
name: "g_glinttcombo_name_disabled",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
disableProperty: "Disable",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: "<span>${Description}</span>",
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script><div id="g_glinttcombo" class="g-glinttcombo light-dark"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var GlinttComboOptions = {};
GlinttComboOptions.id = "g_glinttcombo_id";
GlinttComboOptions.textProperty = "ProductName";
GlinttComboOptions.valueProperty = "ID";
GlinttComboOptions.prefix = undefined;
GlinttComboOptions.filteringType = "remote";
GlinttComboOptions.autoComplete = true;
GlinttComboOptions.showDropDownButton = false;
GlinttComboOptions.dropDownOnFocus = true;
GlinttComboOptions.mode = "editable";
GlinttComboOptions.enableClearButton = true;
GlinttComboOptions.nullText = '<nºde écran>';
GlinttComboOptions.isFullComboBox = false;
GlinttComboOptions.theme = "MEDIUM";
GlinttComboOptions.itemTemplate = null;
GlinttComboOptions.autoSelectFirstMatch = false;
GlinttComboOptions.dataSource = "http://igniteui.com/api/products?callback=?";
GlinttComboOptions.responseDataKey = "d.results.Results";
GlinttComboOptions.responseTotalRecCountKey = "d.results.Count";
GlinttComboOptions.visibleItemsCount = 5;
GlinttComboOptions.loadOnDemandSettings = {
enabled: true,
pageSize: 6
};
GlinttComboOptions.dataBound = function(evt, ui) {
console.log("DATABOUND");
};
GlinttComboOptions.itemsRendered = function(evt, ui) {
console.log("ITEMSRENDERED");
}
GlinttComboOptions.multiSelection = {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
};
var firstCombo = ControlsManager.addGlinttCombo('#g_glinttcombo', 'GRUPO', GlinttComboOptions);
firstCombo.setSelectedItems([{
"ID": 8,
"ProductName": "Northwoods Cranberry Sauce",
"SupplierID": 3,
"CategoryID": 2,
"QuantityPerUnit": "12 - 12 oz jars",
"UnitPrice": 40,
"UnitsInStock": 6,
"UnitsOnOrder": 0,
"ReorderLevel": 0,
"SupplierName": "Grandma Kelly's Homestead",
"CategoryName": "Condiments",
"Rating": 4,
"Discontinued": false,
"CategoryImageUrl": "http://www.igniteui.com/images/samples/nw/categories/2.png"
},
/*{"ID":22,"ProductName":"Gustaf's Knäckebröd","SupplierID":9,"CategoryID":5,"QuantityPerUnit":"24 - 500 g pkgs.","UnitPrice":21,"UnitsInStock":104,"UnitsOnOrder":0,"ReorderLevel":25,"SupplierName":"PB Knäckebröd AB","CategoryName":"Grains/Cereals","Rating":1,"Discontinued":false,"CategoryImageUrl":"http://www.igniteui.com/images/samples/nw/categories/5.png"}*/
], true);
});
});
</script><div id="g_glinttcombo_filter" class="g-glinttcombo-filter"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_filter').GlinttCombo({
id: "g_glinttcombo_id_filter",
name: "g_glinttcombo_name_filter",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: true,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script><div id="g_glinttcombo_multi" class="g-glinttcombo-filter-multi"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
data.push({
Id: "All",
Description: "Todos"
});
for (var i = 1; i < 80; i++) {
data.push({
Id: i,
Description: "Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar Esta unidade esta a ver se isto está funcionar " + i
});
}
$('#g_glinttcombo_multi').GlinttCombo({
id: "g_glinttcombo_id_multi",
name: "g_glinttcombo_name_multi",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
theme: "MEDIUM",
itemTemplate: null,
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
},
keyAllItem: "All",
onSelectionChanged: function(eve, ui) {
console.log($("#g_glinttcombo_multi").data("GlinttCombo").getSelectedItems(true));
debugger;
},
itemTemplate: "<div class='ellipsis' title='${Description}'>${Description}</div>"
});
});
});
</script><div id="g_glinttcombo_orange" class="g-glinttcombo-filter-multi"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_orange').GlinttCombo({
id: "g_glinttcombo_id_orange",
name: "g_glinttcombo_name_orange",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null,
onSelectionChanged: function() {
}
});
});
});
</script><div id="g_glinttcombo_editable" class="g-glinttcombo"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_editable').GlinttCombo({
id: "g_glinttcombo_id_editable",
name: "g_glinttcombo_name_editable",
dataSource: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
enableSelectAllOption: true,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "editable",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
filteringType: 'local',
autoComplete: false,
theme: "MEDIUM",
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script><div id="g_glinttcombo_multi_blue" class="g-glinttcombo-filter-multi blue"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_multi_blue').GlinttCombo({
id: "g_glinttcombo_id_multi_blue",
name: "g_glinttcombo_name_multi_blue",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: null,
onSelectionChanged: function() {
},
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script><div id="g_glinttcombo_multi_tooltip" class="g-glinttcombo-filter-multi blue g-tooltip"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var colors = [{
Id: "Black",
Description: "Black",
Type: "Cool"
}, {
Id: "Blue",
Description: "Blue",
Type: "Cool"
}, {
Id: "White",
Description: "White",
Type: null
}, {
Id: "Red",
Description: "Red",
Type: "Not Cool"
}, {
Id: "Green",
Description: "Green",
Type: "Default"
}, ];
$('#g_glinttcombo_multi_tooltip').GlinttCombo({
id: "g_glinttcombo_id_multi_tooltip",
name: "g_glinttcombo_name_multi_tooltip",
hardcodedOptions: [{
Id: "All",
Description: "Todos",
Type: "Todos"
}],
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: null,
onSelectionChanged: function(eve, ui) {
console.log($("#g_glinttcombo_multi_tooltip").data("GlinttCombo").getSelectedItems(true));
},
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
},
keyAllItem: "All",
grouping: {
key: 'Type',
dir: 'desc'
}
});
$('#g_glinttcombo_multi_tooltip').data("GlinttCombo").setDataSource(colors);
});
});
</script><div id="g_glinttcombo_multi_grouping" class="g-glinttcombo-filter-multi"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_glinttcombo_multi_grouping').GlinttCombo({
id: "g_glinttcombo_multi_rooms_id",
name: "g_glinttcombo_multi_rooms_name",
//hardcodedOptions: [{ "ServiceOfficeCode": "All", "Description": "Todos", "LocalSurgeryServiceDescr": "Todos" }],
textProperty: "IndicatorDescription",
valueProperty: "IndicatorCode",
mode: "dropdown",
showDropDownButton: false,
dropDownOnFocus: true,
enableClearButton: false,
closeDropDownOnSelect: false,
keyAllItem: "All",
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
},
grouping: {
key: 'IndicatorDescriptionGroup'
}
});
var removedItems = [{
"LocalSurgeryServiceCode": "2040000000",
"LocalSurgeryServiceDescr": "Cardiologia - Int.",
"ExtensionData": {},
"Description": "CARDIOLOGIA",
"IsDefault": false,
"NurseOfficeCode": "2040100000",
"ServiceOfficeCode": "2040000000#2040100000"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 1 Sala 1 Sala 1 Sala 1 Sa",
"IsDefault": true,
"NurseOfficeCode": "410001",
"ServiceOfficeCode": "410000#410001"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 9",
"IsDefault": false,
"NurseOfficeCode": "410009",
"ServiceOfficeCode": "410000#410009"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 8",
"IsDefault": false,
"NurseOfficeCode": "410008",
"ServiceOfficeCode": "410000#410008"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 7",
"IsDefault": false,
"NurseOfficeCode": "410007",
"ServiceOfficeCode": "410000#410007"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 6",
"IsDefault": false,
"NurseOfficeCode": "410006",
"ServiceOfficeCode": "410000#410006"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 5",
"IsDefault": false,
"NurseOfficeCode": "410005",
"ServiceOfficeCode": "410000#410005"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 4",
"IsDefault": false,
"NurseOfficeCode": "410004",
"ServiceOfficeCode": "410000#410004"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 3",
"IsDefault": false,
"NurseOfficeCode": "410003",
"ServiceOfficeCode": "410000#410003"
}, {
"LocalSurgeryServiceCode": "410000",
"LocalSurgeryServiceDescr": "BLOCO OPERATORIO CENTRAL BLOCO OPERATO",
"ExtensionData": {},
"Description": "Sala 2",
"IsDefault": true,
"NurseOfficeCode": "410002",
"ServiceOfficeCode": "410000#410002"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Obstetricia",
"IsDefault": false,
"NurseOfficeCode": "420001",
"ServiceOfficeCode": "420000#420001"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Estomatologia",
"IsDefault": false,
"NurseOfficeCode": "420004",
"ServiceOfficeCode": "420000#420004"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Oftalmologia",
"IsDefault": false,
"NurseOfficeCode": "420003",
"ServiceOfficeCode": "420000#420003"
}, {
"LocalSurgeryServiceCode": "420000",
"LocalSurgeryServiceDescr": "BLOCO PERIFÉRICO",
"ExtensionData": {},
"Description": "Sala de Dermatologia",
"IsDefault": false,
"NurseOfficeCode": "420002",
"ServiceOfficeCode": "420000#420002"
}, {
"LocalSurgeryServiceCode": "440000",
"LocalSurgeryServiceDescr": "BLOCO DE PARTOS",
"ExtensionData": {},
"Description": "BLOCO PARTOS",
"IsDefault": true,
"NurseOfficeCode": "420002",
"ServiceOfficeCode": "440000#420002"
}, {
"LocalSurgeryServiceCode": "440000",
"LocalSurgeryServiceDescr": "BLOCO DE PARTOS",
"ExtensionData": {},
"Description": "BLOCO PARTOS",
"IsDefault": true,
"NurseOfficeCode": "440001",
"ServiceOfficeCode": "440000#440001"
}, {
"LocalSurgeryServiceCode": "450000",
"LocalSurgeryServiceDescr": "BLOCO PRELADA",
"ExtensionData": {},
"Description": "Sala 1 Sala 1 Sala 1 Sala 1 Sa",
"IsDefault": false,
"NurseOfficeCode": "450001",
"ServiceOfficeCode": "450000#450001"
}, {
"LocalSurgeryServiceCode": "450000",
"LocalSurgeryServiceDescr": "BLOCO PRELADA",
"ExtensionData": {},
"Description": "Sala 2",
"IsDefault": false,
"NurseOfficeCode": "450002",
"ServiceOfficeCode": "450000#450002"
}];
$('#g_glinttcombo_multi_grouping').data("GlinttCombo").setDataSource([{
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "02",
"IndicatorDescription": "Peso Ideal",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 3,
"RefValue": null,
"Unit": null,
"UpperLimit": 300,
"UpperLimitTolerance": 300,
"IndicatorDescriptionGroup": "Peso Ideal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": "#1E90FF",
"Derivative": "N",
"IconGraph": "g-icon-tools-legenda-grafico-09",
"IndicatorCode": "053",
"IndicatorDescription": "Altura",
"LowerLimit": 20,
"LowerLimitTolerance": 40,
"Order": 6,
"RefValue": null,
"Unit": "cm",
"UpperLimit": 220,
"UpperLimitTolerance": 300,
"IndicatorDescriptionGroup": "Altura",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": "#123456",
"Derivative": "N",
"IconGraph": "g-icon-tools-legenda-grafico-04",
"IndicatorCode": "003",
"IndicatorDescription": "Frequência Cardíaca",
"LowerLimit": 0,
"LowerLimitTolerance": 50,
"Order": 1,
"RefValue": null,
"Unit": "bpm",
"UpperLimit": 250,
"UpperLimitTolerance": 130,
"IndicatorDescriptionGroup": "Frequência Cardíaca",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "N",
"IconGraph": "g-icon-tools-legenda-grafico-02",
"IndicatorCode": "010",
"IndicatorDescription": "Peso",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 2,
"RefValue": null,
"Unit": "Kg",
"UpperLimit": 200,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Peso",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": null,
"IconGraph": null,
"IndicatorCode": "PERCENTILE#010#8993",
"IndicatorDescription": "Peso dos 0 aos 5",
"LowerLimit": null,
"LowerLimitTolerance": null,
"Order": null,
"RefValue": null,
"Unit": "Kg",
"UpperLimit": null,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Peso",
"IndicatorStartDate": "2014-01-01T00:00:00",
"IndicatorEndDate": "2018-12-31T23:59:59",
"IndicatorPercentile": true
}, {
"ColorGraph": null,
"Derivative": null,
"IconGraph": null,
"IndicatorCode": "PERCENTILE#053#8995",
"IndicatorDescription": "Altura dos 0 aos 5",
"LowerLimit": null,
"LowerLimitTolerance": null,
"Order": null,
"RefValue": null,
"Unit": "cm",
"UpperLimit": null,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Altura",
"IndicatorStartDate": "2014-01-01T00:00:00",
"IndicatorEndDate": "2018-12-31T23:59:59",
"IndicatorPercentile": true
}, {
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "0999",
"IndicatorDescription": "Superfície Corporal",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 4,
"RefValue": null,
"Unit": null,
"UpperLimit": 6,
"UpperLimitTolerance": 6,
"IndicatorDescriptionGroup": "Superfície Corporal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "N",
"IconGraph": null,
"IndicatorCode": "011#012",
"IndicatorDescription": "Tensão Arterial",
"LowerLimit": 10,
"LowerLimitTolerance": 100,
"Order": 9,
"RefValue": null,
"Unit": "mmHg",
"UpperLimit": 300,
"UpperLimitTolerance": 90,
"IndicatorDescriptionGroup": "Tensão Arterial",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "09999",
"IndicatorDescription": "Área Corporal",
"LowerLimit": 0,
"LowerLimitTolerance": 0,
"Order": 1,
"RefValue": null,
"Unit": null,
"UpperLimit": 6,
"UpperLimitTolerance": 6,
"IndicatorDescriptionGroup": "Área Corporal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": "S",
"IconGraph": null,
"IndicatorCode": "099",
"IndicatorDescription": "Índice de Massa Corporal",
"LowerLimit": 10,
"LowerLimitTolerance": 10,
"Order": 3,
"RefValue": null,
"Unit": null,
"UpperLimit": 50,
"UpperLimitTolerance": 50,
"IndicatorDescriptionGroup": "Índice de Massa Corporal",
"IndicatorStartDate": null,
"IndicatorEndDate": null,
"IndicatorPercentile": false
}, {
"ColorGraph": null,
"Derivative": null,
"IconGraph": null,
"IndicatorCode": "PERCENTILE#099#9002",
"IndicatorDescription": "IMC dos 0 aos 5",
"LowerLimit": null,
"LowerLimitTolerance": null,
"Order": null,
"RefValue": null,
"Unit": null,
"UpperLimit": null,
"UpperLimitTolerance": null,
"IndicatorDescriptionGroup": "Índice de Massa Corporal",
"IndicatorStartDate": "2014-01-01T00:00:00",
"IndicatorEndDate": "2018-12-31T23:59:59",
"IndicatorPercentile": true
}]);
});
});
</script><div id="g_glinttcombo_light" class="g-glinttcombo light"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_light').GlinttCombo({
id: "g_glinttcombo_light_id",
name: "g_glinttcombo_light_name",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script><div id="g_glinttcombo_clear" class="g-glinttcombo light-dark"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_clear').GlinttCombo({
id: "g_glinttcombo_id_clear",
name: "g_glinttcombo_name_clear",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: true,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null,
onSelectionChanged: function() {
},
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script><div id="g_glinttcombo_dark" class="g-glinttcombo dark"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_dark').GlinttCombo({
id: "g_glinttcombo_dark_id",
name: "g_glinttcombo_dark_name",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script><div id="g_glinttcombo_single_grouping" class="g-glinttcombo-filter-multi"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var colors = [{
Name: "Black",
Type: "Cool"
}, {
Name: "Blue",
Type: "Cool"
}, {
Name: "White",
Type: "Cool"
}, {
Name: "Red",
Type: "Not Cool"
}, {
Name: "Green",
Type: "Not Cool"
},
{
Name: "Yellow",
Type: null
}
];
$('#g_glinttcombo_single_grouping').GlinttCombo({
id: "g_glinttcombo_id_single_grouping",
name: "g_glinttcombo_name_single_grouping",
hardcodedOptions: colors,
textProperty: "Name",
valueProperty: "Name",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "editable",
theme: "MEDIUM",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: null,
filteringType: "local",
highlightMatchesMode: "multi",
filteringCondition: "contains",
grouping: {
key: 'Type',
dir: 'desc'
}
});
});
});
</script><div id="g_glinttcombo_light_prefix" class="g-glinttcombo light"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 100; i++) {
data.push({
Id: i,
Description: "Unidade " + i
});
}
$('#g_glinttcombo_light_prefix').GlinttCombo({
id: "g_glinttcombo_light_prefix_id",
name: "g_glinttcombo_light_prefix_name",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
prefix: "Prefixo",
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
/*has perfix*/
theme: "MEDIUM",
itemTemplate: null
});
});
});
</script><div id="g_glinttcombo_disabled" class="g-glinttcombo-filter-multi"> </div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var data = [];
for (var i = 1; i < 80; i++) {
if (i < 3) {
data.push({
Id: i,
Description: "Esta unidade esta a ver se isto está funcionar " + i,
Disable: true
});
} else {
data.push({
Id: i,
Description: "Esta unidade esta a ver se isto está funcionar " + i,
Disable: false
});
}
}
$('#g_glinttcombo_disabled').GlinttCombo({
id: "g_glinttcombo_id_disabled",
name: "g_glinttcombo_name_disabled",
hardcodedOptions: data,
textProperty: "Description",
valueProperty: "Id",
disableProperty: "Disable",
prefix: undefined,
showDropDownButton: false,
dropDownOnFocus: true,
mode: "dropdown",
enableClearButton: false,
nullText: '<nºde écran>',
isFullComboBox: false,
itemTemplate: "<span>${Description}</span>",
multiSelection: {
enabled: true,
addWithKeyModifier: false,
showCheckboxes: true,
itemSeparator: ', '
}
});
});
});
</script>crop crop
<div style="width:150px;height:150px;">
<div id="cropp" class="g-crop"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
isLessOrEqualIE9 = true;
var croppicHeaderOptions = {
viewport: {
width: 100,
height: 100
},
enableExif: true
}
ControlsManager.addCrop('#cropp', null, croppicHeaderOptions);
});
});
</script>g-datepicker g-datepicker example
<div>
<span class="g-text-12">Data Início</span>
<div id="datepicker_example" name="g-datepicker" class="g-datepicker"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#datepicker_example').GlinttDatePicker({
theme: 'medium',
format: 'DD/MM/YYYY',
placeholder: '<dd/mm/aaaa>',
iconClass: 'g-icon g-icon-calendario-calendario',
showIcon: true,
showCleanIcon: true,
includeTime: false,
hasPrefix: false,
isEditable: true,
i18n: $.datepicker.regional["es-ES"]
});
});
});
</script>g-datepicker-disabled g-datepicker-disabled example
<div>
<span class="g-text-12">Data Início</span>
<div id="datepicker_example_disabled" name="g-datepicker" class="g-datepicker disabled"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#datepicker_example_disabled').GlinttDatePicker({
theme: 'medium',
format: 'DD-MM-YYYY',
placeholder: '<dd/mm/aaaa>',
iconClass: 'g-icon g-icon-calendario-calendario',
showIcon: true,
showCleanIcon: true,
includeTime: false,
hasPrefix: false,
isEditable: true,
onChange: function(plug, val) {
}
});
$('#datepicker_example_disabled').find('input').attr('disabled', 'true');
});
});
</script>g-datepicker-filter g-datepicker-filter example
<div id="g_datepicker" class="g-datepicker filter"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_datepicker').GlinttDatePicker({
theme: 'medium',
format: 'DD-MM-YYYY',
defaultDate: Date.now(),
setDefaultDate: true,
placeholder: '<inserir data>',
showIcon: true,
iconClass: 'g-icon g-icon-calendario-calendario',
showCleanIcon: false,
includeTime: false,
hasPrefix: false,
isEditable: true,
onChange: function(plug, val) {
if (val != undefined) {}
}
});
});
});
</script>g-datepicker-rounded g-datepicker-rounded example
<div id="g_datepicker_hour" class="g-datepicker datepicker-rounded"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var hourpickerOptions = {
placeholder: "hh:mm",
format: "HH:mm",
showTimePickerOnly: true,
useTimePickerAsDuration: true,
includeTime: true,
showCleanIcon: true
};
ControlsManager.addGlinttDatePicker('#g_datepicker_hour', "", hourpickerOptions);
});
});
</script>g-datepicker-rounded g-datepicker-rounded example
<div id="g_datepicker_hour_calendar" class="g-datepicker datepicker-rounded"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
i18n.msgStore.GLINTTDATEPICKER_PRECISION_MIN = "Min"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_HORA = "Hor"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_D = "Dia"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_M = "Mes"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_Y = "Ano"
$('#g_datepicker_hour_calendar').GlinttDatePicker({
theme: "light",
includeTimeZone: false,
showCleanIcon: true,
showIcon: true,
includeTime: true,
placeholder: "hh:mm",
hasPrefix: false,
isEditable: true,
dateFormat: "HH:mm",
includeDateFormatSelection: true
});
});
});
</script>g-datepicker-date-and-hour g-datepicker-date-and-hour example
<div id="g-datepicker-date-and-hour" class="g-datepicker datepicker-rounded"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
i18n.msgStore.GLINTTDATEPICKER_PRECISION_MIN = "Min"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_HORA = "Hor"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_D = "Dia"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_M = "Mes"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_Y = "Ano"
$('#g-datepicker-date-and-hour').GlinttDatePicker({
theme: "light",
includeTimeZone: false,
showCleanIcon: true,
showIcon: true,
includeTime: true,
placeholder: "YYYY-MM-DD HH:mm",
hasPrefix: false,
isEditable: true,
dateFormat: "YYYY-MM-DD HH:mm",
includeDateFormatSelection: true
});
});
});
</script><div>
<span class="g-text-12">Data Início</span>
<div id="datepicker_example" name="g-datepicker" class="g-datepicker"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#datepicker_example').GlinttDatePicker({
theme: 'medium',
format: 'DD/MM/YYYY',
placeholder: '<dd/mm/aaaa>',
iconClass: 'g-icon g-icon-calendario-calendario',
showIcon: true,
showCleanIcon: true,
includeTime: false,
hasPrefix: false,
isEditable: true,
i18n: $.datepicker.regional["es-ES"]
});
});
});
</script><div>
<span class="g-text-12">Data Início</span>
<div id="datepicker_example_disabled" name="g-datepicker" class="g-datepicker disabled"></div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#datepicker_example_disabled').GlinttDatePicker({
theme: 'medium',
format: 'DD-MM-YYYY',
placeholder: '<dd/mm/aaaa>',
iconClass: 'g-icon g-icon-calendario-calendario',
showIcon: true,
showCleanIcon: true,
includeTime: false,
hasPrefix: false,
isEditable: true,
onChange: function(plug, val) {
}
});
$('#datepicker_example_disabled').find('input').attr('disabled', 'true');
});
});
</script><div id="g_datepicker" class="g-datepicker filter"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#g_datepicker').GlinttDatePicker({
theme: 'medium',
format: 'DD-MM-YYYY',
defaultDate: Date.now(),
setDefaultDate: true,
placeholder: '<inserir data>',
showIcon: true,
iconClass: 'g-icon g-icon-calendario-calendario',
showCleanIcon: false,
includeTime: false,
hasPrefix: false,
isEditable: true,
onChange: function(plug, val) {
if (val != undefined) {}
}
});
});
});
</script><div id="g_datepicker_hour" class="g-datepicker datepicker-rounded"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var hourpickerOptions = {
placeholder: "hh:mm",
format: "HH:mm",
showTimePickerOnly: true,
useTimePickerAsDuration: true,
includeTime: true,
showCleanIcon: true
};
ControlsManager.addGlinttDatePicker('#g_datepicker_hour', "", hourpickerOptions);
});
});
</script><div id="g_datepicker_hour_calendar" class="g-datepicker datepicker-rounded"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
i18n.msgStore.GLINTTDATEPICKER_PRECISION_MIN = "Min"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_HORA = "Hor"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_D = "Dia"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_M = "Mes"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_Y = "Ano"
$('#g_datepicker_hour_calendar').GlinttDatePicker({
theme: "light",
includeTimeZone: false,
showCleanIcon: true,
showIcon: true,
includeTime: true,
placeholder: "hh:mm",
hasPrefix: false,
isEditable: true,
dateFormat: "HH:mm",
includeDateFormatSelection: true
});
});
});
</script><div id="g-datepicker-date-and-hour" class="g-datepicker datepicker-rounded"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
i18n.msgStore.GLINTTDATEPICKER_PRECISION_MIN = "Min"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_HORA = "Hor"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_D = "Dia"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_M = "Mes"
i18n.msgStore.GLINTTDATEPICKER_PRECISION_Y = "Ano"
$('#g-datepicker-date-and-hour').GlinttDatePicker({
theme: "light",
includeTimeZone: false,
showCleanIcon: true,
showIcon: true,
includeTime: true,
placeholder: "YYYY-MM-DD HH:mm",
hasPrefix: false,
isEditable: true,
dateFormat: "YYYY-MM-DD HH:mm",
includeDateFormatSelection: true
});
});
});
</script><div class="g-input-container g-input-medium g-form">
<div class="g-input-wrapper">
<input id="medium_example-2" name="g-textbox" class="g-textbox" />
<span class="g-icon g-icon-tools-pesquisa"></span>
</div>
</div>
<div id="radio" class="g-radio-group inline g-sm"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$('#medium_example-2').GlinttTextBox({
theme: 'dark',
placeholder: '<inserir motivo>',
minlength: '0',
isEditable: true,
includeClearIcon: false,
value: null,
addPrefix: false, //adicionada label
prefix: null, //nome da label,
onTextChanged: function(value) {}
});
$("#radio").GlinttRadioButton({
dataSource: [{
label: "Teste1",
group: "Teste1",
},
{
label: "Teste2",
group: "Teste1",
},
{
label: "Teste3",
group: "Teste1",
},
{
label: "Teste4",
group: "Teste2",
},
{
label: "Teste5",
group: "Teste2",
}
]
});
});
});
</script>ckeditor ckeditor example (Para usar o estilo required adicionar class="required" à textarea)
<textarea name="ckeditor" id="ckeditor">
</textarea>
<script>
$(document).ready(function() {
function maxChars(str, max) {
var tags = 0,
sQuotes = 0,
dQuotes = 0,
char,
count = 0,
result = [];
for (var i = 0, len = str.length; i < len; ++i) {
char = str.charAt(i);
switch (char) {
case '<':
if (!sQuotes && !dQuotes) {
++tags;
result.push(char);
continue;
}
break;
case '>':
if (!sQuotes && !dQuotes) {
--tags;
result.push(char);
continue;
}
break;
case "'":
if (tags && !dQuotes)
sQuotes = !sQuotes;
break;
case '"':
if (tags && !sQuotes)
dQuotes = !dQuotes;
break;
}
if (tags) {
result.push(char);
} else {
if (++count < max)
result.push(char);
}
}
return result.join('');
};
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var maxLength = 50;
CKEDITOR.replace('ckeditor', {
extraPlugins: 'confighelper' /*,wordcount,notification'*/ ,
placeholder: 'comece a escrever!',
/*wordcount : {
showCharCount : true,
// Maximum allowed Char Count
maxCharCount: 100,
countSpacesAsChars: true
},*/
toolbar: [{
name: 'document',
items: ['NewPage', 'Preview', 'Templates']
}, // Defines toolbar group with name (used to create voice label) and items in 3 subgroups.
['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', 'Undo', 'Redo'], // Defines toolbar group without name. // Line break - next group will be placed in new line.
{
name: 'basicstyles',
items: ['Bold', 'Italic']
}
]
}, {
removePlugins: 'elementspath'
});
CKEDITOR.instances['ckeditor'].on('paste', function(obj) {
var atualLength = 0;
if (CKEDITOR.instances['ckeditor'].getData().length > 0) {
atualLength = $(CKEDITOR.instances['ckeditor'].getData()).text().length;
}
if (atualLength > maxLength) return false;
var pasteLength = 0;
if (/<[a-z][\s\S]*>/i.test(obj.data.dataValue)) {
pasteLength = $(obj.data.dataValue).text().length;
} else {
pasteLength = obj.data.dataValue.length;
}
if (atualLength + pasteLength > maxLength) {
var maxNewChars = maxLength - atualLength;
var newDataValue = maxChars(obj.data.dataValue, maxNewChars);
CKEDITOR.instances['ckeditor'].setData(CKEDITOR.instances['ckeditor'].getData() + newDataValue);
}
});
CKEDITOR.instances['ckeditor'].on('key', function(obj) {
if (obj.data.keyCode === 8 ||
obj.data.keyCode === 37 ||
obj.data.keyCode === 38 ||
obj.data.keyCode === 39 ||
obj.data.keyCode === 40 ||
obj.data.keyCode === 46 ||
obj.data.keyCode > 20000) {
return true;
}
if ($(CKEDITOR.instances['ckeditor'].getData()).text().length >= maxLength) {
return false;
} else {
return true;
}
});
CKEDITOR.addCss(
'.cke_editable { background-color:#f2f2f2; } .cke_editable.placeholder{ font-size: 11px; line-height: 11px; color: #666666; }'
);
});
});
</script>g-search-light g-search-light example - Existem dois tamanhos para a linha da gsearch (32px e 64px), para escolher a altura é ncessário definir a propriedade dropdownRowHeight (32px -> "md", 64px -> default ou "lg")
<div class="g-search g-input-container g-input-light">
<div class="g-input-wrapper">
<input id="g_gsearcher_1" class="g-textbox" />
<span class="g-icon g-icon-tools-pesquisa"></span>
</div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var take_gsearcher = 5;
var dataSource = [{
Id: 1,
Name: "Ana"
},
{
Id: 2,
Name: "Manuel"
},
{
Id: 3,
Name: "João"
},
{
Id: 4,
Name: "Maria"
},
{
Id: 5,
Name: "Paulo"
}
];
$('#g_gsearcher_1').GSearcher({
minLength: 3,
textProperty: 'Name',
isEditable: true,
template: '<div class="g-gsearcher-template">{{Name}}</div>',
disableKeyboard: false,
allowFilter: true,
theme: 'MEDIUM',
includeClearIcon: false,
allowAutoSelect: true,
autoComplete: true,
highlightedClass: 'highlighted',
addPrefix: false, //adicionada label
// prefix: undefined,//nome da label,
placeholder: '<pesquisar motivo>',
//allowSelector: true, //adiciona o icone da lupa,
source: function(request, response, page, plugin) {
// var browser = jQuery.browser;
// if (browser && !browser.msie)
// isFirstTime = false;
// if (request.term.length > 0 && !isFirstTime) {
response(dataSource, take_gsearcher, page++);
// } else {
// response([], take_gsearcher, page);
// isFirstTime = false;
// }
},
select: function(event, item) {
if (item == null) {} else {}
}
});
});
});
</script>g-search-combo g-search-light example - Existem dois tamanhos para a linha da gsearch (32px e 64px), para escolher a altura é ncessário definir a propriedade dropdownRowHeight (32px -> "md", 64px -> default ou "lg")
<style>
</style>
<div class="g-search form light">
<input id="g_gsearcher_2" class="g-textbox" />
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var take_gsearcher = 5;
var dataSource = [{
Id: 1,
Name: "Ana"
},
{
Id: 2,
Name: "Manuel"
},
{
Id: 3,
Name: "João"
},
{
Id: 4,
Name: "Maria"
},
{
Id: 5,
Name: "Paulo"
}
];
$('#g_gsearcher_2').GSearcher({
minLength: 1,
textProperty: 'Name',
isEditable: true,
template: '<div class="g-gsearcher-template">{{Name}}</div>',
disableKeyboard: false,
allowFilter: true,
theme: 'MEDIUM',
includeClearIcon: false,
allowAutoSelect: true,
autoComplete: true,
addPrefix: false, //adicionada label
// prefix: undefined,//nome da label,
placeholder: '<pesquisar motivo>',
//allowSelector: true, //adiciona o icone da lupa,
source: function(request, response, page, plugin) {
// var browser = jQuery.browser;
// if (browser && !browser.msie)
// isFirstTime = false;
// if (request.term.length > 0 && !isFirstTime) {
response(dataSource, take_gsearcher, page++);
// } else {
// response([], take_gsearcher, page);
// isFirstTime = false;
// }
},
select: function(event, item) {
if (item == null) {} else {}
},
iconClass: "g-icon-tools-seta-baixo"
});
});
});
</script>g-search-clear g-search-clear example - Existem dois tamanhos para a linha da gsearch (32px e 64px), para escolher a altura é ncessário definir a propriedade dropdownRowHeight (32px -> "md", 64px -> default ou "lg")
<div class="g-search g-input-container g-input-light">
<div class="g-input-wrapper">
<input id="g_gsearcher_3" class="g-textbox" />
</div>
</div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var take_gsearcher = 5;
var dataSource = [{
Id: 1,
Name: "Ana"
},
{
Id: 2,
Name: "Manuel"
},
{
Id: 3,
Name: "João"
},
{
Id: 4,
Name: "Maria"
},
{
Id: 5,
Name: "Paulo"
}
];
$('#g_gsearcher_3').GSearcher({
minLength: 0,
textProperty: 'Name',
isEditable: true,
template: '<div class="g-gsearcher-template">{{Name}}</div>',
disableKeyboard: false,
allowFilter: true,
theme: 'MEDIUM',
includeClearIcon: true,
iconClass: 'g-icon g-icon-tools-pesquisa',
allowAutoSelect: true,
autoComplete: true,
suppressInput: true,
addPrefix: false, //adicionada label
// prefix: undefined,//nome da label,
placeholder: '<pesquisar motivo>',
//allowSelector: true, //adiciona o icone da lupa,
source: function(request, response, page, plugin) {
// var browser = jQuery.browser;
// if (browser && !browser.msie)
// isFirstTime = false;
// if (request.term.length > 0 && !isFirstTime) {
response(dataSource, take_gsearcher, page++);
// } else {
// response([], take_gsearcher, page);
// isFirstTime = false;
// }
},
select: function(event, item) {
if (item == null) {} else {}
}
});
});
});
</script>g-horizontal-timeline g-horizontal-timeline example
<div id="glinttHorizontalTimeline"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$("#glinttHorizontalTimeline").GlinttHorizontalTimeline({
timelineDates: [
"28/01/2014",
"16/02/2014",
"16/03/2014",
"20/04/2014",
"20/05/2014",
"20/06/2014",
"09/07/2014",
"30/08/2014",
"15/09/2014",
"01/11/2014",
"10/12/2014",
"19/01/2015",
"03/03/2015"
]
});
});
});
</script>slider
<div id="slider"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$("#slider").slider();
});
});
</script>steps progressbar
<div id="example-stepsprogressbar"></div>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
var stepsProgressOptions = {};
stepsProgressOptions.steps = ['Pré-selecção', 'Seleção', 'Validação', 'Resumo', 'Pagamento'];
stepsProgressOptions.currentIndex = 2;
stepsProgressOptions.consultationIndex = 0;
stepsProgressOptions.consultationMode = true;
ControlsManager.addStepsProgress('#example-stepsprogressbar', 'exemplos', stepsProgressOptions);
});
});
</script>g-text-area g-text-area example
<textarea id="glinttTextArea"></textarea>
<script>
$(document).ready(function() {
requirejs(["assets/toolkit/lib/globalcare/globalCare.js"], function() {
$("#glinttTextArea").GlinttTextArea({
addPlaceholder: true,
id: "glinttTextArea",
isEditable: true,
theme: "LIGHT",
maxHeight: 120,
placeholder: "inserir texto"
});
});
});
</script>