Questions on Kendo UI for jQuery Forum

1 answer

1.7K+ views

How to default kendo datetimepicker 12:00AM value

I have a datetimepicker.

$scope.dateTimePickerOptions = {
format: "MM/dd/yyyy hh:mmtt"
}

when user selects a date, i want to default the time to be 5:00PM instead of 12:00AM. if the user selects a different time, i want the value to be set accordingly.

Can you please tell me how i can accomplish that? I am using angular 1. thanks.

DatePicker

answered on 17 Jan 2017

1 answer

1.6K+ views

Export html to word

Hi,

I would like to know if Kendo provides any means to export my html page with charts and grids into word document?

Best Regards,

CH

Drawing API

answered on 17 Jan 2017

1 answer

182 views

"_previousSelection" issue

Hi, been using Kendo for a little while now, mostly the grid widget to replace many screens in the PLM application that I maintain.

My skill-set is primarily server-side Progresss/OpenEdge database design and development, but a big chunk of my time now is on client-side development.

Anyway, the attached pics indicate an issue I'm having now, which I'll also describe below.

I feed my grid using a JSON import - this loads without errors. The grids are defined, in most places, with all columns available for sorting. At the end of the data row, I implement custom function calls for edit and delete.

If the data is NOT sorted, then the edit and delete functions are processed, but if the data (doesn't matter which column) IS sorted, then there is a "_previousSelection" error shown on inspection (running this in Chrome on Windows 7, but also occurs in Firefox on Windows 8/10)

Perfectly happy to accept that I'm doing something wrong, but I don't know what !

Screenshots attached, code below - I downloaded and installed the latest kendo zip file before posting this, just in case it'd been found and resolved

-----------------------------------------------------------------------------------------------------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Brand Maintenance</title>
<link rel="stylesheet" type="text/css" href="http://osl12/css/grey_segoe.css">
<link rel="stylesheet" type="text/css" href="http://osl12/css/kendo/styles/kendo.common.min.css">
<link rel="stylesheet" type="text/css" href="http://osl12/css/kendo/styles/kendo.default.min.css">
<link rel="icon" href="http://osl12/images/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="http://osl12/images/favicon.ico" type="image/x-icon" />
<script type="text/javascript" language="javascript" src="http://osl12/scripts/jQuery.js"></script>
<script type="text/javascript" language="javascript" src="http://osl12/scripts/validation.js"></script>
<script type="text/javascript" language="javascript" src="http://osl12/scripts/kendo/js/jszip.min.js"></script>
<script type="text/javascript" language="javascript" src="http://osl12/scripts/kendo/js/kendo.all.min.js"></script>
<script type="text/javascript" language="javascript" src="http://osl12/scripts/kendo/js/cultures/kendo.culture.en-GB.min.js"></script>
</head>
<body class="right" style="margin-bottom:0px; margin-top:0px; margin-left:0px; margin-right:0px" >
<table width="100%" cellspacing="0px" cellpadding="0px" border="0px" class="title">
<tr> <td class="titletop" colspan="2"></td> </tr>
<tr>
<td height="25px" nowrap valign="middle" class="title" width="91%" align="center">Brand Maintenance </td>
<td height="25px" nowrap valign="middle" align="left"> 
<a href="javascript: wop('http://osl12/cgi-bin/wspd_cgi.sh/WService=prm_wrk/SystemManager?WEB_SCRN=SrchManager&STD_TARGET=WRONG','',config='screenX=100,screenY=100,left=100,top=100,height=600,width=600,toolbar=no,menubar=no,dependent=no,scrollbars=yes,resizable=yes,location=no,directories=no,status=no')"><img border="0" src="http://osl12/images/search.png" height="19px"></a>
  
   <a class="helptext" href="javascript: wop('http://osl12/cgi-bin/wspd_cgi.sh/WService=prm_wrk/SystemManager?WEB_SCRN=HelpManager&WEB_FRAMES=NO&WEB_PROG=BrandMaint&MODE=ProgramInfo&WEB_CONTEXT=__AMP__WEB_SCRN__EQL__BrandMaint__AMP__BODY_CLASS__EQL__right__AMP__KENDO_MODE__EQL__YES__AMP__STD_TARGET__EQL__Right','',config='screenX=100,screenY=100,left=100,top=100,height=700,width=735,toolbar=no,menubar=no,dependent=no,scrollbars=yes,resizable=yes,location=no,directories=no,status=no')"><img border="0" src="http://osl12/images/info2.png" height="19px" width="19px"></a>
</td>
</tr>
<tr> <td class="titlebot" colspan="2"></td> </tr>
</table>
<div id="toolbar"></div>
<style>
html { font-family: "Segoe UI", Calibri, Arial, "Sans Serif"; font-size: 9pt }
.header-image { position:absolute;top:0;bottom:0;max-height:1920px;overflow:hidden;left: 0;right: 0;z-index:-1;border:10px solid #545351;}
.header {width: 100%;}
.header-image img {width: 100% !important;}
.info { color: #7777ff; border: none; }
.error { color: #ff7777; border: red; }
.k-grid-header { padding: 0 !important; }
.k-grid-content { overflow-y: visible; }
td.k-col-sort { background-color: #FFF6F1; color: black; }
td.k-alt-col-sort { background-color: #FFEDE3; color: black; }
</style>
<form method="post" name="Form1" target="Right" action="http://osl12/cgi-bin/wspd_cgi.sh/WService=prm_wrk/SystemManager?WEB_SCRN=BrandMaint&KENDO_MODE=YES">
<input type="hidden" name="MODE" value="EDIT">
<input type="hidden" name="WEB_FRAMES" value="">
<input type="hidden" name="SEL_BRAND" value="">
</form>
<script language="javascript" type="text/javascript">
var gSaveColumns = true;
var undeletable = [];
var extraCheck = [];
function getCode(evt,btn)
{
var grid = $("div#grid").data("kendoGrid");
var currentRow = $(evt.currentTarget).parent().parent();
grid.select(currentRow);
var selected = grid.dataItem(grid.select());
return selected.Brand;
}
function editButton(evt,btn)
{
document.Form1.SEL_BRAND.value = getCode(evt,btn);
document.Form1.MODE.value = "EDIT";
document.Form1.submit();
}
function deleteButton(evt,btn)
{
document.Form1.SEL_BRAND.value = getCode(evt,btn);
var makeSure = false;
for (var i=0; i<undeletable.length; i++)
{
if (document.Form1.SEL_BRAND.value == undeletable[i])
{
alert("This record can not be deleted");
return;
}
}
for (var i=0; i<extraCheck.length && ! makeSure; i++)
{
if (document.Form1.SEL_BRAND.value == extraCheck[i])
makeSure = true;
}
if ( ( ! makeSure && ! confirm("Are you SURE you want to DELETE this Brand ?" ) ) ||
( makeSure && ! confirm("Column configuration and formatting cleared" ) ) )
return;
document.Form1.MODE.value = "DELETE";
document.Form1.submit();
}
function resetForm()
{
document.Form1.SEL_BRAND.value = "";
}
function wipeIt()
{
window.localStorage.removeItem("prm_wrk_rjj_HQ_BrandMaint_Grid");
alert("Column configuration and formatting cleared");
window.location.reload(true);
}
function saveIt(param)
{
var grid = $("#grid").data("kendoGrid");
var options = grid.getOptions();
for (var c in options.columns)
{
var col = options.columns[c];
if (col && col.command)
options.columns.splice(c,1);
}
localStorage["prm_wrk_rjj_HQ_BrandMaint_Grid"] = kendo.stringify(options);
if (param != "n")
alert("Column configuration and formatting saved");
}
function exportToExcel()
{
var grid = $("#grid").data("kendoGrid");
if (typeof showHideForExport != "undefined")
showHideForExport("s");
grid.saveAsExcel();
if (typeof showHideForExport != "undefined")
showHideForExport("h");
}
function exportToPDF()
{
var grid = $("#grid").data("kendoGrid");
grid.saveAsPDF();
}
function newRecord(URL, windowName, windowArgs)
{
wop(URL,windowName,windowArgs);
}
function removeHTML(anchorText,searchValue)
{
var junk = "", startPosn = 0;
if (searchValue != "")
{
startPosn = anchorText.search(searchValue);
if (startPosn > -1)
{
startPosn = startPosn + searchValue.length;
junk = anchorText.substr(startPosn);
var junk2 = junk.split('"');
return junk2[0];
}
}
else
{
searchValue = "</a>";
startPosn = anchorText.search(searchValue);
if (startPosn > -1)
for (var i=StartPosn; i>0; i--)
{
if (anchorText.charAt(i) == ">")
return junk;
else
junk = anchorText.charAt(i) + junk;
}
}
}
function gridBound(e)
{
var grid = e.sender, sort = grid.dataSource.sort();
var gridTable = grid.table, cols = grid.columns;
for (var i in sort)
{
var index = -1;
for (var c in cols)
{
if (cols[c].field == sort[i].field)
{
index = c;
break;
}
}
if (index >= 0)
sortColumn(gridTable, index);
}
var filter = grid.dataSource.filter();
grid.thead.find(".k-header-column-menu.k-state-active").removeClass("k-state-active");
if (filter)
{
var filteredMembers = {};
setFilteredMembers(filter, filteredMembers);
grid.thead.find("th[data-field]").each(function()
{
var cell = $(this);
var filtered = filteredMembers[cell.data("field")];
if (filtered)
{
cell.find(".k-header-column-menu").addClass("k-state-active");
}
}
);
}
}
function setFilteredMembers(filter, members)
{
if (filter.filters)
{
for (var i = 0; i < filter.filters.length; i++)
{
setFilteredMembers(filter.filters[i], members);
}
}
else
{
members[filter.field] = true;
}
}
function sortColumn(table, fldIndex)
{
table.find("tbody[role=rowgroup]").children("tr").each(function ()
{
var thisRow = $(this);
var className = thisRow.hasClass('k-alt') ? 'k-alt-col-sort' : 'k-col-sort';
$(this).children("td:eq(" + fldIndex + ")").addClass(className);
}
);
}
function gridChange(e)
{
var cols = e.sender.columns, sort = e.sender.dataSource.sort();
if (! sort || sort.length == 0)
return; // no sort fields...
// Get Array or Sort indexes...
var sortIndex = [], select = e.sender.select();
for (var i in sort)
for (var c in cols)
if (cols[c].field == sort[i].field)
{
sortIndex.push(parseInt(c));
break;
}
// Add Col sort col CSS Class on selected rows...
if (_previousSelection)
_previousSelection.each(function()
{
// Go backwards as we're deleting...
for (var r = select.length - 1; r >= 0; r--)
if (select[r] == this)
{
select.splice(r, 1);
return true;
}
var tr = $(this);
var className = tr.hasClass('k-alt') ? 'k-alt-col-sort' : 'k-col-sort';
for (var i in sortIndex)
tr.find("td:eq(" + sortIndex[i] + ")").addClass(className);
}
);
// Remove Col sort col CSS Class on selected row...
select.each(function()
{
var tr = $(this);
var className = tr.hasClass('k-alt') ? 'k-alt-col-sort' : 'k-col-sort';
for (var i in sortIndex)
tr.find("td:eq(" + sortIndex[i] + ")").removeClass(className);
}
);
// Save for later...
_previousSelection = e.sender.select();
}
function post(_async, _url, _data, _dataType, _onstatus, _onfail, _onerror)
{
var _handler404 = function (r)
{
alert("Unable to communicate with the server. The path" + _url + "could not be contacted. Is the server running?")
}
var customstatus = { 200: function (r)
{
var response = r;
if (typeof r.responseText != "undefined")
{
var payloadtype = r.getResponseHeader("Content-Type");
if(payloadtype.indexOf("application/json") == 0)
response = JSON.parse(r.responseText);
}
if (_onstatus != null && typeof _onstatus[200] != "undefined")
_onstatus[200](response);
},
403: function (response)
{
window.location = "index.php?type=expired";
},
404: _handler404
}
$.ajax(
{
type: "POST",
async: _async,
url: _url,
dataType: _dataType,
data: JSON.stringify(_data),
statusCode: customstatus,
success: function (r) { },
//fail: _onfail,
//error: _onerror
fail: function(f) {
alert("No data found for selection criteria - or JSON/Ajax Failure");
},
error: function(e) {
alert("No data found for selection criteria - or JSON/Ajax Error!");
},
}
);
}
$(document).ready(function()
{
var toolbar = $("#toolbar").kendoToolBar(
{
items: [
{
type: "button",
text: "Export to Excel",
icon: "excel",
click: function () { exportToExcel(); }
},
{
type: "separator",
width: "50px"
}
, {
type: "button",
text: "Export to PDF",
icon: "pdf",
click: function () { exportToPDF(); }
},
{
type: "separator",
width: "50px"
}
, {
type: "button",
text: "Reset",
click: function () { wipeIt(); }
},
{
type: "separator",
width: "50px"
},
{
type: "button",
text: "Save",
click: function () { saveIt(); }
}
, {
type: "separator",
width: "50px"
},
{
type: "button",
text: "Create New",
click: function () { resetForm(); document.Form1.submit(); }
}
]
}
);
var _previousSelection = null;
dataSource = new kendo.data.DataSource(
{
transport:
{
read:function(options)
{
post(false,
"http://osl12/cgi-bin/wspd_cgi.sh/WService=prm_wrk/SystemManager?WEB_SCRN=BrandMaint&MODE=KendoData&OUTPUT_MODE=JSON&KENDO_MODE=YES",
{
"options": JSON.stringify(options)
},
"json",
{
200: function (response)
{
options.success(response);
}
}
)
},
parameterMap: function(options, operation)
{
if (operation !== "read" && options.models)
return {models: kendo.stringify(options.models)};
}
},
page: 1,
pageSize: 5,
serverSorting: true,
serverFiltering: true,
serverPaging: true, // enable server paging
schema:
{
data: function (response)
{
return response.data;
},
total: function (data)
{
if (data != null && data.status == "ERROR")
{
alert(data.message);
return 0;
}
return data.total;
},
model:
{
id: "Brands",
fields:
{
Brand: { },
Description: { },
FlagActive: { },
CreatedByOnAt: { },
UpdatedByOnAt: { }
}
}
}
}
);
var _filters = null,
_sorting = null,
_columns = [
{
field: "Brand",
title: "Brand",
filterable: true,
headerAttributes: { title: "Brand", style: "text-align:left;" },
attributes: { style: "text-align:left;" }
},
{
field: "Description",
title: "Description",
filterable: true,
headerAttributes: { title: "Description", style: "text-align:left;" },
attributes: { style: "text-align:left;" }
},
{
field: "FlagActive",
title: "Active ?",
filterable: true,
headerAttributes: { title: "Active ?", style: "text-align:right;" },
attributes: { style: "text-align:right;" }
},
{
field: "CreatedByOnAt",
title: "Created By/On/At",
filterable: false,
headerAttributes: { title: "Created By/On/At", style: "text-align:left;" },
attributes: { style: "text-align:left;" }
},
{
field: "UpdatedByOnAt",
title: "Updated By/On/At",
filterable: false,
headerAttributes: { title: "Updated By/On/At", style: "text-align:left;" },
attributes: { style: "text-align:left;" }
}
];
var localOptionsJSON = localStorage["prm_wrk_rjj_HQ_BrandMaint_Grid"];
if (localOptionsJSON)
{
var localOptions = JSON.parse(localOptionsJSON);
if (localOptions && localOptions.columns)
_columns = localOptions.columns;
_filters = localOptions.dataSource.filter ? localOptions.dataSource.filter : null;
_sorting = localOptions.dataSource.sort ? localOptions.dataSource.sort : null;
}
_columns.push( { command: [
{ name: "Edit", text: "Maintain Selected", click: function(e) { editButton(e, this); } }
, { name: "Delete", text: "Delete Selected", click: function(e) { deleteButton(e, this); } }
],
title: "",
width: "250px"
}
);
$("#grid").kendoGrid(
{
excel: {
fileName:"BrandMaint.xlsx",
allPages: false,
filterable:true
},
pdf: {
author:"rjj",
creator:"rjj",
date:new Date(),
fileName:"BrandMaint.pdf",
landscape:true,
paperSize:"A4",
subject:"BrandMaint",
title:"BrandMaint",
},
filterable:
{
extra: false,
operators:
{
string:
{
startswith: "Starts with",
contains: "Contains",
eq: "Is equal to",
neq: "Is not equal to"
}
}
},
reorderable: true,
columnMenu: true,
selectable: true,
resizable: true,
sortable:
{
mode: "single",
allowUnsort: true
},
pageable:
{
pageSize: 10,
pageSizes: [5, 10, 25, 50, 100]
},
columns: _columns,
change: function(e)
{
gridChange(e)
},
dataBound: function(e)
{
gridBound(e)
}
}
);
// Bind the data source to the grid...
grid = $("#grid").data("kendoGrid");

dataSource._filter = _filters;
dataSource.sortable = _sorting;
grid.setDataSource(dataSource);
grid = $("#grid");
grid.find(".k-grid-pager").insertBefore(grid.children(".k-grid-header"));
}
);
</script>
<div id="grid"></div>
</body>
</html>

Grid

answered on 17 Jan 2017

3 answers

167 views

Cell template with a visual control

Hi,

I have a grid and I want to put a visual control into each cell in one column.

The uses the jquery plugin pattern. So I would normally use it as such:

var $progressBar = $("<div />").appendTo($container);
$progressBar.myProgressBar(options);

The problem I am running into is using a cell template I don't have access to the cell ($container) to append this element to.

Is there a way I can add in this?

Thanks

Grid

answered on 16 Jan 2017

3 answers

778 views

[Solved] Single DataSource making multiple Server Requests

Hi,

I have 4 Drop Down Lists (spread over 4 tab panels) all using the same 'Locations' dataSource. The problem is when each drop down is initialized, a server request is made to retrieve its data. Which is weird, because shouldnt the DS make a server request the first time, and use the same response for the rest?

Unless the 'read()' call hasnt completed by the time the others initialize and so they each make their own call as well?

Please advise.

Thanks,
Grant

General Discussions

answered on 16 Jan 2017

1 answer

159 views

How to add a second field for editing to EditorTemplateName?

How can I edit a combination of two fields in the template?

columns.Bound(b => b.BeginDate)
.ClientTemplate("#= getDates(BeginDate,EndDate) #")
.EditorTemplateName("ClientEditor");

ClientTemplate - no problem, shows that you need and how you need just two field

EditorTemplateName:

@model DateTime?

<div>@(Html.Kendo().DatePickerFor(m => m))</div>

<div>@(Html.Kendo().DatePickerFor( ?????? ))</div>

columns.Bound(b => b) - is not working :(

.EditorViewData(new { endDate = #= EndDate # }) - is not working :(

Grid

answered on 16 Jan 2017

4 answers

1.3K+ views

[Solved] Programatically remove HTML element within Editor

I use the Kendo UI Editor using the MVC like this:

@(Html.Kendo().EditorFor(m => m.Content)

.Name("Content")

.Encode(false)

.Immutables(true)

.StyleSheets(css => css

.Add(Url.Content("~/Content/dfw/dfTemplateEditor.css"))

)

.HtmlAttributes(new { style = "width:100%;height:100%;min-height:100%" })

.Events(events => events

.Select("templateEditor_onSelect")

)

.Resizable(resizable => resizable.Content(true).Toolbar(true))

I have html in the editor like this:

<h1 style="text-align:left;"><strong>Title</strong></h1>

<div id="xxx">HELP ME I WANT REMOVED!</div><p> </p>

<h1 style="text-align:left;"><strong>Another Title</strong></h1>

I want to programatically remove the div where id="xxx" but cant get it to work.

I've tried the following all didn't work:

var editor = $("#Content").data("kendoEditor");

//NOTE event looking for the named element fails

if ($('#xxx').length > 0) {

//never gets here..

alert('I EXIST!');

}

//Failed Attempt 1

$('#xxx').remove();

editor.update();

//Failed Attempt 2

editor.body.remove($('#xxx'));

editor.update();

Editor

answered on 16 Jan 2017

1 answer

460 views

content is not getting saved in kendo editor

kendo script on aspx code:

$(document).ready(function () {

$("textarea[id$='txt_EmailBody']").kendoEditor({
tools: [
"dialogInsert", "bold", "italic", "underline", "fontName", "style", "fontSize", "justifyLeft", "justifyCenter", "justifyRight", "insertUnorderedList", "insertOrderedList", "foreColor", "backColor", "indent", "outdent", "createLink", "unlink", "insertImage", "createTable", "viewHtml"
],
change: Clearbuttonvisible,
encoded: false,
value: '',
messages: {
fontNameInherit: "Select font",
fontSizeInherit: "Select font size"
},

immutables: true,

stylesheets: [
"../kendo/kendo.css",
"../Styles/corev15.css"
]

});

on button save I try to save email body (while debugging I found here I can see full text whatever is written/updated in in email body from UI) but it is not getting saved properly something is geeting missed out.I am dealing the below html as email body-

<SPAN style="LINE-HEIGHT: 115%"><FONT size=3> 
<P class=MsoNormal style="MARGIN: 0in 0in 12pt; LINE-HEIGHT: normal"><FONT size=7 face=Georgia><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><EM><STRONG>Independence Checkpoint</STRONG></EM></SPAN></FONT></P>
<P class=MsoNormal style="MARGIN: 0in 0in 12pt; LINE-HEIGHT: normal"><FONT size=5 face=Georgia><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><EM><STRONG>Global Independence</STRONG></EM></SPAN></FONT></P>
<P class=MsoNormal style="MARGIN: 0in 0in 12pt; LINE-HEIGHT: normal"><FONT size=3 face=Georgia><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"></SPAN></FONT> </P>
<P class=MsoNormal style="MARGIN: 0in 0in 12pt; LINE-HEIGHT: normal"><FONT color=#800000 size=5><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><FONT color=#800000 face=Georgia><STRONG>Description:</STRONG></FONT></SPAN></FONT></P>
<P class=MsoNormal style="MARGIN: 0in 0in 12pt; LINE-HEIGHT: normal"><FONT size=3><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><SPAN style="FONT-SIZE: 12pt; LINE-HEIGHT: 115%"><FONT face=Georgia>The dispensation you requested for the relationship below in Independence Checkpoint has been reviewed and responded to by your territory Partner Responsible for Independence (PRI). </FONT></SPAN></SPAN></FONT></P>
<BLOCKQUOTE style="MARGIN-RIGHT: 0px" dir=ltr>
<P class=MsoNormal style="MARGIN: 0in 0in 12pt; LINE-HEIGHT: normal"><FONT size=3><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><SPAN style="FONT-SIZE: 12pt; LINE-HEIGHT: 115%">
<TABLE class=MsoNormalTable style="BORDER-TOP: medium none; BORDER-RIGHT: medium none; BORDER-COLLAPSE: collapse; BORDER-BOTTOM: medium none; MARGIN: auto auto auto -18.25pt; BORDER-LEFT: medium none; mso-border-alt: solid windowtext .5pt; mso-yfti-tbllook: 1184; mso-padding-alt: 0in 5.4pt 0in 5.4pt; mso-table-layout-alt: fixed" cellSpacing=0 cellPadding=0 width=786 border=1>
<TBODY>
<TR style="mso-yfti-irow: 0; mso-yfti-firstrow: yes">
<TD style="BORDER-TOP: windowtext 1pt solid; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 166.25pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt" vAlign=top width=222>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal" dir=ltr><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>Issuer/Instrument Name<?xml:namespace prefix = "o" ns = "urn:schemas-microsoft-com:office:office" /><o:p></o:p></SPAN></B></P></TD>
<TD style="BORDER-TOP: windowtext 1pt solid; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 64.15pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt" vAlign=top width=86>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>Entity</SPAN></B><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'><o:p></o:p></SPAN></B></P></TD>
<TD style="BORDER-TOP: windowtext 1pt solid; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 124.85pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt" vAlign=top width=166>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>Relationship Type</SPAN></B><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: "Times New Roman"; mso-hansi-font-family: Calibri; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'><o:p></o:p></SPAN></B></P></TD>
<TD style="BORDER-TOP: windowtext 1pt solid; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 160.85pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt" vAlign=top width=214>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>Owner/Ownership Type<o:p></o:p></SPAN></B></P></TD>
<TD style="BORDER-TOP: windowtext 1pt solid; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 73.4pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt" vAlign=top width=98>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><B style="mso-bidi-font-weight: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>Folder<o:p></o:p></SPAN></B></P></TD></TR>
<TR style="mso-yfti-irow: 1; mso-yfti-lastrow: yes">
<TD style="BORDER-TOP: #d4d0c8; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 166.25pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: windowtext 1pt solid; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt" vAlign=top width=222>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>#Issuer/Security Name#<o:p></o:p></SPAN></P></TD>
<TD style="BORDER-TOP: #d4d0c8; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 64.15pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt" vAlign=top width=86>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>#Entity#<o:p></o:p></SPAN></P></TD>
<TD style="BORDER-TOP: #d4d0c8; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 124.85pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt" vAlign=top width=166>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>#Relationship Type#<o:p></o:p></SPAN></P></TD>
<TD style="BORDER-TOP: #d4d0c8; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 160.85pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt" vAlign=top width=214>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>#Owner/Ownership Type#<o:p></o:p></SPAN></P></TD>
<TD style="BORDER-TOP: #d4d0c8; BORDER-RIGHT: windowtext 1pt solid; WIDTH: 73.4pt; BORDER-BOTTOM: windowtext 1pt solid; PADDING-BOTTOM: 0in; PADDING-TOP: 0in; PADDING-LEFT: 5.4pt; BORDER-LEFT: #d4d0c8; PADDING-RIGHT: 5.4pt; BACKGROUND-COLOR: transparent; mso-border-alt: solid windowtext .5pt; mso-border-left-alt: solid windowtext .5pt; mso-border-top-alt: solid windowtext .5pt" vAlign=top width=98>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style='FONT-SIZE: 12pt; FONT-FAMILY: "Georgia",serif; COLOR: black; mso-fareast-font-family: "Times New Roman"; mso-bidi-font-family: "Times New Roman"; mso-themecolor: text1'>#Folder#<o:p></o:p></SPAN></P></TD></TR></TBODY></TABLE></SPAN></P></BLOCKQUOTE></SPAN></FONT>
<P><FONT size=5><FONT color=#800000><STRONG><FONT face=Georgia>Action Required:</FONT></P></STRONG></FONT></FONT>
<P><FONT size=3><SPAN style="FONT-SIZE: 12pt; COLOR: black; LINE-HEIGHT: 107%; mso-fareast-font-family: 'Times New Roman'; mso-bidi-font-family: 'Times New Roman'"><FONT face=Georgia>This is only a notification and no action is required. <SPAN style="mso-spacerun: yes"> </SPAN><SPAN style="mso-spacerun: yes"> </SPAN>Follow the link to your Independence Checkpoint portfolio and view the “Queue Details” section with the dispensation status.<o:p></o:p></FONT></SPAN></P>
<P><FONT face=Georgia> </FONT></FONT><SPAN style="COLOR: #0070c0; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p><FONT size=3 face=Georgia><SPAN style="COLOR: black; mso-fareast-font-family: 'Times New Roman'; mso-themecolor: text1">#Link to Checkpoint#</SPAN></FONT></o:p></SPAN></P>
<P><SPAN style="COLOR: #0070c0; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p><FONT size=3 face=Georgia><SPAN style="COLOR: black; mso-fareast-font-family: 'Times New Roman'; mso-themecolor: text1"></SPAN></FONT></o:p></SPAN> </P>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style="COLOR: #0070c0; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p><FONT size=3 face=Georgia><SPAN style="COLOR: black; mso-fareast-font-family: 'Times New Roman'; mso-themecolor: text1"></SPAN></FONT></o:p></SPAN></P>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style="COLOR: #0070c0; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p><FONT size=3><FONT face=Georgia><SPAN style="COLOR: black; mso-fareast-font-family: 'Times New Roman'; mso-themecolor: text1"><SPAN style="mso-spacerun: yes"></SPAN></SPAN><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p></o:p></SPAN></FONT></FONT></o:p></SPAN></P>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><SPAN style="COLOR: #0070c0; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p><FONT color=#800000 size=5><SPAN style="COLOR: black; mso-ascii-font-family: Calibri; mso-fareast-font-family: 'Times New Roman'; mso-hansi-font-family: Calibri; mso-bidi-font-family: 'Times New Roman'"><o:p><FONT color=#800000 face=Georgia><STRONG>Questions:</STRONG></FONT></o:p></SPAN></FONT></o:p></SPAN></P>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><FONT face=Georgia></FONT> </P>
<P class=MsoNormal style="MARGIN: 0in 0in 0pt; LINE-HEIGHT: normal"><FONT face=Georgia>- Please do not reply to this automated notification<BR>- Contact your Partner Responsible for Independence (PRI) or a PRI team member within your local Independence Office. A Listing of territory PRI's is available in the "Independence Organisation & Key Contacts" section of the Global Independence Portal.</FONT></P></FONT></SPAN>
<P> </P>

Editor

answered on 16 Jan 2017

3 answers

220 views

[Solved] Mix stacked and unstacked columns

Hi, in my scenario I have for example 4 series of the type column. The first two have to be unstacked columns. The other two have to be stacked on each other.

Fo xample:

series: [

{ name: "India", data: [3.907, 7.943, 7.848, 9.284, 9.263, 9.801, 3.890, 8.238, 9.552, 6.855], stack: false},
{ name: "Russian Federation", data: [4.743, 7.295, 7.175, 6.376, 8.153, 8.535, 5.247, -7.832, 4.3, 4.3], stack: false},
{ name: "Germany", data: [0.010, -0.375, 1.161, 0.684, 3.7, 3.269, 1.083, -5.127, 3.690, 2.9], stack: "stack"}
{ name: "World", data: [1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, -2.245, 4.339, 2.727], stack: "stack"}

]

It appears that either all of the columns have ot be stacked or to be unstacked.

If this is true, is there any workaround to mix stacked and unstacked columns?

Thank you!

Best regards

Charts

answered on 16 Jan 2017

3 answers

124 views

spreadsheet relies on en-US months only for dates in Dynamicfilter

I'm using the componentized version of KendoUI (v2016.3.1028) and I ran across a few oddities. The first being that the spreadsheet component appears to only use the en-US culture for the DynamicFilter property. Looking at kendo.web.js, there is this code block (see line 1 below):

1.kendo.cultures['en-US'].calendar.months.names.forEach(function (month, index) {

2. kendo.spreadsheet.DynamicFilter.prototype[month.toLowerCase()] = function (value) {

3. if (value instanceof Date) {

4. return value.getMonth() === index;

5. }

6. return false;

7. };

8.});

There doesn't appear to be a culture property that can be set on the spreadsheet kendo config, so I was curious if it's possible to even adjust the culture for the dates in the DynamicFilter to better respect localization?

Secondly, we include a number of culture localization files with our kendo.datpicker.js component so we can internationalize the text for datepicker usages. Unfotunately, adding the en-US culture to the datepicker becomes a problem for the spreadsheet which takes a dependency on datepicker. Looking at the code below from kendo.core.js, you can see that there is a function (called on file load) which will take in a culture (line 13 shows it's invoked with en-US) and add the calendar property to that particular culture. This calendar property is only used by the spreadsheet component, which assumes en-US, likely because this kendo.core.js only does this for en-US. It appears that the work-around would be to simply have the spreadsheet use the calendar's.standard property instead of assuming the kendo.cultures dictionary won't be updated between kendo.core.js load and the load of the kendo.web.js for spreadsheets. This could be achieved by exposing a property on spreadsheet for datePickerCulture which falls back to en-US by default. In any case, this is what drives the DynamicFilter property code for the spreadsheet and when we load a new culture for en-US, we lose the calendar property. We've worked around this by loading the culture files for the localizations we want, calling kendo.culture('en-US') to get the calendar property, then loading the kendo.spreadsheet.js with it's dependencies. Is this the right approach, or am I missing some instructions?

01.kendo.culture = function (cultureName) {

02. var cultures = kendo.cultures, culture;

03. if (cultureName !== undefined) {

04. culture = findCulture(cultureName) || cultures[EN];

05. culture.calendar = culture.calendars.standard;

06. cultures.current = culture;

07. } else {

08. return cultures.current;

09. }

10.};

11.kendo.findCulture = findCulture;

12.kendo.getCulture = getCulture;