Hi Team,

KendoListView Data Source listing structure is completely different in different KendoListView versions.

In 2019.2.619

Data is coming directly under given div

In 2020.3.1118

Data is coming under k-listview-content div

Regards,

Christy.

Hello Telerik

First check this example : https://dojo.telerik.com/oraZInUQ

Q1. When constructing a diagram like this, if the length of the textblock text becomes larger than the length of the rectangle, is there a way to control this? I wish there was a line break.

Q2. The length of the text is longer, so the selection area for the shape has increased. I want the selection area to be based on the width and height of the rectangle. Is it possible to adjust the selection area of ​​shape?

Thank you for your reply.

I have a line chart and an area chart.

I would like the area chart to be shown inside of the line chart.

How can I control the area chart's height or top margin? To keep it inside the line chart?

Here is what my chart looks like. I would like to keep the green area inside of the red. Is this possible?

https://dojo.telerik.com/@jerry/owIdiWes

 

 

Hi team,

I have a question regarding the Kendo Grid in jQuery. Is there a way to implement a functionality where clicking the header checkbox on the first page selects or deselects all rows on that page and across all pages, including updating all the header checkboxes?

Thanks,
Swapnil

Here is HTML Code of Date Picker

 

<input kendo-date-picker="" k-scope-field="dteNewDueDateDate" k-format="'yyyy-MM-dd'" k-on-change="undefined" custom-date="" ng-model="vm.target.newDueDate" required="" ng-class="{ 'is-invalid': (changeDueDateForm.dteNewDueDateDate.$dirty || changeDueDateForm.$submitted) &amp;&amp; changeDueDateForm.dteNewDueDateDate.$error.required }" ng-disabled="false" aria-label="New Due Date" name="dteNewDueDateDate" id="dteNewDueDateDate" entity="undefined" field="undefined" config="" class="ng-pristine ng-untouched k-input-inner ng-empty ng-invalid ng-invalid-required" data-role="datepicker" type="text" role="combobox" aria-expanded="false" aria-haspopup="grid" aria-controls="dteNewDueDateDate_dateview" autocomplete="off" aria-disabled="false" aria-readonly="false" aria-invalid="true" style="">

 

I have Tried this and Similar Solutions but all in Vain. Please help me to find its solution

$(document).ready(function() {   // Wait for the document to be fully loaded   // Initialize the Kendo UI DatePicker  $("#dteNewDueDateDate").kendoDatePicker({     format: "yyyy-MM-dd"    // Add any other configuration options you need  });   // Set the value after initialization  setTimeout(function() {     var datePicker = $("#dteNewDueDateDate").data("kendoDatePicker");     var targetDate = new Date('2023-12-04');     datePicker.value(targetDate);     datePicker.trigger("change");   }, 100); // Adjust the timeout duration if needed});

Hello,

I'm using PDF Viewer with PDF.js processing and want to limit the number of pages displayed when receiving a large PDF file because its rendering makes the page load very slow.

For example, I receive a file with 100 pages from the server and I want to render and display only the first 10, and if the user wants to view the rest, he can download the entire file.

I found some solution on github, but it requires changes to the source code of the kendo.js library. Can I do something similar with just the PDF Viewer API?

const MAX_PAGES = 3;

PDFJS.getDocument(params).then((doc) => {
    Object.defineProperty(doc, 'numPages', { value: Math.min(doc.numPages, MAX_PAGES) });
    this.pdfViewer.setDocument(doc);
    // Other stuff
}

Hello

i need to change custom command icon depend on row field for instance "Status" i tried this code but it doesn't work

@using EliteInsurer.Areas.Admin.Dto;
@using Kendo.Mvc.UI;
<div class="k-rtl">
    @(
        Html.Kendo().Grid<HostedTaskDto>()
        .Name("grid")
        .Columns(columns =>
        {
                columns.Bound(m => m.Status);
                columns.Command(p =>
                {
                p.Custom("StartTask").Text(" ").Click("changestatus").IconClass("#=getCommandIcon#");

            });

        })
        .ToolBar(tools =>
        {
            tools.Excel();
            tools.Create().Text(" ");
        })
        .Pageable(p => p.PageSizes(true).Input(true))
        .Sortable()
        .Filterable(fr => fr.Mode(GridFilterMode.Row))
        .Resizable(resize => resize.Columns(true))
        .Scrollable()
        .Excel(ex => ex.AllPages(true))
        .Editable(e => e.Mode(GridEditMode.InLine))
        .DataSource(dataSource => dataSource
        .Ajax()
        .GroupPaging(true)
        .PageSize(50)
        .Read("GetTasks", "Task")
        .Create("NewTask", "Task")
        .Update("EditTask", "Task")
        .Destroy("DeleteTask", "Task")
        .PageSize(20)
        .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.Status).Editable(false);
            
        })

        )
        )
</div>
<script>
    function forgeryToken() {
        return kendo.antiForgeryTokens();
    }
    
    function changestatus(e) {
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

        $.ajax({
            type: "POST",
            url: '@Url.Action("ChangeTaskStatus", "Task")',
            datatype: "json",
            traditional: true,
            data: { Id: dataItem.Id },
            success: function (data) {
                if (data.success == true) {
                    var grid = $("#grid").data("kendoGrid");
                    grid.dataSource.read();
                    alert(data.message);
                }
            },
            error: function (data) {
                alert(data.message);
                console.log(error);
            }

        });
    }
    function getCommandIcon(e) {
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
        var status = dataItem.Status;
        console.log(status);
        if (status === "1") {
            return "k-icon k-i-stop";
        } else {
            return "k-icon k-i-play";
        }
    }

</script>

On  previous updates, selected filters are showing in blue colour.

But now even applying single or multiple filters still color not changed.

 

Hi,

I need to send some dynamic parameters, (path and others), when uploading files from js.
I've tried several ways, without success. Can anyone help me?

I cannot work out how to set the CHILD grid column widths and positions. I can set all the master grid column widths and positions.

When calling grid.getOptions(), I can only see a reference to the MASTER grid column properties.

I can set all the master grid column widths and positions with this function:

function setColumFormat(){
    var grid = $("#kdClaimStatus").data("kendoGrid");  
    var options = localStorage["grid-column-options"];  
    if (options) {  
        var parsedOptions = JSON.parse(options);  
        var columns = parsedOptions.columns;
        grid.setOptions({ columns: columns });  
    }  
}

But I cannot work out how to set the CHILD grid column widths and positions. I have searched Telerik documentation and cannot find any solution.