I have a kendo editor which looks like the below
$("#editor").kendoEditor({
tools: [
"bold",
"fontSize",
"foreColor",
"backColor",
{
name: "fontName",
items: [
{ text: "Andale Mono", value: "Andale Mono" },
{ text: "Arial", value: "Arial" },
{ text: "Arial Black", value: "Arial Black" },
{ text: "Book Antiqua", value: "Book Antiqua" },
{ text: "Comic Sans MS", value: "Comic Sans MS" },
{ text: "Courier New", value: "Courier New" },
{ text: "Georgia", value: "Georgia" },
{ text: "Helvetica", value: "Helvetica" },
{ text: "Impact", value: "Impact" },
{ text: "Symbol", value: "Symbol" },
{ text: "Tahoma", value: "Tahoma" },
{ text: "Terminal", value: "Terminal" },
{ text: "Times New Roman", value: "Times New Roman" },
{ text: "Trebuchet MS", value: "Trebuchet MS" },
{ text: "Verdana", value: "Verdana" },
{ text: "Webdings", value: "Webdings" },
{ text: "Wingdings", value: "Wingdings" },
{ text: "Calibri", value: "Calibri" },
//{ text: "tamil-SARURG", value: "tamil-SARURG" }
]
},
{
name: "custom",
tooltip: "Add page break",
exec: function (e) {
var editor = $(this).data("kendoEditor");
editor.exec("inserthtml", { value: "<p STYLE='page-break-before: always'>Page break here!</p>" });
}
}
],
});
Now I want to add custom font name in my kendo editor, the font name is called
tamil-SARURG
I also added the following line in my code
{ text: "tamil-SARURG", value: "tamil-SARURG" }
but it did not worked.
how can I add custom font name in kendo editor
Related
I am new to Vuetify I and want to add expandable rows to my table. How can I add
{ text: '', value: 'data-table-expand' } to my headers?
My headers look like the following:
headers: VuetifyDataTableHeader<
IncidentNotificationPlan & {
inpOperation: unknown;
inpActionTypeIcon: unknown;
ttaat: string;
dueTime: string;
inpActionOperation: unknown;
}
>[] = [
{ text: $t('Ticket'), value: 'ticketNumber', width: '15%' },
{ text: '', value: 'user', width: '68px' },
{ text: $t('Plan Name'), value: 'name' },
{ text: '', value: 'inpOperation', width: '120px' },
{ text: $t('Host(s)'), value: 'hosts', width: '18%' },
{ text: $t('Action'), value: 'inpActionTypeIcon', width: '90px' },
{ text: $t('TTAAT'), value: 'ttaat', width: '90px' },
{ text: $t('Due Time'), value: 'dueTime', width: '120px' },
{ text: '', value: 'inpActionOperation', width: '120px' },
];
I want the icon to be displayed in the column of hosts. Can anybody help me out?
I am using kendo ui with requirejs. I am using multiple widgets just fine, but when I try to initialize a treeview I get an exception - r.Dragging is not a function'
var inlineDefault = new kendo.data.HierarchicalDataSource({
data: [
{ text: "Furniture", items: [
{ text: "Tables & Chairs" },
{ text: "Sofas" },
{ text: "Occasional Furniture" }
] },
{ text: "Decor", items: [
{ text: "Bed Linen" },
{ text: "Curtains & Blinds" },
{ text: "Carpets" }
] }
],
dragAndDrop: false
});
$("#treeview").kendoTreeView({
dataSource: inlineDefault
});
the exception is:
Uncaught TypeError: r.Dragging is not a function
f.ui.DataBoundWidget.extend.init # kendo.all.min.js:formatted:18252(anonymous function) # kendo.all.min.js:formatted:732
couldn't debug the issue, am I missing a dependency (i have jquery) or something? that code is taken from their examples...
try this fix
var inlineDefault = new kendo.data.HierarchicalDataSource({
data: [
{ text: "Furniture", items: [
{ text: "Tables & Chairs" },
{ text: "Sofas" },
{ text: "Occasional Furniture" }
] },
{ text: "Decor", items: [
{ text: BED LINEN" },
{ text: "Curtains & Blinds" },
{ text: "Carpets" }
] }
]
});
$("#treeview").kendoTreeView({
dataSource: inlineDefault,
dragAndDrop: false
});
Is there a possibility to add notes on the categoryAxis in a Kendo Chart.
As seen in the documentation it should be possible, but even after setting every single option i dont see any notes. I couldn't find any example of somebody doing that. Has anybody managed or used this feature?
my try on jsFiddle
categoryAxis: {
field: "age",
justified: true,
majorGridLines: {
visible: false
},
minorGridLines: {
visible: false
},
min: 10,
max: 30,
labels: {
step: 5
},
notes: {
data: [{
value: { age: 15 },
position: "top",
icon: {
visible: true,
size: 16,
type: "circle",
background: "#585858",
border: {
color: "#FFFFFF"
}
},
line: {
length: 16
},
label: {
visible: false,
text: " "
}
}]
}
}
Thank you
The value property for notes on the categoryAxis appears to represent each category value.
Here's an example notes configuration:
notes: {
label: {
template: "Value: #: value #"
},
icon: {
visible: true,
size: 16,
type: "circle",
background: "#585858",
border: {
color: "#FFFFFF"
}
},
line: {
length: 16
},
data: [{ value: 1}, { value: 5 },{ value: 10 }, { value: 15 }, { value: 20 }]
}
Check out this updated fiddle.
I am getting an error in IE as:
Message: Invalid argument.
Line: 8
Char: 56
Code: 0
URI: .../js/highcharts.js
Below is the highcharts chart code..It works perfectly fine in Firefox but in IE throws an error.Can anybody help me with this. Thanks.
function drawChart(categories,series){
$('#container').highcharts({
chart: {
backgroundColor:'rgba(255, 255, 255, 0.1)',
spacingLeft: -2
},
xAxis: {
categories: categories,
gridLineWidth:0.5,
labels: {
style: {
fontSize:'0px'
}
}
},
colors: ["#a7c1d0"],
plotOptions: {
series: {
marker: {
enabled: false
}
}
},
title: {
text: "Last 45 days NAV Price",
align: 'center',
style:{
color: '#5e605e',
fontSize:'11px',
fontFamily:'Arial'
},
y:1
},
legend: {
enabled:false
},
navigation: {
buttonOptions: {
enabled: false
}
},
yAxis: {
title: {
enabled: true,
text: 'Price',
style: {
color: '#5e605e',
fontSize:'10px',
marginLeft:'-5px;',
fontFamily:'Arial'
}
},
labels:{
style:{
fontSize:'10px'
},
step:0,
},
lineWidth: 1,
tickInterval: 0.20,
minTickInterval:0.20
},
series: [{
data: series
}]
});
}
Could you paste your data? Moreever you have i.e extra common in labels object.
labels:{
style:{
fontSize:'10px'
},
step:0,
},
http://www.highcharts.com/docs/frequently-asked-questions#not-showing-in-explorer
need help about adding a new recort in a kendo grid.
I have a grid with a foreign key field. The grid is populated by a json data with subobject, returned from a webmethod. it looks like this:
[
{
"classe_iva": {
"id_classe_iva": 5,
"desc_classe_iva": "Esente",
"note_classe_iva": null
},
"id_iva": 37,
"desc_iva": "bbb",
"codice_iva": "bbb",
"imposta": 2,
"indetr": 2,
"id_classe_iva": 5,
"note": "dddddfsf",
"predefinito": false,
"id_company": 4
},
{
"classe_iva": {
"id_classe_iva": 6,
"desc_classe_iva": "Escluso",
"note_classe_iva": null
},
"id_iva": 52,
"desc_iva": "o",
"codice_iva": "jj",
"imposta": 1,
"indetr": 1,
"id_classe_iva": 6,
"note": "l",
"predefinito": false,
"id_company": 4
}
]
and this is the schema.model used in the kendo datasource:
model = {
id: "id_iva",
fields: {
id_iva: { type: "string", editable: false },
desc_iva: { type: "string" },
codice_iva: { type: "string" },
imposta: { type: "number" },
indetr: { type: "number" },
id_classe_iva: {type: "string"},
note: { type: "string" },
predefinito: { type: "boolean" },
id_company: { type: "number" }
}
}
.. and below is shown the grid columns format:
toolbar = [{
name: "create",
text: "Aggiungi nuova aliquota IVA"
}];
columns = [
{ field: "desc_iva", title: "Descrizione", width: 45 },
{ field: "codice_iva", title: "Codice", width: 45 },
{ field: "imposta", title: "Imposta", width: 45 },
{ field: "indetr", title: "Indetr", width: 45 },
{ field: "classe_iva.desc_classe_iva", title: "Classe IVA", width: 200, editor: categoryDropDownEditor, template: "#= classe_iva ? classe_iva.desc_classe_iva : 1 #", defaultValue: { id_classe_iva: 1, desc_classe_iva: "Acq. Intra-UE" } },
{ field: "note", title: "Note", width: 45 },
{
command: [{
name: "destroy",
text: "Elimina",
confirmation: "Sei sicuro di voler eliminare questa voce?"
} ,
{
name: "edit",
text: {
edit: "Modifica",
update: "Aggiorna",
cancel: "Cancella"
}
}
]
}
];
Theese settings works fine when i edit a row, and the grid shows the right content into the combobox field.
The problem is when i click on the "add new record" button, because when it tries to add a new row, it doesn't find the subobjects field "classe_iva".
if i change the column.field into this
{ field: "id_classe_iva", title: "Classe IVA", width: 200, editor: categoryDropDownEditor, template: "#= id_classe_iva ? id_classe_iva : 1 #", defaultValue: { id_classe_iva: 1, desc_classe_iva: "Acq. Intra-UE" } },
{ field: "note", title: "Note", width: 45 }
the add button works fine, but when the grid is loaded, the column id_classe_iva doesn't shows me the classe_iva.desc_classe_iva field...
how can i fix the issue??^?
thanks in advance.
to fix this issue, i used a workaround:
the error was thrown because, in the declaration of the field.template there where a not declared variable (classe_iva):
{ field: "id_classe_iva", title: "Classe IVA", width: 200, editor: categoryDropDownEditor, template: "#= classe_iva ? classe_iva.desc_classe_iva : 1 #", defaultValue: { id_classe_iva: 1, desc_classe_iva: "Acq. Intra-UE" } },
then, i declared a global variable
var classe_iva;
in this way, when i add a new record, the code doesn't throw any errors, and by the ternary if, the default value is set.
hope it will help someone.