Telerik Forums
UI for ASP.NET MVC Forum
0 answers
1 view

Hello, I'm attempting to "undo" an "invalid" card move on a taskboard between 2 cols with specified states.

I'll add the HtmlHelper code:


@(Html.Kendo().TaskBoard()
    .Name("kittingTaskBoard")
    .ColumnSettings(s =>
    {
        s.TemplateId("column-template");
        s.Width("320");
        s.Buttons(b =>
        {

        });

    })
    .Columns(c =>
    {
        c.Add().Text("On Hold").Status("2");
        c.Add().Text("New").Status("1");
        c.Add().Text("In Work").Status("3");
        c.Add().Text("Staged").Status("4");
        c.Add().Text("Verified").Status("5");
    })
    .Editable(false)
    .DataDescriptionField("ShipNumber")
    .DataTitleField("Control")
    //.DataOrderField("PriorityId")
    .DataStatusField("StatusId") 
    .TemplateId("card-template")
    .Events(events => events.MoveStart("onKitSessionStartMove").MoveEnd("onKitSessionMove"))
    .DataSource(source => source.Ajax().Read(read => read.Action("GetKittingQueue", "Fulfillment")))
    .Height("980")
    .Events(ev => ev.DataBound("onDataBound").ColumnsDataBound("onColumnsDataBound")))

I'll add the validation code:


        const manager = {
            claim: function(id, uid) {
                $.ajax('@Url.Action("ClaimKitSession", "Fulfillment")',
                    {
                        method: "Post",
                        data: getAntiForgeryToken({ id })
                    }).done(function(response) {
                    notify(response);
                }).fail(function(error) {
                    notify(error.responseJSON);
                });
            },
            valid: function(from, to) {
                console.log(`[valid]: ${from} > ${to}`);
                if ((from === "3" && to === "1") // InWork > New
                        ||
                        (from === "3" && to === "2") // InWork > OnHold
                        ||
                        (from === "4" && to === "3") // Staged > InWork
                        ||
                        (from === "5" && to === "4") // Verified > Staged
                        ||
                        (from === "1" && to === "4") // New > Staged
                        ||
                        (from === "1" && to === "5") // New > Verified
                ) {
                    return false;
                }
                return true;
            }
        }


I'll add the Move Event code:


        function onKitSessionStartMove(e) {
            state.card = null;
            state.col = "0";
        }

        function onKitSessionMove(e) {
            if (state.card !== null) {
                if (!isUndefined(e.card)) {
                    if (e.card.RowId === state.card.RowId) {
                        if (!isUndefined(e.column)) {
                            if (e.column.Status === state.col) {
                                return;
                            }
                        }
                    }
                }
            } else {
                state.card = e.card;
                state.col = e.column.Status;
                return;
            }
            state.card = e.card;
            state.prev = state.col;
            state.col = e.column.Status;

            setBadgeText();

            if (manager.valid(state.prev, state.col)) {
                if (state.col === "3") {
                    manager.claim(state.card.RowId);
                }
            } else {
                toastr.warning("Invalid action prevented, you do not have permission to perform this action",
                    "Warning",
                    { positionClass: "toast-bottom-right", containerId: "toast-bottom-right" });
            }

        }

I was wondering If i could there was a card function or something I can call when the validation fails to move it back to it's previous column?

Headygains
Top achievements
Rank 1
Veteran
 asked on 21 Oct 2021
0 answers
4 views

Hi guys,

I have a kendo window which I have controls inside the window.

The idea is to keydown what the user enters to the folderName label which creates and shows the user the name of the folder that will be created in the network drive.

see attached screen shot

so far i have this code below. But the logic is not yet correct


    function formatStringfoldername(UploadedDT) {
        debugger;
        


        var MineName = $("#SFolder").val();
        var scan_PersonsScan = $("#scan_PersonsScan").data("kendoMultiSelect").dataItems();
        var SiteCode = $("#SiteCode").data("kendoMultiColumnComboBox").dataItem();
        var descriptionMineName = SiteCode.MineName;
        var scan_EquipmentDetails = $("#scan_EquipmentDetails").data("kendoMultiSelect").dataItems();
        var scan_Projects = $("#scan_Projects").data("kendoMultiSelect").dataItems();
      
        if (descriptionMineName ==="") {
          //  var result = "N:\\Backup\\" + UploadedDT + " " + descriptionMineName;
        }
        if (MineName === "") {
       //     var result = "N:\\Backup\\" + UploadedDT + " " + descriptionMineName + " " + MineName;
        }
        else if (scan_Projects.length > 0) {
           
            $("#FolderPathstructurechange").text(`N:\\Backup\\  ${UploadedDT}   ${MineName}  ${scan_PersonsScan[0].Initials}  ${scan_Projects[0].Project.Project1}`);
        }
        else if (scan_EquipmentDetails.length > 0)
        {
            $("#FolderPathstructurechange").text(`N:\\Backup\\  ${UploadedDT}   ${MineName}  ${scan_PersonsScan[0].Initials}  ${scan_Projects[0].Project.Project1}`);
        }
       

       
       
        //var result = "N:\\Backup\\" + UploadedDT + " " + scan_PersonsScan[0].Initials + MineName;
      //  $("#FolderPathstructurechange").text($.validator.format("N:\\Backup\\" + " {0} , I'm {1} years old", [UploadedDT, "23"]));
    }

function change() {
        debugger;
        var DateScanned = $("#DateScanned").data("kendoDatePicker");
        $("#DateScanned").attr("disabled", "disabled");
        var value = DateScanned.value();
        var UploadedDT = kendo.toString(value, "yyyy-MM-dd");

        formatStringfoldername(UploadedDT);
       
    }


  @(Html.Kendo().DatePicker().Name("DateScanned") 
                                                       .Events(e =>
                                                                    {
                                                                        e.Change("change");
                                                                    }).Format("dd/MM/yyyy").ToClientTemplate())


     <div class="row">

                            @Html.Label("Short Folder Description:")
                            <div class="row mt-3">

                            </div>
                            @Html.Kendo().TextBox().Name("SFolder").HtmlAttributes(new { onInput = "formatStringfoldername();" }).ToClientTemplate()
                        </div>

any help will be appreciated.

kind regards

Tony

0 answers
4 views

Need an example of how to use a date picker to change the date field in a Keno grid. The examples I can find only show a dropdown. I have not problem get this to work on the client side. But I can not find anything that show how to return the updated value back to the server. 

Razor page:

 @(Html.Kendo().Grid<Pages.EditContract>()
                .Name("grid")
                .Editable(editable => editable.Mode(GridEditMode.InCell))
                .Columns(columns =>
                {
                    columns.Bound(p => p.StartDate);
                    columns.Bound(p => p.EndDate).ClientTemplate("#=EndDate#").Sortable(false).Width(180).Format("MM/dd/yyyy");                  
                })
                .DataSource(ds => ds.Ajax()
                    .Model(model =>
                    {
                        model.Id(p => p.Id);
                        model.Field(p => p.StartDate).Editable(false);
                        model.Field(p => p.EndDate).Editable(true);

                    })
                    .Read(r => r.Url("/Edit?handler=Read").Data("forgeryToken"))
                    .Update(r => r.Url("/Edit?handler=Update").Data("forgeryToken"))
                    .Model(m => m.Id(id => id.Id))
                    .PageSize(4)
                )
                //.Events(ev => ev.DataBound("db"))
            )

Edit Template:

@model ContractorManagment.Models.Contract

@(Html.Kendo().DatePicker()
        .Name("EndDate") // The name of the DatePicker is mandatory. It specifies the "id" attribute of the widget.
        .Format("MM/dd/yyyy")
        //.Value(Model.EndDate) // Sets the value of the DatePicker.        
    )

If it was not in a grid all you have to do is set the .Value property. But that does not work when it is in a grid.

 

Keith
Top achievements
Rank 1
 asked on 20 Oct 2021
1 answer
5 views

hallo,

i just wanna to disable the combobox when the chekcbox is checked and vice versa.

 

when i cheked, it disactivated, but when i check out (isChek == false) is not enable it. so it remain disabled.

 

any idea?

Alexander
Telerik team
 answered on 20 Oct 2021
1 answer
8 views

Hello, 

I am using the exact example give below in my project:

https://demos.telerik.com/aspnet-mvc/pdf-export

But when i browse this url in my iPhone Safari browser, I am not able to export the PDF. Export as Image and SVG works though. I am seeing the same issue in my project too. Any solution for this?

Thanks 

Meera

Eyup
Telerik team
 answered on 20 Oct 2021
0 answers
5 views

When the grid is loaded for the first time, the height of the locked column remains constant, the height of the other columns can be changed.

Locked column : " Stok No "

Fixed when changing the width of any column



Abdurrahman
Top achievements
Rank 1
 asked on 20 Oct 2021
0 answers
6 views

Hi, 

I'm working on develop web application using MVC Core (razor). One of the view will have column with running total from previous row (see picture below) . I try to use Kendo Grid (GridEditMode.InCell) to do the job and write some codes to save to database but I cannot get amount from previous row to display. The first row the users enter the number to start and the row after that will need to get the amount from previous pulse the number from column b, c, d.

Do you have any recommendation what is the better tools or widgets to use to handle all these requirement? Thank you. 

Gaysorn
Top achievements
Rank 1
 asked on 19 Oct 2021
1 answer
13 views

Hi! I've been trying to figure this out for days. I have a template that works as detail table of a Kendo grid. Inside this template i have several columns wich data I CAN SEE right. But, one column in particular, that include a client template, is always null. When i get ride of the client template i can see the data on the grid provided by the server, but each time I include the client template, the column is null (html code below)

The first column Adjunto works greats, the seconde one is always null. As it can be seen, there are other client template in the grid that work propery. What can i be doing wrong? Thanks in advance. (I added the view with the two columns righ below)

Patrick
Telerik team
 answered on 19 Oct 2021
1 answer
4 views

I would like to hide the last column in my grid.

How can I do this?

Here's my code:


@(Html.Kendo().Grid<GoodNeighbor.Models.TrackingList>()
        .Name("TrackingListGrid")
        .Columns(c =>
        {
            c.Bound(t => t.TrackingListId).Hidden(true);
            c.Bound(t => t.FirstName).Width(115).Title("First Name");
            c.Bound(t => t.LastName).Width(115).Title("Last Name");
            c.Bound(t => t.Email).Width(150);
            c.Bound(t => t.Date).Width(90).ClientTemplate("#= kendo.toString(kendo.parseDate(CreatedDate), 'MM/dd/yyyy') #");
            c.Bound(t => t.Hours).Width(85);
            c.Bound(t => t.VolunteerOrganization).Width(120).Title("Volunteer Organization");
            c.Bound(t => t.ReponseCopy).Width(115).Title("Reponse Copy");
            c.Bound(t => t.Phone).Width(85);
            c.Bound(t => t.Location).Width(85);
            c.Bound(t => t.CreatedDate).Hidden(true);
            c.Bound(t => t.ModifiedDate).Hidden(true);
            c.Bound(p => p.TrackingListId).ClientTemplate("<a href='" + Url.Action("Create", "TrackingList") + "/#= TrackingListId #'" + ">Details</a>"); // Details link
        })
        .HtmlAttributes(new { style = "height: 400px;" })
        .Scrollable()
        .Groupable()
        .Sortable()
        .Filterable()
        .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(5))
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(20)
            .Read(r => r.Action("TrackingListRead", "TrackingList").Data("sendAntiForgery"))
            .Model(model => model.Id(p => p.TrackingListId))
            .Events(events => events.Error("onError"))
        )
    )

Alexander
Telerik team
 answered on 19 Oct 2021
1 answer
12 views

Hi,

I have a Kendo grid on a page that is created using this code in my cshtml file

 @(Html.Kendo().Grid<Entity>()
        .Name("productsGrid")
        .Columns(columns =>
        {
            columns.Bound(schema => schema.Ns).Width(150)
                .Filterable(false).Sortable(false);
            columns.Bound(schema => schema.Name).Title("Entity Name").Width(250);
            columns.Bound(schema => schema.Desc).Title("Description")
                .ClientTemplate("#= preserveDirtyFlag(data, data.Desc) #")
                .Filterable(false).Sortable(false);
        })
        .Editable(editable => editable.Mode(GridEditMode.InCell))
        .Sortable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(true)
            .ServerOperation(true)
            .PageSize(100)
            .Model(model =>
            {
                model.Id(entity => entity.Id);
                model.Field(entity => entity.Ns).Editable(false);
                model.Field(entity => entity.Name).Editable(false);
                model.Field(entity => entity.Desc);
            })
            .Read(read => read.Action("GetEntityList", "Products").Data("getQuery"))
            .Events(e => e.RequestStart("onPageChange"))
        )
        .Events(e => e.DataBound("onDataBound"))
        .ClientDetailTemplateId("fieldDescriptions")
)

Everything works perfectly fine on first load. 

The pagination works perfectly (have removed the code for that from above). Even the filtering works smoothly. super smooth.

The only issue is with sorting. 

---

As the code shows that sorting is enabled on the single column: 'Entity name'

As soon as that column title is clicked in order to sort the data, the browser redirects to a new URL

earlier it was at

/CatalogManager/Descriptions

but after clicking on the 'Entity Name' in order to sort that table, it redirects to:

/CatalogManager/Descriptions/GetEntityList?sortField=Relevancy&sortFieldValue=_score&descriptionsGrid-sort=Name-desc

and then shows the pure JSON output that the GetEntityList controller returns instead of rendering in the grid.

Why does filtering and pagination work well but sorting breaks the page?

---

The amazing thing is, if I remove the '/GetEntityList' from the url manually and just navigate to:

/CatalogManager/Descriptions?sortField=Relevancy&sortFieldValue=_score&descriptionsGrid-sort=Name-desc

Then the table is displayed in its full glory sorted by the required field. So they question is, why does it navigate to the API url and display the raw JSON data in the first place?

Eyup
Telerik team
 answered on 19 Oct 2021
Top users last month
JG
Top achievements
Rank 2
Iron
ixen
Top achievements
Rank 1
Iron
Iron
Iron
Matthias
Top achievements
Rank 5
Bronze
Bronze
Iron
Roland
Top achievements
Rank 1
Veteran
Iron
SK
Top achievements
Rank 1
Iron