Hello,

In my solution, I use AngularJs and package @progress/kendo-ui@2018.2.704.

Today I updated the package to latest version and I encountered weird issue regards to kendo dropdownlist.

In place where we use brackets and property name like {{property}}, kendo instead of displaying property value shows {&zeroWidthSpace;{property}&zeroWidthSpace;}.

Does anyone know what was changed and produced that issue and how I can fix that?

I've implemented a boxplot chart with the six values, and I'm using the outliers field to display comparison data - formatted in another colour and sufficiently large, it looks great.

However the feedback from the client is that they would like the outlier value to display in the tooltip when hovering over the box and whisker chart. Is there any way this can be done?

Hi

I am trying to load the OrgChart in jquery using the example provided in documentation but for some reason whenever it tries to load the datasource by invoking the control kendoOrgchart method it gives the error:

Im referencing the below files in my project.

Get the error on below line:

Please advise what could be the problem.

Thanks

Hi

For example, I want to change Tags options when press button.

I know Kendo has method and set option but I changed your some Tags options in my project and your setOption method does not work in all of Tags. so, I want setOption function codes. can you help me?

Thanks

Hi All,

Currently we are using kendo grid in one of the application developed in  Outsystem tool, we have a grid with the column- Select(used checkbox),ID, column3,..............

In order to achieve some functionality, when user clicks on get selected Record (button) we need the checkbox value(true or false) and the first column value (ID).

Can anyone help me on this please?

Thanks

Raj

Hi, I'm using the kendo form to build an 'order form'.

The form has pre-existing Vendors to select which cascades to a list of pre-existing Sites (Customers).
However, I also need to be able to add sites - which I have done via a POST method.

The issue that I am facing is that after I have done this, I can't figure out how to refresh the 'SiteCode' MultiColumnComboBox - nothing I have tried is able to get the control to populate with the new data, even though i am able to see the new data in the local array that it's being stored in.

I have tried multiple methods of implementing the transportation layer

• Using 'read()' on varying objects (can't figure out which one is correct for a form object) to no effect
• Setting the SiteCode dataSource to a secondary "filtered" list which is filled by the VendorCode select event
• Using 'serverfiltering' and a standard kendo remote dataSource but unfortunately I don't believe the API I am working with is compatible with the server filtering options (I can only filter by adding a parameter to the url e.g. '&fltFilterName=FilterValue')
  
  Below are the two main objects I am concerned with:

{
    field: "VendorName", editor: "MultiColumnComboBox", label: "Partner/Vendor Name:", validation: { required: true },
    delay: 0,
    editorOptions: {
        placeholder: "Select vendor",
        dataTextField: "VendorName",
        dataValueField: "VendorCode",
        height: 300,
        columns: [
            { field: "VendorName", title: "Vendor Name:", width: 300 },
            { field: "VendorCode", title: "Vendor Code:", width: 150 },
            { field: "TerritoryCode", title: "Territory Code:", width: 150 },
            { field: "TerritoryName", title: "Territory Name:", width: 300 },
        ],
        filter: "contains",
        dataSource: slData.partners,
    },
},
{
    field: "SiteName",
    label: "Site Name:",
    delay: 0,
    validation: { required: true },
    editor: "MultiColumnComboBox",
    editorOptions: {
        autoBind: false,
        placeholder: "New site name",
        dataTextField: "SiteName",
        dataValueField: "SiteName",
        cascadeFrom: "VendorName",
        height: 400,
        columns: [
            { field: "VendorCode", title: "Vendor Code:", width: 200},
            { field: "SiteCode", title: "Site Code:", width: 200 },
            { field: "SiteName", title: "Site Name:", width: 300 },
            { field: "warning", width: 200,
                template: '<span style="padding: 8px 9px !important;" class="badge-general badge-#:data.Status#">#:data.DaysRemaining# Days Remaining</span>',
                headerTemplate: ' '
            }
        ],
        filter: "contains",
        dataSource: slData.sites,
        select: selectSiteName,
        noDataTemplate: $("#noDataTemplate").html(),
        },
        dataBound: function() {
            initSiteStatusBadges()
        }
    }
},

dataSource: {
    transport: {
        read: createDataURL("Order", "CustomerVendorSite", `&fltVendorCode=${getFormVendorCode()}` ) , 
        dataType: "json",
        cache: false,
    },
    filter: { field: "SiteCode", operator: "eq", value: e.data.SiteCode }
},

Hi, 

within the columns definition of my grid I want to be able to call a function as the template.

currently I have:

 {field: 'recommended', title: 'Recommended', template: '# if(recommended)' + '{# <span class=\"glyphicon glyphicon-ok\"></span> #}' + 'else{# <span class=\"glyphicon glyphicon-ok\"></span> #}#'},

and I would like to have

 {field: 'recommended', title: 'Recommended', template: generateFlagTemplate(recommendedFieldValue)},

defining the function as

function generateFlagTemplate(field){
    return kendo.template("# if (field)" + "{# <span class=\"glyphicon glyphicon-ok text-success\"></span> #}" + "else {# <span class=\"glyphicon glyphicon-remove text-grey\"></span> #}#");
}

how can I pass the 'recommended' field value to the function?

I would like to have the function because the same template will be used in different places and saves me from having to duplicate my code.

thanks

Hello,

I tried to achieve Server-side grouping function with Kendo UI grid. The grid is grouping by two groups. Below is the grid configuration:

Below is the formated json data returned from server fetching the first grouping data, the grid display the data without any problem.

Then I expanded one of the first group to fetch the second group data, the server return the same formated json data:

But this time, the kendo grid throw this exception:

My chart as below:

$("#myChart).kendoChart({
                chartArea: {
                    height: 50
                },
                seriesDefaults: {
                    spacing: 0,
                    gap: 0,
                    margin: 0,
                    padding: 0,
                    type: "bar",
                    stack: {
                        type: "100%"
                    }
                },
                series: [
                    {
                        labels: {
                            visible: true,
                            position: "center",
                            font: "bold 16px arial",
                            color: "black",
                            format: "{0}%",
                            template: "# if (value == 0) { #### } else if (value < 7) { ##=value## } else { ##=value#%# } #",
                            background: null
                        },
                        data: [80],
                        color: "#11fa00"
                    }, {
                        labels: {
                            visible: true,
                            position: "center",
                            font: "bold 16px arial",
                            color: "black",
                            format: "{0}%",
                            template: "# if (value == 0) { #### } else if (value < 7) { ##=value## } else { ##=value#%# } #",
                            background: null
                        },
                        data: [0],
                        color: "#0026ff"
                    }, {
                        labels: {
                            visible: true,
                            position: "center",
                            font: "bold 16px arial",
                            color: "black",
                            format: "{0}%",
                            template: "# if (value == 0) { #### } else if (value < 7) { ##=value## } else { ##=value#%# } #",
                            background: null
                        },
                        data: [0],
                        color: "yellow"
                    }, {
                        labels: {
                            visible: true,
                            position: "center",
                            font: "bold 16px arial",
                            color: "black",
                            format: "{0}%",
                            template: "# if (value == 0) { #### } else if (value < 7) { ##=value## } else { ##=value#%# } #",
                            background: null
                        },
                        data: [20],
                        color: "red"
                    }
                ],
                valueAxis: {
                    min: 0,
                    max: 1,
                    line: {
                        visible: false
                    },
                    minorGridLines: {
                        visible: false
                    }
                },
                categoryAxis: {
                    line: {
                        visible: false
                    },
                    minorGridLines: {
                        visible: false
                    }
                },
                valueAxes: {
                    visible: false,
                    majorGridLines: {
                        visible: false,
                    }
                }
            });

Please help me understand what is the difference and why this issue is happening. Thanks

Hello All,

I have a gird with several columns, whose data source is a json(RepProjectData) with more than 500 records. with 7 checkboxes in each row.

I need to implement select all feature. In this when a user checks the checkbox on header then all the below checkboxes(in same column) must get selected.

 headerTemplate: "<span class='title-vertical'><input type='checkbox' class='chkheaderBC'> Business Case</span>",

 template: function (e) {
                if (e.RepBusinessCase == true) {
                    return dirtyField(e, 'RepBusinessCase') + '<input type="checkbox" checked class="chkbxBusinessCase1" />';
                }
                else {
                    return dirtyField(e, 'RepBusinessCase') + '<input type="checkbox" class="chkbxBusinessCase1" />';
                }
            }

For this, I have written below code on data bound

   $('.chkheaderBC').change(function (e) {

                   checkAll(e, "RepBusinessCase")

  });

chekAll function-

 function checkAll(e, FieldName) {
        displayLoading();
        var checked = e.target.checked;
        var currentGrid = $("#gridGenerateDocument").data("kendoGrid");
        var data = currentGrid.dataSource.view();
        var rowCnt = RepProjectData.length;   
            for (var i = 0; i < data.length; i++) {
                data[i].set(FieldName, checked);
            }
    }

This code is working and solve the purpose when there are <100 records. But when there are >200 records then it is taking longer than expected. Is there any other way to perform this action with minimum time?

Thanks in Advance :)