Telerik Forums
UI for ASP.NET MVC Forum
1 answer
5.4K+ views

Hi,

i have few integer columns in grid.

I want to display sum of column in footer of the grid.

i tried several ways but could not success.

Petar
Telerik team
 answered on 16 Nov 2020
1 answer
488 views

I am using the Fluent API of the Telerik UI for Asp.Net MVC to build a form that has an Editor as one of it's elements, bound to a backing property in my model. I want my view to act as both the edit and display page for my model, so I want to disable the Editor when in display mode, but I cannot find a method to do so, and my attempts to change the contenteditable attribute to false have failed. y research lead me to work arounds in other version of Kendo-UI that haven't worked for me. Below is a snippet of my form with the Editor that I am looking to disable.

@(Html
    .Kendo()
    .Form<InformationModel>()
    .Name("formInformation")
    .HtmlAttributes(new { action="Add", method="POST"})
    .Items(i => {
            i.Add()
            .Field(f => f.Description)
            .Editor(e => e.Editor().HtmlAttributes(new { contenteditable = false }))
            .Label(l => l.Text(SharedHtmlLocalizer["Description"].Value))
            .InputHtmlAttributes(new { data_val_required = string.Format(Localizer["TheField_Name_IsRequired"], Localizer["Description"]), contenteditable=ViewBag.IsEdit });
        }
    )
)

How can I disable this Editor through the Fluent API? If that isn't possible, how can I disable it via javascript (specifically jQuery)?

Ivan Danchev
Telerik team
 answered on 16 Nov 2020
1 answer
278 views

Hello,

I remember there are some simple sites to let user modify some setting for kendo widget to see the modified results. I could not find them now. Can someone tell me where to look those practice sites - for example : simple kendo grid setting for MVC.

 

Thanks.

Petar
Telerik team
 answered on 16 Nov 2020
20 answers
412 views

Hi,

Not having much luck using this PivotGrid seems it very undeveloped.

How can i sort the Columns from A to Z?

Thanks,
Lee.

Grace
Top achievements
Rank 1
Veteran
 answered on 15 Nov 2020
12 answers
1.2K+ views

There is a Grid with dynamic columns.The number of columns is not fixed(10-20col). there is horizontal and vertical scrolling

Html structure:

<div id="root">
  <div id="grid-param"> ...html contet...</div>
  <div id="grid"> </div>
</div>

Export:

var grid = $("#grid").data("kendoGrid");
var progress = $.Deferred();
kendo.drawing.drawDOM($("#grid-param"))
 .then(function (header) {
       grid._drawPDF(progress)
 .then(function (foolGrid) {
      foolGrid.children.push(header);
      return kendo.drawing.exportPDF(foolGrid, { margin: { left: '2cm', top: '8cm', right: '2cm', bottom: '2cm' },  allPages: true });})
.done(function (dataURI) {
 kendo.saveAs({
  dataURI: dataURI,
  fileName: name });
  progress.resolve();});
});

 

As a result, a document is formed in which content is superimposed on each other (pic in attach). The top of the Grid displays content from div #grid-param.

how to group content correctly so that there is no overlap?)

kedto ver. 2018.1.221.545

 


Georgi Denchev
Telerik team
 answered on 13 Nov 2020
1 answer
698 views

Hi,

When am trying to load json data to kendo grid am getting above error in chrome console. 

here is my json 

[{"EMPNUMBER":57,"EMPNAME":"Seldon, Brenda","COMPANY":"IT","PROJECTNAME":"Bullhorn P1 Integ","CHARGEDESC":"BizTalk Testing"},{"EMPNUMBER":70,"EMPNAME":"DiSanto, Lisa","COMPANY":"IT","PROJECTNAME":"Employee Time-off Tasks","CHARGEDESC":"Vacation (Personal Holiday) Regular Kelly Only"},{"EMPNUMBER":70,"EMPNAME":"DiSanto, Lisa","COMPANY":"IT","PROJECTNAME":"2020 Production Support","CHARGEDESC":"Production Support"}]

 

here is my design code

@( Html.Kendo().Grid<TimeControlReportEnhancements.Models.TimeControlGrid>()
                .Name("client")
                .Columns(columns =>
                {
                   
                    columns.Bound(p => p.EMPNAME);
                    columns.Bound(p => p.COMPANY).Width(150);
                    columns.Bound(p => p.PROJECTNAME).Width(150);
                    columns.Bound(p => p.CHARGEDESC).Width(150);
                    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
                })
                .ToolBar(toolbar =>
                {
                    toolbar.Create();
                    toolbar.Save();
                })
                .HtmlAttributes(new { style = "height: 550px;" })
                .Editable(editable => editable.Mode(GridEditMode.InCell))
                .Filterable()
                .Pageable()
                .Navigatable()
                .Sortable()
                .Scrollable(scr => scr.Height(550))
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Batch(true)
                    .PageSize(20)
                    .ServerOperation(false)
                    .Events(events => events.Error("error_handler"))
                    .Model(model => model.Id(p => p.EMPNUMBER))
                    .Create("Filter_Multi_Editing_Create", "Home")
                    .Read("GetAllEmployees", "Home")
                    .Update("Filter_Multi_Editing_Update", "Home")
                    .Destroy("Filter_Multi_Editing_Destroy", "Home")
                )
)

Martin
Telerik team
 answered on 13 Nov 2020
1 answer
181 views
Hi, I would like to know if there is a way to get a sql db column  MS_Description as a column name tooltip  from the standard object used to describe a grid element:

columns.Bound(p => p.Country).Title("Country").Visible(true);
Anton Mironov
Telerik team
 answered on 13 Nov 2020
8 answers
380 views

I've just upgraded to version 2020.3.915 of the framework, from version 2020.2.513, and the button badges have broken.

The original code was:-

@(Html.Kendo().Button().Name("reviewButton").Content("Review").Badge(b => b.Value((string)ViewBag.NoToReview).Type("error").Visible((bool)ViewBag.ReviewBadge).Shape(BadgeShape.Circle)).HtmlAttributes(new {style= "margin-right:10px;width:150px;margin-bottom:2px;" ,@class="k-primary"}).Events(e=>e.Click("review")))

This now throws an error:-

ButtonBadgeSettingsBuilder' does not contain a definition for 'Value' and the best extension method overload 'ValueExtensions.Value(HtmlHelper, string)' requires a receiver of type 'HtmlHelper'

I have modified the code to:-

@(Html.Kendo().Button().Name("reviewButton").Content("Review").Badge(b => b.Text((string)ViewBag.NoToReview).Visible((bool)ViewBag.ReviewBadge).Shape(BadgeShape.Circle).ThemeColor(BadgeColor.Warning).Position(BadgePosition.Outside)).HtmlAttributes(new {style= "margin-right:10px;width:150px;margin-bottom:2px;" ,@class="k-primary"}).Events(e=>e.Click("review")))

However the badge colour isn't red (this doesn't seem to change whatever the ThemeColor setting), and the badge placement is within the button, and not on the upper right corner as before.

The documentation and other forum posts mention a button placement option, but this is missing from the intellisense options shown, and the documentation entry for this is now missing.

I need the badges to be red, and overlapping the top-right button corner as before. How can I achieve this?

AP
Top achievements
Rank 1
Iron
Iron
Veteran
 answered on 12 Nov 2020
1 answer
1.3K+ views

how to load external epi data into kendo grid. am getting empty grid using below code. but in api it shows it is returning json data.

here is my code.

@(Html.Kendo().Grid<TimeControlReportEnhancements.Models.TimeControlGrid>()
          .Name("grid")
          .Columns(columns =>
          {
              columns.Bound(p => p.EMPNAME);
              columns.Bound(p => p.COMPANY).Width(150);
              columns.Bound(p => p.PROJECTNAME).Width(150);
              columns.Bound(p => p.CHARGEDESC).Width(150);
              columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
          })
          .ToolBar(tools =>
          {
              tools.Create();
          })
          .Sortable()
          .Pageable()
          .Filterable()
          .DataSource(dataSource =>
              dataSource
                .WebApi()
                .Model(model =>
                {
                    model.Id(p => p.EMPNUMBER);
                })
          .Events(events => events.Error("error_handler"))
          .Read(read => read.Url("https://localhost:44376/api/Home/DBA"))
         
          )

Neli
Telerik team
 answered on 12 Nov 2020
2 answers
411 views

Hello,
i have a variable that get the names and IDs from the selected Rows, so if i select like one Row or more on the first page, and then changed the page, the selected Rows aren't in the variable anymore.

so I'm checking the Variable in the Console and in first page, after selecting few Rows : for every selection I'm pushing the new selected values to old one.

So this is my Grid Widget:

 

    @(Html.Kendo().Grid<WebCalendar_09K.Models.UserViewModel>()
    .Name("gridMitarbeiter")
    .HtmlAttributes(new { style = "height: 100%;width:100%;padding:0px;" })
    .Events(eve =>
    {
        eve.Change("onChange_Grid_Mitarbeiter");
    })
    .Columns(columns =>
    {
        columns.Select().Width(75).HtmlAttributes(new { @class = "checkbox-align" }).HeaderHtmlAttributes(new { @class = "checkbox-align, headerGrid" });
        columns.Bound(c => c.Vorname).HeaderHtmlAttributes(new { @class = "headerGrid" });
        columns.Bound(c => c.Name).HeaderHtmlAttributes(new { @class = "headerGrid" });
        columns.Bound(c => c.Crmusername).HeaderHtmlAttributes(new { @class = "headerGrid" });
    })
    .Scrollable()
    .Sortable()
    .Selectable(selectable => selectable
            .Mode(GridSelectionMode.Multiple)
            .Type(GridSelectionType.Row)
            )
    .Pageable(pageable => pageable
            .Info(true)
            .Input(true)
            .Numeric(false)
            .ButtonCount(5)
            .Responsive(true)
         )
    .ToolBar(t => t.Search())
 
    .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("Mitarbeiter_Read", "User"))
            .PageSize(20)
    )
 
    )

 

and this is the on change Grid_function :

function onChange_Grid_Mitarbeiter(e) {
            Global_Array_Grid_mitarbeiter_Selected = new Array();
            var msInterne = $("#MS_Interne").data("kendoMultiSelect");
            var grid  = $("#gridMitarbeiter").data("kendoGrid");
            var rows = e.sender.select(); // all the selected values from the grid
 
            rows.each(function (e) {
                var dataItem = grid.dataItem(this);
                // the variable i need
                Global_Array_Grid_mitarbeiter_Selected.push(dataItem);
                console.log(Global_Array_Grid_mitarbeiter_Selected);
            });
 
        }

 

so every Time i change the page it starts with no value in rows and push the first row selected from the second page into the array Global_Array_Grid_mitarbeiter_Selected.

So how to change the page without loosing the selection ?

 

Thanks in advance

 

K.Ramadan 

Georgi Denchev
Telerik team
 answered on 11 Nov 2020
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
Jake
Top achievements
Rank 1
RBarnes
Top achievements
Rank 1
Iron
Iron
Rami
Top achievements
Rank 1
Iron
Veteran
Nathan
Top achievements
Rank 1
Kumeri
Top achievements
Rank 1
Iron
Veteran
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jake
Top achievements
Rank 1
RBarnes
Top achievements
Rank 1
Iron
Iron
Rami
Top achievements
Rank 1
Iron
Veteran
Nathan
Top achievements
Rank 1
Kumeri
Top achievements
Rank 1
Iron
Veteran
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?