Questions on Kendo UI for jQuery Forum

2 answers

132 views

Change event triggered when not changing virtualized dropdownlist

I have a dropdown list with virtualization (https://dojo.telerik.com/AhuQEDEL/2). When I open and close the dropdownlist without actually changing anything the change event is occasionally triggered. I reproduced the odd behavior in this this Dojo. You will notice that the "change" is logged in the console when you open and close the list without selecting anything. This behavior is also inconsistent as sometimes it logs the change and sometimes it doesn't.

Data Source

DropDownList

answered on 04 Jul 2023

1 answer

67 views

Dropdownlist with virtualization returning blank for value

https://dojo.telerik.com/ezOJuzog

I have a kendo dropdownlist with virtualization that uses a local json object (the real list is longer than my example). When I set the value and immediately try to log that new value out, I get nothing. How do I log out the value after setting it when using virtualization? Here is a dojo example where you will see it logs "The value is now:" with no answer. If I remove virtualization it logs the answer out.

Data Source

DropDownList

answered on 27 Jun 2023

0 answers

74 views

Error 400 using inline edit in Grid

Hi,

We're trying to use the inline edit functionality of the Grid using the code below. But receiving an error 400 when trying to post using the "create" function of the Kendo DataSource.

JS

const dataSourceMeetingTypes = new kendo.data.DataSource({
	transport: {
		read: endpoint + "/read",
		create: {
			url: endpoint + "/create",
			type: "POST",
			data: function (e) {
				return kendo.stringify(e);
			},
			contentType: "application/json; charset=utf-8"
		}
	},
	error: function (e) {
		//console.log(e);
	},
	schema: {
		model: {
			fields: {
				meetingType: { type: "string" },
				meetingValue: { type: "string" }
			}
		}
	},
	pageSize: 5
});

Controller

[ApiController]
[Route("create")]
public class CreateController : ControllerBase
{
	[HttpPost]
	public ActionResult Create([FromBody] MeetingTypes meetingTypes)
	{
	}
}

public class MeetingTypes
{
	public string MeetingType { get; set; }
	public string MeetingValue { get; set; }
}

But the below code works outside the Grid. The data from the javascript above - kendo.stringify(e) matches the data below. Using Postman with the below data also works with no issue.

$.ajax({
	type: "POST",
	url: endpoint + "/create",
	data: "{\"meetingType\":\"test123\",\"meetingValue\":\"test123\"}",
	contentType: "application/json; charset=utf-8"
}).done(function (response) {
});

Any help is much appreciated.

Thanks

Data Source

Grid

asked on 13 Jun 2023

1 answer

92 views

Display grid dataSource schema model field content as HTML hyperlink

I'm trying to display the content of a Kendo UI Grid dataSource schema model field as an HTML hyperlink. However, I'm getting its content as a string instead.

Here is my code:

var initDSStock = [
  {% for ligne in liste_logements %}
    {% set logement = ligne.logement %}
    {
      log_etat_log: 'test'
    },
  {% endfor %}
];

var dataSource = new kendo.data.DataSource({
  pageSize: 25,
  data: initDSStock,
  schema: {
    model: {
      fields: {
        log_etat_log: { template: '<a href="\\#">#= log_etat_log#</a>' }
      },
    },
  }
});

grid.data("kendoGrid").setDataSource(dataSource);

Is that doable? If so, how should I fix my code? Any idea?

Data Source

Grid

answered on 06 Jun 2023

1 answer

271 views

Remote .Net Core - TypeError: cannot create property 'Id' on string

I get this error when trying to bind remote data from a .Net Core endpoint to jQuery UI Grid.

Im hitting a .Net Core endpoint which returns a List<MyModel>

[HttpGet("/api/[controller]/[action]/{applicationId}/")]
public async Task<IActionResult> GetProducts(int applicationId)
{
    //return List<MyModel>
    var products = await this._mortgageApplicationService.GetMortgageApplicationProducts(applicationId);
    var json = JsonConvert.SerializeObject(products);
    return Ok(json);
}

In jQuery UI i have following javascript method which tries to display the json results.
Note I recreated the products json object locally and it worked as shown in the method below.
Why doesn't it work from the remote end point?

function getReportData() {
    var applicationId = $("#MortgageApplicationId").val();
    var url = "/api/MortgageStageProductsApi/GetProducts/" + applicationId;

    //This does NOT work
    $("#productGrid").kendoGrid({
        dataSource: {
            transport: {
                read: url,
                dataType: "json"
            },
            schema: {
                model: {
                    id: "Id",
                    fields: {
                        Id: { type: "number" },
                        ProductProvider: { type: "string" },
                        ProductTypeName: { type: "string" },
                        MortgageExpiry: { type: "string" }
                    }
                }
            },
            pageSize: 20,
            serverPaging: false,
            serverFiltering: false,
            serverSorting: false
        },
        filterable: true,
        sortable: true,
        pageable: false,
        columns: [{
            field: "Id",
            filterable: false
        }, {
            field: "ProductProvider",
            title: "Provider"
        }, {
            field: "ProductTypeName",
            title: "Product Type"
        }, {
            field: "MortgageExpiry",
            title: "Expiry"
        }
        ]
    });


    //This works using json object created using the same json returned
    var products = [
        {
            Id: 1,
            MortgageApplicationId: 2171,
            ProductProvider: "Ulster Bank",
            MortgageTermYears: 5,
            MortgageTermMonths: 10,
            MortgageRepaymentType: 1,
            ProductTypeId: 1,
            ProductTypeName: "Fixed",
            MortgageProductTermYears: 5,
            MortgageExpiry: "2025-01-21T00:00:00",
            MortgageLenderRate: null,
            MortgageAdviceFee: 120,
            ProductBrokerCommissionPercentage: 10,
            ProductBrokerCommissionFlatFee: null,
            DocumentsUploadedList: []
        },
        {
            Id: 2,
            MortgageApplicationId: 2171,
            ProductProvider: "Ulster Bank",
            MortgageTermYears: 5,
            MortgageTermMonths: 10,
            MortgageRepaymentType: 1,
            ProductTypeId: 1,
            ProductTypeName: "Fixed",
            MortgageProductTermYears: 5,
            MortgageExpiry: "2025-01-21T00:00:00",
            MortgageLenderRate: null,
            MortgageAdviceFee: 120,
            ProductBrokerCommissionPercentage: 10,
            ProductBrokerCommissionFlatFee: null,
            DocumentsUploadedList: []
        }
    ];

    $("#productGrid1").kendoGrid({
        dataSource: {
            data: products,
            schema: {
                model: {
                    id: "Id",
                    fields: {
                        Id: { type: "number" },
                        ProductProvider: { type: "string" },
                        ProductTypeName: { type: "string" },
                        MortgageExpiry: { type: "string" }
                    }
                }
            },
            pageSize: 20,
            serverPaging: false,
            serverFiltering: false,
            serverSorting: false
        },
        filterable: true,
        sortable: true,
        pageable: false,
        columns: [{
            field: "Id",
            filterable: false
        }, {
            field: "ProductProvider",
            title: "Provider"
        }, {
            field: "ProductTypeName",
            title: "Product Type"
        }, {
            field: "MortgageExpiry",
            title: "Expiry"
        }
        ]
    });
}

Data Source

Grid

answered on 18 May 2023

1 answer

54 views

Globally override or tap into all Kendo Grids

Hi,

We are looking into ways on how we can globally Html Sanitize/Purify anything that is rendered on a Kendo Grid. We are looking into the following options:

1. Create a custom widget that extends the Kendo Grid

2. Globally tap into databinding event

It would be awesome if the second option is possible.

Data Source

Grid

answered on 15 May 2023

1 answer

70 views

In my SQL query, I used the WITH clause to construct a Common Table Expression (CTE)

I once noticed the error code "ORA-00933: SQL command not properly ended" while working on a project that required creating SQL queries in an Oracle database.

The problem occurred when I attempted to utilise the WITH clause in my SQL query to construct a Common Table Expression (CTE). The inquiry was written as follows:

WITH my_cte AS (
  SELECT *
  FROM my_table
)
SELECT *
FROM my_cte
WHERE id = 1;

When I attempted to run the query, however, I received the following error message:

ORA-00933: SQL command not properly ended

This error notice perplexed me because the syntax of my query appeared correct to me. So, I read this, which suggested changing the query in order to avoid utilizing the column alias in that subquery. Is that correct? I don't think this could work. Can someone help me out?

Data Source

answered on 01 May 2023

1 answer

90 views

How to Add Planned Duration column and calculate duration using Planned End Date and Planned Start Date

I am new to KENDO UI Gantt Chart, using it for the first time, and facing lots of issues in adding new columns and calculations.

My client's requirement is to have a Duration column based on Planned Start Date and Planned End Date, column should be editable and when I change either PSD or PED duration should be updated, and vice versa that is if I update the duration my Planned End Date should also get updated accordingly.

Requesting help on this, I have attached the code.

Data Source

Editor

Gantt

answered on 19 Apr 2023

1 answer

60 views

Preselect element from kendo ui combobox thats dynamically loaded in a "popup" kendo Window

As subject says, we load the combobox in a kendo window by demand.

Hence the combobox and window are not visible by default.

I wrote a short function to preselect either the entry with ID -1 if it exists - else I want the first entry to be displayed.

My problem is the dynamic loading of all that - my commands are executed in the databound event of the combobox - but it seems not to work as expected .. when I manually enter the needed command AFTER that kendo window with the combobox is displayed it works to a 'T' but not during regular execution ..

Can you give me some hints ?

                 onComboBoxDataBound: function (evt) {
                    var widget = evt.sender;
                    if (this.dataSource.total() > 0) {
                        // delete preselection then try to select entry with id -1
                        $('#modComboBox').data('kendoComboBox').input.select();
                        $('#modComboBox').data('kendoComboBox').input.val('');
                        $('#modComboBox').data('kendoComboBox').select(function (data) {
                            return data.id == -1;
                        });
                        // no selection then select first entry
                        if (widget.select() === -1) { // hint I found in stackoverflow
                            $('#modComboBox').data('kendoComboBox').select(0);
                        }
                    }
                },

I tried "waiting" for the kendo window to be displayed - but that waiting seems to interfere with normal code execution and prevents the "popup display" from being executed so the kendo window content is displayed behind other stuff

ComboBox

Data Source

Window

answered on 18 Apr 2023

1 answer

48 views

Kendo Spreadsheet: Validating Authentication with Integrated App Before Data Loading and Triggering to Database

Dear Experts ,

I am currently working on a financial related project where I am using the Kendo Spreadsheet . However, I am facing an issue with regards to authentication and data validation.

Specifically, I would like to know if there is a solution in the Kendo Spreadsheet that can validate authentication with an integrated app before loading data and triggering data to the database.

I have researched this topic extensively, but I have not been able to find a clear solution. Therefore, I am reaching out to the community to seek your guidance and insights. Have any of you faced a similar issue? If so, how did you address it?

Any advice or solution that you can provide on this matter would be greatly appreciated. Thank you in advance for your help and expertise.