Telerik Forums
UI for ASP.NET MVC Forum
7 answers
508 views
I am currently using a multiselect for, which populates the list by means of a datasource.

The problem is that when typing in the input is not taking empty spaces, even when typing the multiselect space bar does not take them, why could this happen?
Ivan Danchev
Telerik team
 answered on 19 Aug 2019
9 answers
3.0K+ views
Hello,

I want to filter a Grid with Bound bool field by using a dropdown instead of normal radiobuttons.
Is this possible at all?

I have tried settings filterable.UI as follows:

columns.Bound(c => c.UnServiceable)
    .Title("U/S")
    .ClientTemplate("#if(UnServiceable) { #Yes# } else { #No# }#")
    .Filterable(filter => filter
        .Messages(m => m.Info(Strings.Filter_UnServiceable_Message))
        .UI("boolAsDropdown"))
    .Width(100);


However, the â€‹boolAsDropdown​ javascript function is never called. It seems to be unable to call this when using a boolean field as data column.
The same method is working fine with other column types (int, string).

If anyone could help me with this issue, this would be great.

Thank you in advance,
Nick
Alex Hajigeorgieva
Telerik team
 answered on 19 Aug 2019
1 answer
260 views

Hi, 

I have several questions regarding the management of locked columns.

 

1) Auto-size

Is there a way for unlocked columns to automatically calculate their size so that they fill the "free" part of the grid, as when there are no fixed columns?

The appearance of the horizontal scroller when displaying or hiding columns is simply illogical compared to the basic grid

I'm not talking about autofit, who make 'empty part' or display scroller 

 

2) Size in pixel

In asp.net mvc, we can give the size of the columns in em, vw, %, ...

This works for basic grids, but not when there are fixed columns.

Is it normal or is there a lack?

 

3)  All locked columns

Is there a way to have a basic grid but without the user changing the order of the columns

 

Regards

Viktor Tachev
Telerik team
 answered on 19 Aug 2019
12 answers
313 views

Is it possible to show AllDay-events in the time area, that means as a block from 0-24?

Is it possible to show an event which is ranging from 2016-09-13 8AM to 2016-09-14 9PM not in the all day-row but in the times area than as big block ?

Ivan Danchev
Telerik team
 answered on 15 Aug 2019
1 answer
165 views

Hi ,

 

I`ve had a look through the forum but could not find the answer I need. All I need to do is hide a column using .Hidden but for it to have 2 conditions. This is what I have already 

columns.Command(command => command.Custom("More Information").Click("moreInfo")).Width(180).Hidden(!ViewBag.IsAuthorized );

 

What I need is something 

 

columns.Command(command => command.Custom("More Information").Click("moreInfo")).Width(180).Hidden(!ViewBag.IsAuthorized  or blabla = something);

Viktor Tachev
Telerik team
 answered on 14 Aug 2019
7 answers
2.3K+ views

I have a date column in my grid and an associated editor template for the date picker. I need to disable a lot of dates (every day except the last day of the month). I have created a list and set a ViewData object to that list of dates; however, the DataPicker editor template won't accept a ViewData object. How would I go about setting the disabled dates?

Grid:

@(Html.Kendo().Grid<HFITDashboard.UI.Models.SmaDataEntry.SmaPerformanceViewModel>()
          .Name("smaPerformanceGrid")
          .Columns(column =>
          {
              column.Command(cmd =>
              {
                  cmd.Edit();
              }).Width(300);
              column.Bound(s => s.SmaPerformanceId).Width(150).IncludeInMenu(false).Hidden(true);
              column.Bound(s => s.RefFund).Width(300).ClientTemplate("#=RefFund.LongName#");
              column.Bound(s => s.RefSource).Width(250).ClientTemplate("#=RefSource.LongName#");
              column.Bound(s => s.CalendarDate).Width(250).Format("{0:MM/dd/yyyy}");
              column.Bound(s => s.SsbPerformanceType).Width(250).ClientTemplate("#=SsbPerformanceType.DisplayName#");
              column.Bound(s => s.OneDay).Width(250).Format("{0:n2}");
              column.Bound(s => s.Mtd).Width(250).Format("{0:n2}");
              column.Bound(s => s.OneMonth).Width(250).Format("{0:n2}");
              column.Bound(s => s.ThreeMonths).Width(250).Format("{0:n2}");
              column.Bound(s => s.SixMonths).Width(250).Format("{0:n2}");
              column.Bound(s => s.NineMonths).Width(250).Format("{0:n2}");
              column.Bound(s => s.Qtd).Width(250).Format("{0:n2}");
              column.Bound(s => s.FiscalYtd).Width(250).Format("{0:n2}");
              column.Bound(s => s.CalendarYtd).Width(250).Format("{0:n2}");
              column.Bound(s => s.OneYear).Width(250).Format("{0:n2}");
              column.Bound(s => s.TwoYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.ThreeYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.FourYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.FiveYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.SixYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.SevenYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.EightYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.NineYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.TenYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.FifteenYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.TwentyYears).Width(250).Format("{0:n2}");
              column.Bound(s => s.InceptionToDate).Width(250).Format("{0:n2}");
              column.Bound(s => s.Nav).Width(250).Format("{0:n2}");
              column.Bound(s => s.MarketOfferPrice).Width(250).Format("{0:n2}");
              column.Bound(s => s.LastMaintenanceOperatorId).Width(150);
          })
          .ToolBar(tb => tb.Create().Text("Create Performance Record"))
          .Editable(editable => editable.Mode(GridEditMode.InLine))
          .ColumnMenu()
          .Filterable()
          .Pageable()
          .Sortable()
          .Scrollable(s => s.Enabled(true).Height(535))
          .DataSource(ds => ds
              .Ajax()
              .PageSize(100)
              .Model(model =>
              {
                  model.Id(s => s.SmaPerformanceId);
                  model.Field(x => x.LastMaintenanceOperatorId).Editable(false);
                  model.Field(x => x.SsbPerformanceType).DefaultValue(
                      ViewData["defaultSsbPerformanceTypes"] as HFITDashboard.UI.Models.SmaDataEntry.SsbPerformanceTypeViewModel);
                  model.Field(x => x.RefSource).DefaultValue(
                      ViewData["defaultRefSources"] as HFITDashboard.UI.Models.SmaDataEntry.RefSourceViewModel);
                  model.Field(x => x.RefFund).DefaultValue(
                      ViewData["defaultRefFunds"] as HFITDashboard.UI.Models.SmaDataEntry.RefFundViewModel);
              })
              .Create(create => create.Action("Create", "SmaDataEntry"))
              .Read(read => read.Action("Read", "SmaDataEntry"))
              .Update(update => update.Action("Update", "SmaDataEntry"))
              .Events(e => e.RequestEnd("onRequestEnd").Sync("sync_handler"))
          ))

 

Editor Template:

@model DateTime? 
@(Html.Kendo().DatePickerFor(m => m))

 

Method that gets disabled dates:

private void GetNonMonthEndDates()
        {
            DateTime StartDate = new DateTime(2000, 1, 1);
            DateTime EndDate = new DateTime(2030, 12, 31);
            int DayInterval = 1;
 
            List<DateTime> dateList = new List<DateTime>();
            while (StartDate.AddDays(DayInterval) <= EndDate)
            {
                StartDate = StartDate.AddDays(DayInterval);
                var daysInMonth = DateTime.DaysInMonth(StartDate.Year, StartDate.Month);
 
                if (!StartDate.Day.Equals(daysInMonth))
                {
                    dateList.Add(StartDate);
                }
 
                ViewData["disabledDates"] = dateList;
            }
        }

 

How do I associate the ViewData object to the DataPicker DisabledDates, or is there another way to do it?

Mark
Top achievements
Rank 1
 answered on 09 Aug 2019
2 answers
376 views

My problem is when the editor popup shows, the drop downs are populated but are selecting the current values of the row in question.   I was referring to a few previous posts, including this example:

https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/grid-popup-editing-dropdownlistfor-required/KendoUIMVC5

I thought I was missing the following:

<script>
function onEdit(e) {
@Html.Kendo().DeferredScripts(false);
}
</script>

When I look at the chrome debugger, there is only an ";" in the onEdit method, nothing is being written there.   I am using 2019.2.619.

Not sure what I am missing, thanks

Peter

Georgi
Telerik team
 answered on 09 Aug 2019
2 answers
471 views

Your demo shows how an inline and popup editor works for a currency field:

https://demos.telerik.com/aspnet-mvc/grid/editing-inline

I can't tell from your demo how you are presenting the edit input box.   In particular, the edit field shows with a $ and limits the user to entering digits and a decimal.

Are you applying specific attributes to the model?   The model.cs is not included in the demo.   

Thanks

Peter

Viktor Tachev
Telerik team
 answered on 09 Aug 2019
4 answers
168 views

I have hierarchy grid in asp.net mvc

It's not accessible, is it possible?

this is my code:

 @(Html.Kendo().Grid<Matrix.Plugin.BooksLists.Models.CustomerList.CustomerProductsListsModel>
                                                                        ()
                                                                        .Name("CustomerProductsListsGrid")
                                                                        .Columns(columns =>
                                                                        {
                                                                        columns.Bound(p => p.ListName).Title("" + T("Matrix.Plugin.BooksLists.ListName") + "").HtmlAttributes(new {                                                                                    @class = "firstColumn listName" }).Media("(min-width: 450px)");
                                                                        columns.Bound(p => p.AgeText).Title("" + T("Matrix.Plugin.BooksLists.Age") + "").HtmlAttributes(new { @class =                                                                              "age" }).Media("(min-width: 450px)");
                                                                        columns.Bound(p => p.Count).Title("" + T("Matrix.Plugin.BooksLists.NumOfBooks") + "").HtmlAttributes(new {                                                                                  @class = "booksNum" }).Media("(min-width: 450px)");
                                                                        columns.Bound(p => p.Warnning).Title("").HtmlAttributes(new { @class = "warning" }).Media("(min-width: 450px)");
                                                                        columns.Command(command => command.Custom("errorBox").Text(" ").HtmlAttributes(new { @class = "icon-icon-                                                                          worning popOverIcon", @data_toggle = "popover", @data_popover_content = "\\#errorPopUpContainer",                                                                                          @data_placement = "bottom", @data_trigger = "hover", @href = "\\#this" })).Media("(min-width: 450px)");
                                                                        columns.Command(command =>                                                                                                                                                                                                         command.Custom("actionsBox").Text("").Click("openActionBox")

                                                                       .HtmlAttributes(new { @class = "icon-icon-dots popOverIcon", @data_toggle = "popover", @data_popover_content                                                                           = "\\#actionPopUpContainer", @data_placement = "bottom", @href = "\\#this" })).Media("(min-width: 450px)");
                                                                        columns.Template(@<text></text>).ClientTemplate("#=resColTemplate(data)#").Title(" ").Media("(max-width:                                                                                     450px)");
                                                                        })
                                                                                                                                .ToolBar(toolBar =>
                                                                                                                                toolBar.Custom()
                                                                                                                                .Text("" + T("Matrix.Plugin.BooksLists.ExportAllListsToExcel") + "")
                                                                                                                                .HtmlAttributes(new { @class = "exportToExcel" })
                                                                                                                                .Url(Url.Action("CustomerListsExportToExcel", "BooksLists"))
                                                                                                                                )
                                                                                                                                .Editable(editable => editable.Mode(GridEditMode.InLine))
                                                                                                                                .Sortable()
                                                                                                                                .Pageable()
                                                                                                                                .Navigatable()
                                                                                                                                .Scrollable(s => s.Enabled(false))
                                                                                                                                .ClientDetailTemplateId("template")
                                                                                                                                .DataSource(dataSource => dataSource
                                                                                                                                .Ajax()
                                                                                                                                .Model(model =>
                                                                                                                                {
                                                                                                                                    model.Id(p => p.Id);
                                                                                                                                    model.Field(p => p.Warnning).Editable(false);
                                                                                                                                })
                                                                                                                               .PageSize(20)
                                                                                                                                .Read(read => read.Action("GetCustomerList", "BooksLists"))
                                                                                                                                )
                                                                                                                                .Events(events => events.DataBound("dataBound"))
        )     
<script id="template" type="text/x-kendo-template">
    @(Html.Kendo().Grid<Matrix.Plugin.BooksLists.Models.CustomerList.CustomerProductsLists_AttachedProductsModel>
                                    ()
                                    .Name("grid_#=Id#") // template expression, to be evaluated in the master context
                                    .Events(events => events.DataBound("LoadPopoversIcons"))
                                    .Columns(columns =>
                                    {
                                    columns.Bound(o => o.ProductName).Title("" + T("Matrix.Plugin.BooksLists.BookName") + "").Width(120).ClientTemplate("<a                                                          class='productName' href=" + @Url.RouteUrl("Product", new { SeName = "\\#= SeName \\#" }) + "> \\#= ProductName \\# </a>").Media("                                        (min-width: 450px)");
                                    columns.Bound(o => o.ProductFieldOfKnowledge).Title("" + T("Matrix.Plugin.BooksLists.ProductFieldOfKnowledge") +                                                                    "").Width(120).Media("(min-width: 450px)");
                                    columns.Bound(o => o.BookType).Title("" + T("Matrix.Plugin.BooksLists.BookContentType") + "").Width(120).Media("(min-width: 450px)");
                                    columns.Bound(o => o.ProductProvider).Title("" + T("Matrix.Plugin.BooksLists.ProductProvider") + "").Width(120).Media("(min-width:                                              450px)");
                                    columns.Command(command => command.Custom("extraInfoBox").Click("extraInfoDetails").HtmlAttributes(new { @class = "icon-icon-                                          more-informtion extraInfoBoxPopOver popOverIcon", @data_toggle = "popover", @data_popover_content =                                                                                     "\\#extraInfoPopOverContainer", @data_placement = "bottom", @href = "\\#this" }).Text(" ")).Title("מידע נוסף").Width(90).Media("(min-                                              width: 450px)");
                                    columns.Command(command => command.Custom("alertBox").Text(" ").HtmlAttributes(new { @class = "icon-icon-more-informtion-press                                      popOverIcon", @data_toggle = "popover", @data_placement = "bottom", @data_trigger = "hover", @data_popover_content =

                                    "\\#alertPopUpContainer", @OnMouseOver = "showAlertBox(this)", @href = "\\#this" })).Width(50).Media("(min-width: 450px)");
                                    columns.Command(command => command.Custom("bookErrorBox").Text(" ").HtmlAttributes(new { @class = "icon-icon-worning                                                     popOverIcon", @data_toggle = "popover", @data_placement = "bottom", @data_trigger = "hover", @data_popover_content =                                                         "\\#bookErrorPopUpContainer", @OnMouseOver = "showBookErrorBox(this)", @href = "\\#this" })).Width(50).Media("(min-width: 450px)");
                                    columns.Command(command => command.Custom("notesBox").Text(" ").Click("showNotesBox").HtmlAttributes(new { @class = "icon-                                           icon-note-press hasNote popOverIcon", @data_toggle = "popover", @data_popover_content = "\\#notesPopUpContainer",                                                             @data_placement = "bottom", @href = "\\#this" })).Title("הערה").Width(90).Media("(min-width: 450px)");
                                    columns.Bound(o => o.ProductId).Title("" + T("matrix.plugin.bookslists.addtoschoollistshort") + "").Width(120).Media("(min-width:                                                    450px)").ClientTemplate(@Html.ActionLink(" ", "SchoolBooksListsButtons", "BooksLists", new { ProductId = "\\#=ProductId\\#" }, new {                                            @class = "modal-link icon-icon-add-list", @onclick = "addToSchoolList(this)" }).ToHtmlString());
                                    columns.Command(command => command.Custom("deleteBook").Text(" ").Click("DeleteBookGetData").HtmlAttributes(new { @class =                                        "icon-icon-delete popOverIcon", @data_toggle = "modal", @data_target = "\\#deleteBookModal" })).Title("הסרה").Media("(min-width:                                                450px)");
                                    columns.Template(@<text></text>).ClientTemplate("\\#=resInnerTableColTemplate(data)\\#").Title(" ").Media("(max-width: 450px)");
                                    })                                           
                                            .DataSource(dataSource => dataSource
                                            .Ajax()
                                            .PageSize(10)
                                            .Read(read => read.Action("GetCustomerAttachProductsList", "BooksLists", new { ListId = "#=Id#" }))
                                            )                                           
                                            .Pageable()
                                            .Sortable()
                                            .Navigatable()
                                            .ToClientTemplate()
    )
</script>

Thanks!

Sharon
Top achievements
Rank 1
 answered on 07 Aug 2019
1 answer
1.6K+ views

I'm trying to use the Kendo Grid in ASP.NET Core MVC application to do multi-select function, first column of the grid being a checkbox column. 

My grid has 50 records spread across 5 pages. I have 2 items selected in the first page, 1 item selected in the 2nd page. I use DataBound event to pre-select rows from database. I save the data with a button click (outside the grid) using grid.selectedKeyNames() and post the data to database using a custom Ajax method.

I get all 3 selected ID's in grid.selectedKeyNames() as long as I navigate to second page after the initial load of the grid. If I don't go to the 2nd page of the grid and try to get selectedKeyNames, it returns only selected items from the first page. I always have to go to all the pages where items are pre-selected once to get the grid working.

Have anyone experienced this error before. Appreciate any quick workaround/solution to this problem.

Kendo UI version: v2019.2.619

 

//Here is my Razor syntax.

 

   @(Html.Kendo().Grid<Web.Models.IndustryModel>

                                ()
                                .Name("IndustryGrid")
                                .Columns(columns =>
                                {
                                    columns.Bound(p => p.Checked).Width(20).ClientTemplate("<input type='checkbox' #=Checked ? checked='checked' :'' # class='chkbx' />").Hidden();
                                    columns.Select().Width(50);
                                    columns.Bound(p => p.IndustryId).Hidden();
                                    columns.Bound(p => p.IndustryName).Width(100);
                                })
                                .AutoBind(false)
                                .Pageable()
                                .PersistSelection()
                                .Sortable()
                                .Events(ev => ev
                                .Change("onChange")
                                .DataBound("onDataBound"))
                                .DataSource(dataSource => dataSource
                                .Ajax()
                                .Model(model => model.Id(p => p.IndustryId))
                                .Read(read => read.Action("GetIndustryList", "xxxxxxxxxxxxx").Data("SearchData"))
                                )
                                .NoRecords(x => x.Template("<div class='empty-grid'></div>"))
                    )

 

//Trying to get the selected key names on a button click

 

 $('#btnSave').on('click', function () {
        var grid = $('#IndustryGrid').data('kendoGrid');
        alert(grid.selectedKeyNames());
    });

 

// Function to pre-load selected rows from database

  function onDataBound(arg) {
            var grid2 = this;
            var rows = grid2.items();

            $(rows).each(function (e) {
                var row = this;
                var dataItem = grid2.dataItem(row);
                if (dataItem.Checked)
                    grid2.select(row);
            });
        }

Georgi
Telerik team
 answered on 07 Aug 2019
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
ComboBox
Upload
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
Dialog
MultiColumnComboBox
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
Security
ColorPicker
DateRangePicker
Wizard
Styling
Chat
DateInput
MediaPlayer
TileLayout
Drawer
SplitView
Template
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
LLM Kit
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?