Questions on Kendo UI for jQuery Forum

1 answer

278 views

Multiple value axis to cross categoryAxis at 0 with negative values.

Hey,

first of all here's a Dojo showing the situation:

https://dojo.telerik.com/aPaqUZOX/2

I have two valueAxes and two series, each bound to another valueAxis. As long as all values in the series are positive all works as expected, but as soon as a single value goes negative it suddenly looks really weird. The reson for that is that both valueAxis' crossthe categoryAxis at different values. mpg corsses at 0 (which is fine) but l100km crosses at -8 which is not what I'd expect.

I looked through the API and found a really promising option for the valueAxes which was "axisCrossingValue". But as you can see in the Dojo I either misunderstood this option or it just isn't working in this example.

How can I get both valueAxes to cross the categoryAxis at 0?

Best wishes

indian

Charts

answered on 30 Jul 2018

3 answers

2.3K+ views

Required Field Indicator in Column Header

I have a grid that uses inline editing, with several of the columns containing required data. When in add/edit mode, I need to add an asterisk to the column header label of each "required" field. I know that the required fields are set properly, as I get a required validation error when leaving these fields blank during either an add or update.

I've looked through the documentation for datasource and datesource.data objects, but no luck. Where can I locate the required property for each column/field in the grid data?

Grid

answered on 30 Jul 2018

2 answers

168 views

Can't get the treview instance

I'm creating a treeview in MVC using the TreeViewBuilder. like this

Html.Kendo().TreeView().Name("TreeViewTemplateBiding")....

I need to get access to the treeview instance in a script. It's not an event, so I can't rely on the tree passing the instance to my function.

I'm trying, as instructed:

var myTree = $("#TreeViewTemplateBiding").data('kendoTreeView')

This does not work, it returns 'undefined'. In fact I can see that $("#TreeViewTemplateBiding") has no data at all.

Please assist.

TreeView

answered on 29 Jul 2018

3 answers

388 views

k-textbox truncating characters, tried css options to no avail

Hello, i've tried the various css changes i've listed further below to try an get the more of the text values to show in a read only textbox and there appears to be plenty of space left, but its not being used by the textbox, please see attachement for the screen shot, so is there a way to make the textbox show about 30% more of the value on the screen, thanks very much!

<td width="9%" class="lbl-text">Position:</td>

<td width="16%">

<input class="k-textbox.large" type="text" disabled="disabled" style="border:none" data-bind="value:

bipVm.positionEmp" />

</td>

<td width="9%" class="lbl-text">Description:</td>

<td width="16%">

<input class="k-textbox.large" type="text" disabled="disabled" style="border:none" data-bind="value:

bipVm.description" />

</td>

<td width="9%" class="lbl-text">Division:</td>

<td width="16%">

<input class="k-textbox.large" type="text" disabled="disabled" style="border:none" data-bind="value:

bipVm.divisionNameEmp" />

</td>

<td width="9%" class="lbl-text">Agency:</td>

<td width="16%">

<input class="k-textbox.large" type="text" disabled="disabled" style="border:none" data-bind="value:

bipVm.agencyNameEmp" />

</td>

/*.k-textbox,*/

.k-textbox {

overflow: hidden;

white-space: nowrap;

}

.k-textbox.medium{

width: 200px !important;

}

.k-textbox .large {

width: 320px !important;

}

.wide-full {

width: 100%;

}

Window

answered on 28 Jul 2018

1 answer

141 views

webpack, typescript and angularjs example

Hi, I'm searching for something like this: repository but using the last kendo-ui for jquery with typescript, angularjs and webpack (all together).

At least could be useful to see the contents of file typings.json

General Discussions

answered on 27 Jul 2018

16 answers

3.1K+ views

[Solved] Null values showing on grid - by design?

I'm using JSON as my data transport type. When I pass in values that are null, the word "null" appears in the grid. Is this by design? Seems like it should show nothing.

Grid

answered on 27 Jul 2018

3 answers

942 views

How to preventing moving without using e.preventDefault in the moveStart

Hi,

So my title is probably a bit confusing. What I initially wanted was to not only prevent a user from resizing and deleting selective events in the but also prevent the event from appearing to be deletable when they arent. I've achieved this part successfully in a dojo (https://dojo.telerik.com/inEMEWeL) by removing the k-event-delete and k-resize-handle classes where needed. This would prevent the event from having the appearance that it can be moved and resized.

Once you've seen the dojo, I want to know, there are other classes and attributes within the event <div>, is there an attribute/element that I can alter to prevent moving of an event as well?

Thanks and kind regards,
Grant

Scheduler

answered on 26 Jul 2018

3 answers

998 views

Element rendering event

Hello!

Each kendo-element have initialization script like this:

kendo.syncReady(function()...........);

How I can define a moment when it end working and element is finally initialized and displayed.

P.S.
I want programmatically edit markup after element is displayed.

General Discussions

answered on 26 Jul 2018

4 answers

895 views

[Solved] Restricting Window Position Example is a bit jumpy

I am using a few Kendo Windows. I have finally got a bit of time to stop them from going outside of the browser screen so I thought that I would spend an hour getting this all set up and working nicely. I found the following article which I believe is meant to do what I need.

https://docs.telerik.com/kendo-ui/controls/layout/window/how-to/restrict-windows-position

I copied the code and worked it so that it was usable with my application, and I found that the widow would randomly jump to different sections of the screen as I was moving it, and sometimes off the screen completely. When I release the mouse, it seems to snap back to where my mouse is but this doesn't seem to be very restrictive.

Thinking it was me, I tested the example in the dojo on Chrome and IE, just to see if it was me, and I got the same result.

Have I misunderstood what the example is for? If not, could I get an example where it does not jump around on the screen?

Thanks,

Johannes

Window

answered on 26 Jul 2018

6 answers

1.0K+ views

Error rendering Template

I have a master grid as follows:

@(Html.Kendo().Grid<Personnel3.Models.CheckDate>()

.Name("grdCheckTimes")

.Columns(cols =>

{

cols.Template(t => { }).ClientTemplate("#=dayOfWeek[Date.getDay()]#");

cols.Bound(c => c.Date).Title("Date").ClientTemplate("#=pad('00', Date.getDate().toString(), true)#-#=monthName[Date.getMonth()]#-#=Date.getFullYear()#");

//cols.Template(t => { }).ClientTemplate("[<a href='javascript:edit()'>Edit</a>] [<a href='javascript:delete()'>Delete</a>]");

})

.ClientDetailTemplateId("checkTimesDetail")

.DataSource(ds => ds.Ajax()

.Read(read => read.Action("GeneratePayPeriodWeek", "CheckTime").Data("sendPayPeriodAndLeaveYear"))

//.Update(update => update.Action("UpdateCheckTime", "CheckTime").Data("sendPayPeriodAndLeaveYear"))

//.Destroy(destroy => destroy.Action("DeleteCheckTime", "CheckTime").Data("sendPayPeriodAndLeaveYear"))

.Model(model => model.Id("Date"))

)

here's the Template:

<script id="checkTimesDetail" type="text/x-kendo-template">

@(Html.Kendo().Grid<Personnel3.Data.in_out>()

.Name("grdInOut_#=CheckDateId#")

.Columns(cols =>

{

cols.Bound(c => c.in_date_time).Title("In Time")

.ClientTemplate("#if(in_out_explanation != ''){#<a href='javascript:void(0)'>#=in_date_time#</a>#}else{##=in_date_time##}#");

})

.DataSource(ds =>

{

ds.Ajax().Read(read => read.Action("GetCheckTimesFortheDay", "CheckTimes", new { checkDate = "#=Date.toLocaleDateString()#" }));

}).ToClientTemplate()

)

</script>

it throws the following error:

Unhandled exception at line 3827, column 3 in http://localhost:1806/Personnel/Scripts/jquery-3.3.1.js
0x800a139e - JavaScript runtime error: Invalid template:'
<div class="k-widget k-grid" id="grdInOut_#=CheckDateId#"><table><colgroup><col /></colgroup><thead class="k-grid-header"><tr><th class="k-header" data-field="in_date_time" data-index="0" data-title="In Time" id="1f073454-eafa-4f2b-b276-9dced2c5b10d" scope="col"><span class="k-link">In Time</span></th></tr></thead><tbody><tr class="k-no-data"><td colspan="1"></td></tr></tbody></table></div><script>
kendo.syncReady(function(){jQuery("\#grdInOut_#=CheckDateId#").kendoGrid({"columns":[{"title":"In Time","headerAttributes":{"data-field":"in_date_time","data-title":"In Time","id":"1f073454-eafa-4f2b-b276-9dced2c5b10d"},"template":"#if(in_out_explanation != \u0027\u0027){#\u003ca href=\u0027javascript:void(0)\u0027\u003e#=in_date_time#\u003c/a\u003e#}else{##=in_date_time##}#","field":"in_date_time","encoded":true}],"scrollable":false,"messages":{"noRecords":"No records available."},"dataSource":{"type":(function(){if(kendo.data.transports['aspnetmvc-ajax']){return 'aspnetmvc-ajax';} else{throw new Error('The kendo.aspnetmvc.min.js script is not included.');}})(),"transport":{"read":{"url":"/Personnel/CheckTimes/GetCheckTimesFortheDay?checkDate=#=Date.toLocaleDateString%28%29#"},"prefix":""},"serverPaging":true,"serverSorting":true,"serverFiltering":true,"serverGrouping":true,"serverAggregates":true,"filter":[],"schema":{"data":"Data","total":"Total","errors":"Errors","model":{"fields":{"pay_period_id":{"type":"number"},"leave_year_id":{"type":"number"},"employee_id":{"type":"number"},"in_date_time":{"type":"date"},"out_date_time":{"type":"date","defaultValue":null},"in_system_date_time":{"type":"date","defaultValue":null},"out_system_date_time":{"type":"date","defaultValue":null},"changed":{"type":"boolean","defaultValue":null},"last_in_update":{"type":"date","defaultValue":null},"last_out_update":{"type":"date","defaultValue":null},"in_out_explanation":{"type":"string"},"in_out_explanation2":{"type":"string"},"pay_period":{"type":"object"}}}}}});});
<\/script>
' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='\n <div class="k-widget k-grid" id="grdInOut_'+(CheckDateId)+'"><table><colgroup><col /></colgroup><thead class="k-grid-header"><tr><th class="k-header" data-field="in_date_time" data-index="0" data-title="In Time" id="1f073454-eafa-4f2b-b276-9dced2c5b10d" scope="col"><span class="k-link">In Time</span></th></tr></thead><tbody><tr class="k-no-data"><td colspan="1"></td></tr></tbody></table></div><script>\n\tkendo.syncReady(function(){jQuery("#grdInOut_'+(CheckDateId)+'").kendoGrid({"columns":[{"title":"In Time","headerAttributes":{"data-field":"in_date_time","data-title":"In Time","id":"1f073454-eafa-4f2b-b276-9dced2c5b10d"},"template":"';if(in_out_explanation != \u0027\u0027){;$kendoOutput+='\u003ca href=\u0027javascript:void(0)\u0027\u003e'+(in_date_time)+'\u003c/a\u003e';}else{;$kendoOutput+=''+(in_date_time)+'';};$kendoOutput+='","field":"in_date_time","encoded":true}],"scrollable":false,"messages":{"noRecords":"No records available."},"dataSource":{"type":(function(){if(kendo.data.transports[\'aspnetmvc-ajax\']){return \'aspnetmvc-ajax\';} else{throw new Error(\'The kendo.aspnetmvc.min.js script is not included.\');}})(),"transport":{"read":{"url":"/Personnel/CheckTimes/GetCheckTimesFortheDay?checkDate='+(Date.toLocaleDateString%28%29)+'"},"prefix":""},"serverPaging":true,"serverSorting":true,"serverFiltering":true,"serverGrouping":true,"serverAggregates":true,"filter":[],"schema":{"data":"Data","total":"Total","errors":"Errors","model":{"fields":{"pay_period_id":{"type":"number"},"leave_year_id":{"type":"number"},"employee_id":{"type":"number"},"in_date_time":{"type":"date"},"out_date_time":{"type":"date","defaultValue":null},"in_system_date_time":{"type":"date","defaultValue":null},"out_system_date_time":{"type":"date","defaultValue":null},"changed":{"type":"boolean","defaultValue":null},"last_in_update":{"type":"date","defaultValue":null},"last_out_update":{"type":"date","defaultValue":null},"in_out_explanation":{"type":"string"},"in_out_explanation2":{"type":"string"},"pay_period":{"type":"object"}}}}}});});\n<\/script>\n';}return $kendoOutput;' occurred

I can't figure out what I am doing wrong.

Grid

answered on 25 Jul 2018