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

<script>
    function LoadGrid() {
        var Installments = $("#TxtInstallments").val();
        var LoanAmount = $("#TxtLoanAmount").val();
        var OutStandingInstallments = $("#TxtOutStandingInstallments").val();
        var LoanFormula = $("#TxtLoanCodeFormula").val();
        var LoanInterestRate = $("#TxtLoanInterestRate").val();
        var DeductionStartPeriod = $("#TxtDeductionStartPeriod").val();
        var DeductionStartYear = $("#TxtDeductionStartYear").val();

        $("#grid").kendoGrid({
            dataSource: {
                transport: {
                         read: {
                            data: { Installments: Installments, LoanAmount: LoanAmount, OutStandingInstallments: OutStandingInstallments, LoanFormula: LoanFormula, LoanInterestRate: LoanInterestRate, DeductionStartPeriod: DeductionStartPeriod, DeductionStartYear: DeductionStartYear },
                            dataType: "json",
                            url: '@Url.Action("InstallmentDisplay", "SmartWebPortal")',
                         }
                    },
                schema: {                    
                        model: {
                            fields: {
                                InstallmentNo: { type: "string" },
                                InstallmentPeriod: { type: "string" },
                                InstallmentMonth: { type: "string" },
                                Principal: { type: "string" },
                                PrincipalRepaid: { type: "string" },
                                PrincipalBalance: { type: "string" },
                                Interest: { type: "string" },
                                InterestRepaid: { type: "string" },
                                InterestBalance: { type: "string" }
                            }
                        }
                },
                pageSize: 20
            },
            //toolbar: ["search"],
            height: 155,
            scrollable: true,
            sortable: false,
            filterable: false,
            pageable: false,
            selectable: "multiple, row",
            persistSelection: true,
            columns: [
                { field: "InstallmentNo", title: "Install", width: "50px" },
                { field: "InstallmentPeriod", title: "Period" },
                { field: "InstallmentMonth", title: "Month" },
                { field: "Principal", title: "Principal" },
                { field: "PrincipalRepaid", title: "Principal Repaid" },
                { field: "PrincipalBalance", title: "Principal Balance" },
                { field: "Interest", title: "Interest" },
                { field: "InterestRepaid", title: "Interest Repaid" },
                { field: "InterestBalance", title: "Interest Balance" }
            ]
        });
    };
</script>

Controller:

Public Function InstallmentDisplay() As ActionResult

    
        Return Json(installmentsJson, JsonRequestBehavior.AllowGet)
End Function

the function returns the following string:

"{""Installments"":{""Installment"":[{""InstallmentNo"":{""#cdata-section"":""1""},""InstallmentPeriod"":{""#cdata-section"":""11/2020""},""InstallmentMonth"":{""#cdata-section"":""May 2020""},""Principal"":{""#cdata-section"":""25,000.00""},""Interest"":{""#cdata-section"":""250.00""},""PrincipalRepaid"":{""#cdata-section"":""0.00""},""InterestRepaid"":{""#cdata-section"":""0.00""},""Period"":{""#cdata-section"":""0""},""Year"":{""#cdata-section"":""0""},""PrincipalBalance"":{""#cdata-section"":""25,000.00""},""InterestBalance"":{""#cdata-section"":""250.00""}},{""InstallmentNo"":{""#cdata-section"":""2""},""InstallmentPeriod"":{""#cdata-section"":""12/2020""},""InstallmentMonth"":{""#cdata-section"":""June 2020""},""Principal"":{""#cdata-section"":""25,000.00""},""Interest"":{""#cdata-section"":""125.00""},""PrincipalRepaid"":{""#cdata-section"":""0.00""},""InterestRepaid"":{""#cdata-section"":""0.00""},""Period"":{""#cdata-section"":""0""},""Year"":{""#cdata-section"":""0""},""PrincipalBalance"":{""#cdata-section"":""25,000.00""},""InterestBalance"":{""#cdata-section"":""125.00""}}],""Rows"":{""Returned"":""2""}}}"

But am not able to assign the jquery object to the kendo grid...

Could anyone help me to provide some reference and examples for binding json data from PHP file (reading data from table) to kendo DDL (using jQuery) ?

Thanks.

Hi,

Column resizing stop work if move horizontal scroll.

You can reapet there: https://demos.telerik.com/aspnet-mvc/grid/column-resizing

Resize some columns to increase width. Move horizontal scroll and then you can't resize

Hi,

We are using Date axis line chart.We need to display a year data in the x-axis(dates), when we set baseUnit= "days", the labels are getting overlapped. So we have tried changing it to Fit, the kendo script automatically calculates average, there is no overlap in this case,but the points that are getting displayed is not matching the exact data. 

    Pls refer the attached snapshot, my data does not have any value for date 9/20/2015. Can it be made to show the points only for which the data is  available. Or please suggest how can we handle the cases when the data is more than 100.

I am using the listview with a pager. When I refresh the listview with new data I want the page to go back to page 1 so I used the page() method. It doesn't work and the debugger shows the error message "pager.page is not a function". 

Here is the code initializing the pager:

And here's where I call the method:

I have no idea why this function isn't recognized and would appreciate some help.

I've reported this before on the forum and through support tickets.

If you have a grid column with the name "Fields[3].Value" Kendo throws an exception unnecessarily when trying to filter on it.

This can be fixed by adding a period to the list of accepted characters in the FilterLexer. I've done this myself a few times and I'm a bit tired of having to rebuild it every time Kendo gets updated...

Expected token
at Kendo.Mvc.Infrastructure.Implementation.FilterLexer.Tokenize()
   at Kendo.Mvc.Infrastructure.Implementation.FilterParser..ctor(String input)
   at Kendo.Mvc.Infrastructure.FilterDescriptorFactory.Create(String input)
   at Kendo.Mvc.UI.DataSourceRequestModelBinder.BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
   at System.Web.Mvc.ControllerActionInvoker.GetParameterValue(ControllerContext controllerContext, ParameterDescriptor parameterDescriptor)
   at System.Web.Mvc.ControllerActionInvoker.GetParameterValues(ControllerContext controllerContext, ActionDescriptor actionDescriptor)
   at System.Web.Mvc.Async.AsyncControllerActionInvoker.&lt;&gt;c__DisplayClass21.&lt;BeginInvokeAction&gt;b__19(AsyncCallback asyncCallback, Object asyncState)

Hello Everyone,

I am relatively new to Kendo. I have a question is it possible to get the count of selected rows in a column and added it to the paging bar? If so how? I have highlighted the area in a screenshot.