Telerik Forums
UI for ASP.NET MVC Forum
4 answers
470 views

I am using Kendo MVC Upload control.  I am using it non-async mode with Multiple files marked false.

I want to use the events to control enabling/disabling the form Submit button.  This works except in one case.  If you select a file that fails validation, then select a new file that succeeds validation.  My Submit button is still marked disabled.

This seems to be because the onSelect event fires 1st and then the onRemove event fires 2nd.
I would like to suggest it would be better for the OnRemove event fire 1st and the onSelect event to fire 2nd.

$(document).ready(function () {
    $("#SubmitButton").attr("disabled", true);
});

function onSelect(e) {
    if (e.files[0].validationErrors == undefined) {
        $("#SubmitButton").attr("disabled", false);
    } else {
        $("#SubmitButton").attr("disabled", true);
    };
}

function onRemove(e) {
    $("#SubmitButton").attr("disabled", true);
}

 

Chuck
Top achievements
Rank 1
 answered on 01 Nov 2017
2 answers
381 views

I'm using latest build of Kendo UI MVC (2017.3.913) and I have a complex form which contains TabStrip.
Each Tab within the TabStrip contains PanelBar with multiple expandable\collapsible panels that allow me to view and edit data. When I expand a Panel the vertical scroll-barallows me to scroll down to view details etc.. Everything works fine so far.

On the form I also dynamically add a Kendo Window (dialog) and do various things like - Select Address,Select Person etc.. Dynamically creating it is a must - I destroy it after every time i use it. For demonstration the javascript function below creates the Window what I require to show the problem:

 

//This dynamically creates a Window (but donst show it yet)
function testCreateWindowDynamically()
{
  $(document.body).append("<div id='myContainerDiv' class='dlgContainer'></div>");
  $("#myContainerDiv").append("<div id='myDialogWindow' class='dlgDialog'></div>");
  var dialog =
    $("#myDialogWindow").kendoWindow({
      title: "",
      modal: true,
      actions: ["Close", "Minimize", "Maximize"],
      visible: false
    });
 
  $("#myDialogWindow").data("kendoWindow").maximize();
}

 

When I run this the vertical scroll bar on the tab strip disappears and I cant scroll down to view content not displayed on screen. Why is the vertical scroll bar disappearing?

 

Veselin Tsvetanov
Telerik team
 answered on 01 Nov 2017
8 answers
571 views

I'm looking at the Hierarchy Grid Demo (http://demos.telerik.com/aspnet-mvc/grid/hierarchy) for inspiration on something similar I need to do.

In the demo, it's a list of people, and the detail grid shows orders placed for the person in the parent grid.  So hypothetically, how would you implement a client side filtering condition that used data from the details to get a list of the parents?  Say I want a list of all people who had orders shipped to Australia?  Would I have to build a custom search, then populate the grid with the results, or is there a way to build that filter condition within the built in grid capabilities?

Stefan
Telerik team
 answered on 01 Nov 2017
7 answers
434 views
Hi all,

I am busy trialing KendoUI Complete for MVC with a purchase coming month end.

I have a KendoUI Grid in place with the editor mode being set to GridEditMode.PopUp.
I have created an EditorTemplate for the popup and this is working great for editing existing records. Everything 100% here.

My problem comes in with creating a new one. The editor only shows 2 fields - Description and Date (Textbox and DatePicker).
When I click the Update button in the editor I get a validation message "The Key Field Is Required" and cannot create the new record.
I have decorated the key property in my model with Editable(false), Browsable(false) and ReadOnly(true)  and still the message persists.
The key field is not even displayed in the Editor, so why is there validation on it?
The key field is a Guid type.

Any ideas how to get around this?

Another smaller issue, is I cannot resize the editor. I have tried ".Window(window => window.HtmlAttributes(new { @style = "width:500px;" }))" but it has zero effect. The editor is always the same default size no matter what I do.

TIA
Mike
Jesse
Top achievements
Rank 1
Veteran
 answered on 31 Oct 2017
4 answers
6.0K+ views

Hi!

I use Kendo UI for MVC 2016.1.301, with MVC 6 (Core 1.0). I have a grid with some fixed (bound) columns, and a few dynamic columns. I have managed to add the columns dynamically, with titles. The data type for these dynamic columns are bool. I've found various samples but none of them works, either they don't compile or they have no effect. I must add I'm new to the Razor engine so I don't understand exactly what's happening at all times.

So, how do I replace the [X] with data from the view model? I've tried variations on this theme, using .Bound and .Template, but nothing compiles either compile-time or run-time:

1.for (int i = 0; i < Model.PresetsList.PresetsList.Count(); i++)
2.{
3.    string titel = Model.PresetsList.PresetsList[i].PresetsName;
4.    int columnIndex = i;
5.    columns.Bound(cgi => cgi.MadeChoicePresetsList[columnIndex].IsSelected.ToString()).Title(titel);
6.}

 

Here's the current code which displays a [X] instead of data:

01.    @(Html.Kendo().Grid<C.ViewModels.ChoiceGroupItemViewModel>()
02.        .Name("choicegroupitemsgrid")
03.        .Columns(columns =>
04.        {
05.            columns.Bound(col => col.ChoiceGroupID).Title("gruppID");
06.            columns.Bound(col => col.ItemID).Title("artikelID");
07.            columns.Bound(col => col.ManufacturerItemID).Title("Tillv. artikelnr");
08.            columns.Bound(col => col.ItemName).Title("Benämning");
09.            columns.Bound(col => col.CustomerPayablePriceInclTax).Title("Pris").HtmlAttributes(new { align = "right" });
10. 
11.            foreach (var presets in Model.PresetsList.PresetsList)
12.            {
13.                columns.Template("[X]").Title(presets.PresetsName);
14.            }
15.        }
16.        )
17.        .Scrollable()
18.        .Pageable(pgbl => pgbl
19.            .Refresh(true)
20.            .PageSizes(true)
21.            .ButtonCount(5)
22.        )
23.        .Sortable(sortable => { sortable.SortMode(GridSortMode.SingleColumn); })
24.        .DataSource(datasrc => datasrc
25.            .Ajax()
26.            .Read(read => read
27.                .Action("ChoiceGroupItems", "ChoiceGroup", new { area = "Backoffice", id = Model.ChoiceGroupID })
28.            )
29.            .PageSize(20)
30.        )
31. 
32.)

Konstantin Dikov
Telerik team
 answered on 31 Oct 2017
6 answers
843 views
Hi 
Please help me out. I am breaking my head to achieve the load on demand treelist in kendo. I have followed the instructions as per the url http://demos.telerik.com/aspnet-mvc/treelist/remote-data-binding. But nothing worked out. My scenario is like that I need to load the parent nodes when loading the page first. Then on clicking the parent node, need to fire a call to get the child nodes. For me, it load the parent nodes first, but I can't see the expand icon coming up for nodes having children. Just see the attached image. I don't know what I'm doing wrong. Attaching the view page code and also the controller methods. Please let me know what is the issue? Well appreciated, if you could share some code for sample other than the demo sample.
View code
----------------------
 <div>

                @(Html.Kendo().TreeList<TelerikMvcApp1.Models.AssetModel>()
                .Name("assetTreeList")
                .Columns(columns =>
                {
                    columns.Add().Field(a => a.AssetName).Width(70).Expandable(true);
                })
                .Sortable()
                .DataSource(dataSource => dataSource
                    .Read(read => read.Action("LoadTree", "Home"))
                    .ServerOperation(false)
                    .Model(m =>
                    {
                        m.Id(e => e.AssetId);
                        m.ParentId(e => e.ParentAssetId);
                        m.Field(e => e.AssetName);
                        m.Field(e => e.ParentAssetId);
                    })
                    )
                .Scrollable(true)
                .Height(540)
               //.Events(e => e
               ////.DataBound("onAssetTreeListDataBound")
               //// ////.Change("treelist_change")
               //)
                )

            </div>
Controller Methods
-------------------------------------------------
 public IEnumerable<AssetModel> GetAssetTreeListBasedOnPermissions()
        {
            try
            {
                List<AssetModel> list = new List<AssetModel>();
                list.Add(new AssetModel { AssetId = 1, ParentAssetId = null, AssetName = "asset1" });
                list.Add(new AssetModel { AssetId = 2, ParentAssetId = 1, AssetName = "asset2" });
                list.Add(new AssetModel { AssetId = 3, ParentAssetId = null, AssetName = "asset3" });
                list.Add(new AssetModel { AssetId = 4, ParentAssetId = 2, AssetName = "asset4" });

                IEnumerable<AssetModel> enumlist = list
                    .Select(x => new AssetModel
                    {
                        AssetId = x.AssetId,
                        ParentAssetId = x.ParentAssetId,
                        AssetName = x.AssetName
                    });
                return enumlist;

              
            }
            catch (Exception ex)
            {
                return null;
            }
        }

        public JsonResult LoadTree([DataSourceRequest] DataSourceRequest request, int? id)
        {
            var result = GetAssetTreeListBasedOnPermissions().ToTreeDataSourceResult(request,
                e => e.AssetId,
                e => e.ParentAssetId,
                e => id.HasValue ? e.ParentAssetId == id : e.ParentAssetId == null,
                e=>e
            );

            return Json(result, JsonRequestBehavior.AllowGet);
        }
Model class
------------------------
 public class AssetModel
    {
        public long AssetId { get; set; }
        public long? ParentAssetId { get; set; }
        public string AssetName { get; set; }
        public bool HasChildren { get; set; }
    }
Thanks in advance
Binta Prasad
Tsvetina
Telerik team
 answered on 31 Oct 2017
4 answers
1.1K+ views

Hello,

I would like to fire click Event when already selected tab item is clicked. Looks like OnSelect doesnt get fired if the selected item is clicked again. I tried implementing JavaScript but doesnt get fired

$(function () {
$("#tbAdress .k-tabstrip-items").on("click", "li.k-state-active", function () {
//custom logic
});
});

 

here is my layout

@(Html.Kendo().MobileLayout()
.Name("mobile-tabstrip")
//.Header(obj => NavBarTemplate(this))
.Header(
@<text>
@Menumobile()
</text>
)
.Footer(
@<text>
@(Html.Kendo().MobileTabStrip()
.Name("tbAdress")
.SelectedIndex(999)
.Events(events => events
.Select("onTabSelect")
)
.Items(items =>
{
                   
                    items.Add().Text("Objekt").HtmlAttributes(new { @data_icon = "home" });
items.Add().Text("GoogleMaps").HtmlAttributes(new { @data_icon = "gps-e" });
})
)
</text>)
)

 

How can i achieve this

 

-Anamika

Anamika
Top achievements
Rank 1
 answered on 31 Oct 2017
1 answer
3.8K+ views

Hi there guys, i am trying to make the value of a column header(Title) different from what the column is bound to. So my grid have a few columns where the value displayed in the column is different from what the column header say. So instead of the title being static like.

columns.Bound(c => c.CurrentPlanStatus).ClientTemplate("<a href='"+ "Plan/EditTab" + "?pkid=#= ProjectKeyID #&pid=#=ProjectID #&fyid=#=CurrentFiscalYearID #&ptid=#=ProjectTypeID #&prgmid=#=ProgramID #'" + ">#=CurrentPlanStatus#</a>").Title("FY 18");

 

i want it  to be something like

columns.Bound(c => c.CurrentPlanStatus).ClientTemplate("<a href='"+ "Plan/EditTab" + "?pkid=#= ProjectKeyID #&pid=#=ProjectID #&fyid=#=CurrentFiscalYearID #&ptid=#=ProjectTypeID #&prgmid=#=ProgramID #'" + ">#=CurrentPlanStatus#</a>").Title("FY" + c => c.CurrentFiscalYear.ToString());

 

How do i go about doing this? thanks.

Chinonso
Top achievements
Rank 1
 answered on 30 Oct 2017
1 answer
106 views

Hi, 

is there a keyboard combination to move to the next cell when editing a table in the editor? I would have expected that the tab key moves to the next cell when the focus is in a table, but apparently that is not the case. (Version 2017.3.1026).

Regards

Erwin

Ivan Danchev
Telerik team
 answered on 30 Oct 2017
2 answers
233 views

Hi

In aspnet mvc, I'm using a Kendo grid integrating the sortable component.

The setup is just like this example:

http://demos.telerik.com/aspnet-mvc/sortable/integration-grid

However, my grid has a set height and is scrollable.  If I drag a row over the top (or bottom) of the grid, I'm expecting the grid to automatically scroll until it reaches the top (or bottom) row.  I have set the autoscroll property to true on the sortable component.  But I can only scroll to the top (or bottom) of the display, no automatic scrolling occurs.

Is this possible with the kendo grid in aspnet mvc?

I'm looking for the same behavior as the Kendo UI sample - http://dojo.telerik.com/@petyosi/IgOkU

Any help or specific examples would be appreciated

 

David
Top achievements
Rank 1
 answered on 30 Oct 2017
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?