Hi,

I have some question,how to disable column in popup grid.I have code :

View:

@model DevRedsMk3.Models.NpvCalculation

<style>
    .k-grid {
        font-size: 12px;
    }
</style>

<div>
    @(Html.Kendo().Grid<DevRedsMk3.Models.NpvCalculation>()
        .Name("NpvCalculation")
        .Columns(columns =>
        {
            columns.Bound(p => p.NpvCalculationId).Hidden();
            columns.ForeignKey(p => p.TransactionId, (System.Collections.IEnumerable)ViewData["custTrans"], "TransactionId", "TransactionId").Title("TransactionId ID");
            columns.Bound(p => p.LastPayment).Title("Last Payment");
            columns.Bound(p => p.OutstandingAmount).Title("Outstanding Amount");
            columns.Bound(p => p.Installment).Title("Installment");
            columns.Bound(p => p.Interest).Title("Interest");//Title("Interest").Editable(false)

            columns.Command(command => { command.Edit(); command.Destroy(); }).Width(150);
            columns.Command(c => c.Custom("OK").Text("OK").Click("OK"));
        })
        .ToolBar(toolbar =>
        {
            toolbar.Create();
        })
        .Events(e => {  e.DataBinding("onchangeevent"); })
        .Editable(editable => editable.Mode(GridEditMode.PopUp))
        .Scrollable(s => s.Height(570))
        .Sortable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
        .DataSource(datasource => datasource
             .Ajax()
             .ServerOperation(false)
             .Model(model =>
             {
                 model.Id(p => p.NpvCalculationId);

                 model.Field(p => p.Interest).Editable(false);

             })

             .Read(read => read.Action("List", "NpvCalculations"))
             .Update(update => update.Action("Update", "NpvCalculations"))
             .Create(create => create.Action("Create", "NpvCalculations"))
             .Destroy(destroy => destroy.Action("Destroy", "NpvCalculations"))

        )
    )

    <script type="text/javascript">
        function OK(e) {
            e.preventDefault();
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            
            $.ajax({
                url: "/NpvCalculations/GenerateNpvBaru",
                //data: dataItem.id,
                //data: { 'TransactionId': dataItem.TransactionId },
                data: { TransactionId: dataItem.TransactionId },
                success: function (response) {
                    //$('#viewDetails').html(response);
                    //alert('Approve done...');
                }
            });
        }
    </script>

    <script>
        function onchangeevent() {
            $('#OutstandingAmount').val("10000");
            //document.getElementById("OutstandingAmount").value = "10000";
        }

    </script>

</div>

I want in field Interest column disable,i have write code  => model.Field(p => p.Interest).Editable(false) but it did not work.

Can you help me.

Thanks,

Regadrs,

Machriza

Dear,

Firstly, I downloaded the test grid file with https://www.telerik.com/forums/razor-pages-grid-binding-with-ajax-support, I tried, the grid works.

when I added "services.AddAntiforgery(o => o.HeaderName = "XSRF-TOKEN");" to ConfigureServices,the dome of grid doesn't work， it is no response to call the read and update handler.

Test Env:VS2017 .net core 2.1 Razor, Telerik:Ver 2018.3.1017

I would appreciate it if you can give me some ideas.

thanks.

        ......

          services
                .AddMvc()
                .SetCompatibilityVersion(CompatibilityVersion.Version_2_1)
                .AddJsonOptions(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver());
                
            services.AddAntiforgery(o => o.HeaderName = "XSRF-TOKEN");

            services.AddKendo();
        }

razor page code

<h2>TestGrid</h2>

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@Html.AntiForgeryToken()

@(Html.Kendo().Grid<WebApplication8.Models.Customer>().Name("grid")
                                            .AutoBind(false)
                                            .Groupable()
                                            .Sortable()
                                            .Columns(x =>
                                            {
                                                x.Bound(c => c.Address);
                                                x.Bound(c => c.Name);
                                                x.Command(c => c.Edit());
                                            })
                                            .DataSource(d => d.Ajax()
                                                   .Read(r => r.Action("Pages", "Contact", new { handler = "ReadRecords" }).Type(HttpVerbs.Post))
                                                   .Update(u => u.Action("Customer", "Index", new { handler = "UpdateRecord" }).Type(HttpVerbs.Post))
                                                   .Model(m => m.Id(id => id.CustomerId))
                                                .PageSize(10)
                                            )
                                            .Pageable()
)



<script>
    $(function () {
        var grid = $("#grid").data("kendoGrid");

        grid.dataSource.transport.options.read.beforeSend = function (req) {
            req.setRequestHeader('RequestVerificationToken', $('input:hidden[name="__RequestVerificationToken"]').val());
        };

        grid.dataSource.transport.options.update.beforeSend = function (req) {
            req.setRequestHeader('RequestVerificationToken', $('input:hidden[name="__RequestVerificationToken"]').val());
        };

        grid.dataSource.read();
    })
</script>

second, If I removed "services.AddAntiforgery(o => o.HeaderName = "XSRF-TOKEN");" from ConfigureServices, The Grid can work fine, but the ajax event doesn't work, I really don know the why.

<input asp-for="SearchString" onchange="HandlerTest()" class="form-control" />

<script>
    function HandlerTest() {


        $.ajax({
            type: "POST",
            contentType: "application/json",
            url: "About?handler=LoginIn",
            beforeSend: function (xhr) {
                xhr.setRequestHeader("XSRF-TOKEN",
                    $('input:hidden[name="__RequestVerificationToken"]').val());
            },
            //data: { UserName: $("#UserName").val(), PassWord: $("#PassWord").val() },
            success: function (response) {
                console.log(response);
            },
            failure: function (response) {
                alert(response);
            }
        });
    }


</script>

Hi,

I am currently using a trial version of Kendo UI for ASPNet Core. For my application I am looking to use a Gantt like control.

I need to be able to show the Gantt displaying the Tasks that users need to complete. These are assigned to a particular place in a factory.

Would there be a way in this control to show the "assigned locations" down the left (where task id, title, start & end are in the example), and then all the tasks are displayed on the right on the correct location row; at the correct date/time etc.

Thanks

Ashley

I have a problem where if I add the "for" tag to my dropdown list my cascading stops working.

Here is the code that allows for selecting an item in the dropdown list which changes what is seen in the second dropdown list:

And here I have added some code so that my model gets updated when the HTML post is called:

as soon as I do that, the fist dropdown box no longer affects the second one.

the only thing I add is: for="CountryId" in the first dropdown.

The model:

Let me know if I'm doing something wrong here.  I'm creating a Web Service to service my Web Application through a REST API.  One class of methods I'm exposing provides the view models that feed into Kendo UI controls, like the grid.  I'm trying to separate the concerns of the client and server by passing the paging parameters to the service and, when the service has completed the query and reduced the results down to a specific number of items (page size) on a given page (page #), I attempt to return the results to the client using the following:

            DataSourceResult dataSourceResult = investments.ToDataSourceResult<InvestmentViewModel>(dataSourceRequest);
            dataSourceResult.Total = total;
            return Json(dataSourceResult);

On the client, I attempt to deserialize this data with:

                //Deserializing the response recieved from web api and storing into the Employee list

                dataSourceResult = JsonConvert.DeserializeObject<DataSourceResult>(result);

But I get an error message:

                Newtonsoft.Json.JsonSerializationException: 'Cannot create and populate list type System.Collections.IEnumerable. Path 'data', line 1, position 9.'

What is the proper way to deserialize the DataSourceResult JSON?

Hello,

I am using the old Jquery pie charts, these are getting populated by the model (The model will be populated by a stored procedure), however, i am trying to migrating to the new Pie chart Tag Helpers but i can not seem to use a Model as the data-source, is this possible and if so how can i achieve this?

To access item values in a template you should, as I understand it, use a construct like:

.Columns(factory => factory.Template(@<text><img title="@item.Receiver" src="/image/information.png"/></text>)

but when doing this I get the compilation error "Cannot convert lambda expression to type 'string' because it is not a delegate type".

Im trying to make custom editor template for inline edit mode i a .net core grid with tag helper

<kendo-grid name="grdKontaktpersoner" on-change="KontaktChange" deferred="true">
                    <datasource server-operation="false" type="DataSourceTagHelperType.Ajax" on-error="error_handler">
                        <transport>
                            <create url="/Omvisning/OpretKontakt" data="hentBestillerID" />
                            <read url="/Omvisning/HentKontakt" data="hentBestillerID" />
                            <update url="/Omvisning/OpdaterKontakt" />
                            <destroy url="/Omvisning/OpdaterKontakt" />
                        </transport>
                        <schema>
                            <model id="ID">
                                <fields>
                                    <field name="Navn" type="string" />
                                    <field name="E_Mail" type="string" />
                                    <field name="Tlfnr" type="string" />
                                    <field name="RefNr" type="string" />
                                </fields>
                            </model>
                        </schema>
                    </datasource>
                    <toolbar>
                        <toolbar-button name="create" text="Opret Kontaktperson" />
                    </toolbar>
                    <editable enabled="true" mode="inline" />
                    <scrollable enabled="false" />
                    <columns>
                        <column field="ID" hidden="true" />
                        <column field="Navn" title="Navn" editable="NavnEditor" />
                        <column field="E_Mail" title="Email"  width="200" />
                        <column field="Tlfnr" title="Telefonnr."   width="100"/>
                        <column field="RefNr" title="Ref. nr."  width="100" />
                        <column>
                            <commands>
                                <column-command name="edit" text="Ret"></column-command>
                                <column-command name="destroy" text="Slet"></column-command>
                            </commands>
                        </column>
                    </columns>
                </kendo-grid>

        function NavnEditor(container, options) {
            var grid = $('#grdKontaktpersoner').data('kendoGrid');
            $('<input required name="' + options.field + '"/>')
                .appendTo(container);
        }

the problem is that the options field in the template  is undefined

I have look at your documentation here:

https://docs.telerik.com/aspnet-core/tag-helpers/data-management/grid/overview#column-templates

what is im missing

Hello,

I have my labels formatted as 2011 9 (year month). Now I want to set that to the following:

sep 2011

I have tried the following:
.Labels(labels => labels.Format("{0:MMM yyyy}")

But this is not working. Someone that can provide me a solution for this?