Questions on Kendo UI for jQuery Forum

6 answers

630 views

TreeView with remote hierarchical datasource

I have this datasource

var HDS = new kendo.data.HierarchicalDataSource({

error: raiseAjaxErrorWindow,

transport: {

read: {

url: HDS_URL,

dataType: "jsonp"

}

},

schema: {

model: {

id: "id",

hasChildren: "hasChildren",

data: "data"

}

});

and this tree view config

    $("#treeview").kendoTreeView({

        dataSource: HDS,

        dataTextField: "text",

        dragAndDrop: false,

        select: onSelect,

        expand: onExpand,

        collapse: onCollapse

    });

The HDS url delivers a callback that looks like

jQuery18209300398211926222_1361181052330(
[{"id":"2a1bfc85-06d5-4702-bc92-d659fcae9d39",
"text":"Group 1",
"hasChildren":"1",
"data":{"type":"1","depth":2,"color":"red","flavor":"up"}
}])

call this the foobar node.

How do I add extra rendering to the tree node to display the items in the data field?

When a node having children is opened, the HDS url is automatically ajaxed with data id=<id of node>.

Is there a way to configure the transport.read so that when it is to be opened, it will use some or all of the the extra data of the foobar node when ajaxing the url. ?

For instance, I would like the HDS to be called with the additional data depth=2&type=1

If so, where would I put this little magic ?

Thanks,
Richard

TreeView

answered on 19 May 2020

12 answers

659 views

plot lines or bands on scatter charts?

I would like to draw a line parallel to the X axis on a scatter chart at the average of the Y values. I see plot bands listed for other types of charts, but nothing for scatter charts. For run, I tried adding a plotBands config to the yAxis element of my scatterline chart, but nothing shows up.

Is there a plot line feature available for scatter charts?

I didn't see anything in the documentation:
http://demos.telerik.com/kendo-ui/scatter-charts/index

Charts

answered on 19 May 2020

7 answers

1.1K+ views

Value Axis Label Formatting

Hello,

I have the value axis labels shown in the "current" screenshot. I'm hoping to format them as shown in the "desired" screenshot, ie. displaying "25000" as "$25k". I am able to add the "$" and "k" using valueAxis.labels.format. But I'm unable to perform math on the value itself or remove the last two zeros.

Any help is greatly appreciated.

Thanks!

Charts

answered on 19 May 2020

1 answer

202 views

Drag & drop support

I'm very excited to see the birth of this new component. Does the component support drag & drop. My use case would be to have a tilelayout dashboard area to which I would like to drag & drop new items from a side toolbar.

Looking at the reference, it doesn't seem that this component currently support dynamic changes (add/remove) at all. Is that right? And if so, is it on the roadmap?

Best regards,
Ron

TileLayout

answered on 19 May 2020

2 answers

2.0K+ views

Closing a Kendo Confirm Dialog

I have the following code to present a confirmation to the user but I am not sure how to close it ..

kendo.confirm("Are you sure that you want to Update the System Cache? (<strong>Recommended<strong>) </br></br> If Yes do not navigate away from this page")
.then(function () {
$('body').addClass('waiting');
$('html,body').css('cursor', 'wait');
$('btnUpdateCache').addClass('disabled');
kendoConsole.log("Updating cache data please wait");
kendoConsole.log("Do not navigate away from this page");
$('#console-log').show();
CLOSE IT HERE <<<<<
updateSystemCache();
}, function () {
//kendo.alert("You chose to Cancel action.");
});

Given that code how would I close it?

Dialog

answered on 19 May 2020

3 answers

76 views

gantt data source filtered by date focuses on first interval date

Hi,

I implemented datasource filtering on my gantt (for jquery) widget which includes filtering of elements by start and end date. In terms of filtering logic, everything works fine, but this introduced interesting behaviour with my gantt. After any action (update of tasks via drag-n-drop for example), gantt is focused to the beginning of filter interval.

I did some debugging and I came to piece of code in kendo library (displayed below) which seems to be cause of the problem.

Is there any way to prevent this focusing, because it doesn't make much sense to scroll there if i change task somewhere in the middle of range.

Thank you

_render: function (tasks) {

var view = this.view();

var range = this._range(tasks);

var date = view.options.date;

this._tasks = tasks;

view.range(range);

view.renderLayout();

view.render(tasks);

if (date) {

view._scrollToDate(date);

}

Gantt

answered on 19 May 2020

4 answers

12.6K+ views

How to set default values to a grid when adding new row

I'd like to set default values for a column when I add a new row to a grid.

How would I do that?

Thank you

Grid

answered on 18 May 2020

1 answer

710 views

Kendo UI grid with batch editing not posting to controller

I have create a kendo grid with batch editing using https://demos.telerik.com/kendo-ui/grid/editing for reference (using your demo service as suggested for my controller: https://github.com/telerik/kendo-ui-demos-service/blob/master/demos-and-odata-v3/KendoCRUDService/Controllers/ProductsController.cs).

The grid will read the data fine, but when I go to create the controller is unable to deserialize the "models" passed to it (as detailed in the parameterMaps function). After reading through various Telerik threads, I have tried ensuring editing mode is set to "incell" and ensuring batch mode is set to true.

Do you know what I'm doing wrong that's stopping the data from binding?

Kendo grid

<div id="grid"></div>

<script>

$(document).ready(function () {

var crudServiceBaseUrl = "/RegulationIndex",

dataSource = new kendo.data.DataSource({

batch: true,

transport: {

read: {

url: crudServiceBaseUrl + "/GetRegulations",

dataType: "json",

type: "GET"

},

update: {

url: crudServiceBaseUrl + "/UpdateRegulations",

dataType: "json",

type: "PUT"

},

destroy: {

url: crudServiceBaseUrl + "/DeleteRegulations",

dataType: "json",

type: "DELETE"

},

create: {

url: crudServiceBaseUrl + "/AddRegulations",

dataType: "json",

type: "POST"

},

parameterMap: function (options, operation) {

if (operation !== "read" && options.models) {

return { models: kendo.stringify(options.models) };

}

},

pageSize: 20,

schema: {

model: {

id: "Id",

fields: {

Id: { editable: false },

LastReviewedDate: { editable: false },

LastReviewedBy: { editable: false }

}

});

$("#grid").kendoGrid({

dataSource: dataSource,

navigatable: true,

pageable: true,

height: 550,

toolbar: ["create", "save", "cancel"],

columns: [

{ field: "Continent", width: 120 },

{ field: "Area", width: 120 },

{ field: "Country", width: 120 },

{ field: "Service", width: 120 },

{ field: "B2BOrB2C", title: "Customer Type", width: 120 },

{ field: "RegulationName", title: "Regulation Name", width: 120 },

{ field: "LastReviewedDate", format: "{0:dd/MM/yyyy}", width: 100 },

{ field: "LastReviewedBy", width: 100 },

{ command: "destroy", title: " ", width: 150 }],

editable: "incell"

});

function customBoolEditor(container, options) {

$('<input class="k-checkbox" type="checkbox" name="Discontinued" data-type="boolean" data-bind="checked:Discontinued">').appendTo(container);

}

</script>

Controller action

[HttpPost]

[ProducesResponseType(StatusCodes.Status400BadRequest)]

[ProducesResponseType(StatusCodes.Status404NotFound)]

public async Task<IActionResult> AddRegulations()

{

var logMessage = new LogMessageFactory(this.GetType().Name, MethodBase.GetCurrentMethod().DeclaringType)

.LogMessage;

try

{

var body = JsonConvert.DeserializeObject<IEnumerable<RegulationViewModel>>("models");

var gridRegulations = new List<RegulationViewModel>();

if (body != null)

{

if (!ModelState.IsValid)

{

return BadRequest(ModelState);

}

else

{

foreach (var reg in body)

{

RecordUserDateForRecordChange(reg);

var regulation = await _webApiClientSession.RegulationsWebApiClient.CreateRegulationAsync(reg);

var regulationViewModel = _mapper.Map<Regulation, RegulationViewModel>(regulation);

gridRegulations.Add(regulationViewModel);

}

_logger.LogDebug(logMessage);

return Json(gridRegulations);

}

else

{

_logger.LogDebug(logMessage + "Failed to " + ControllerContext.HttpContext.Request.Method);

return BadRequest();

}

catch (Exception e)

{

_logger.LogError(e, logMessage);

return NotFound();

}

Grid

answered on 18 May 2020

3 answers

158 views

initiate the search functionality from outside the grid

Is there a way to programmatically initiate the built in grid search functionality from outside the grid?

I am working on updating a couple of old sites from before kendo had built in search functionality. I built my own search function and added a text box outside of the grid for the user to search all of the columns. I would like to switch from my custom search code to the built in grid search, but i need to leave the search ui the same.

TIA,

Logan

Grid

answered on 18 May 2020

3 answers

83 views

Drill down to view underlying data for calculated cells

Hi,

With PivotGrid is it possible to view the underlying data that makes up a calculated value. For example clicking on a cell and seeing all the rows that make up the calculated value for that cell.

Cheers,

PivotGrid

answered on 18 May 2020