Telerik Forums
UI for ASP.NET MVC Forum
2 answers
274 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
1 answer
391 views

Hi,

We are looking to implement a grid. We have the dropdown element working, but we need the contents of it to be driven by another field in the grid.

Eg a "Type" would yield a list of "SubTypes" based on the "Type" selected.

 

An existing row would only show "SubTypes" based on the "Type" set, whilst with an addition, the "Type" would be required first, then the "SubType".

 

Is this functionality possible?

 

Thank you,

Ciprian

Stefan
Telerik team
 answered on 30 Oct 2017
1 answer
513 views

Hello,

I'm currently using ASP.NET MVC Kendo UI to generate a Grid. I am able to filter one column, but upon filtering a second or more columns, I receive a '500 Internal Server Error' (see the attached screenshot). The code files are as follows:

View.cshtml

01.<head>
02.    <link href="@Url.Content("~/Content/kendo/2017.3.1018/kendo.common.min.css")" rel="stylesheet" type="text/css" />
03.    <link href="@Url.Content("~/Content/kendo/2017.3.1018/kendo.mobile.all.min.css")" rel="stylesheet" type="text/css" />
04.    <link href="@Url.Content("~/Content/kendo/2017.3.1018/kendo.default.min.css")" rel="stylesheet" type="text/css" />
05.    <link href="@Url.Content("~/Content/kendo/2017.3.1018/kendo.rtl.min.css")" rel="stylesheet" type="text/css" />
06. 
07.    <script src="~/Scripts/jquery-1.10.2.js" type="text/javascript"></script>
08.    <script src="@Url.Content("~/Scripts/kendo/2017.3.1018/kendo.web.min.js")"></script>
09.    <script src="@Url.Content("~/Scripts/kendo/2017.3.1018/kendo.aspnetmvc.min.js")"></script>
10.</head>
11.<body>
12.<div class="row">
13.    @Html.AntiForgeryToken()
14.    @(Html.Kendo().Grid<JccsRecordsRequest.ViewModels.SubmittedList>()
15.        .Name("SubmittedRequests")
16.        .Columns(columns =>
17.        {
18.            columns.Bound(p => p.LastName).Title("Last Name")
19.            columns.Bound(p => p.FirstName).Title("First Name")
20.            columns.Bound(p => p.BirthDate).Title("Date of Birth").Format("{0:MM/dd/yyyy}");
21.            columns.Bound(p => p.CreateDate).Title("Date & Time Submitted").Format("{0:MM/dd/yyyy hh:mm:ss tt}");
22.            columns.Bound(p => p.RequestorType).Title("Request Type");
23.            columns.Bound(p => p.RequestorID).Title("").Filterable(false)
24.            .ClientTemplate(Html.ActionLink("View", "RequestDetail", new { id = "#= RequestorID #", RequestStatus = "#= RequestStatus #", ButtonID = "Start" }, new { @class = "btn btn-success" }).ToHtmlString());
25.        })
26. 
27.        .Pageable()
28.        .Sortable()
29.        .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
30.        .DataSource(source => source
31.            .Ajax()
32.            .PageSize(20)
33.            .Read(read => read.Action("GetSubmittedRequests", "Admins").Data("sendAntiForgery"))
34.        )
35.    )
36.</div>
37. 
38. 
39.<script type="text/javascript">
40.    function sendAntiForgery() {
41.        return { "__RequestVerificationToken": $('input[name=__RequestVerificationToken]').val() }
42.    }
43.</script>
44.</body>

 

Controller.cs

01.[HttpPost]
02.[ValidateAntiForgeryToken]
03.public ActionResult GetSubmittedRequests([DataSourceRequest] DataSourceRequest request)
04.{
05.    return Json(SubmittedRequestsList().ToDataSourceResult(request));
06.}
07. 
08.public IEnumerable<SubmittedList> SubmittedRequestsList()
09.{
10. 
11.    var db = new RecordRequestContext();
12. 
13.    var SubmitedRequestsEnum = db.Requestor
14.        .Where(w => w.RequestStatus == RequestStatus)
15.        .OrderByDescending(o => o.CreateDate)
16.        .Select(sl => new SubmittedList
17.        {
18.            RequestorID = sl.RequestorID,
19.            StudentLastName = sl.LastName,
20.            StudentFirstName = sl.FirstName,
21.            StudentBirthDate = sl.BirthDate,
22.            CreateDate = sl.CreateDate,
23.            RequestorType = sl.RequestorType,
24.            RequestStatus = sl.RequestStatus,
25.            RequestCount = (from a in db.Requestor where a.RequestStatus == RequestStatus select a).Count()
26.        }
27.        ).ToList();
28.    return SubmitedRequestsEnum;
29.}

Upon inspection in Google Developer Tools, it just occurs when we filter on more than one column. We are using the latest Kendo UI javascript files (2017.2.1018), so I'm unsure what is going on.

Please advise. Thanks.

Stefan
Telerik team
 answered on 30 Oct 2017
1 answer
241 views

I am not able to find any examples of how to bind Remote data from the Model to a multi axis chart.

 

Where I have Lines plotted and Bar Graphs plotted below.

 

Any examples or insight on how I may accomplish this?

Georgi
Telerik team
 answered on 27 Oct 2017
1 answer
210 views

Hello everyone.

I will try to explain the best I can in English.

I have the trial version for Asp.Net MVC, and I am observing problems with the framework 4.6 and adding the assembly to System.Web.Mvc.dll. In the installation paths of the trial I only find reference to framework 4.5 (net 45 folder). So, the trial version is only for developments in 4.5 or lower?

I would be interested in buying the component. Could Ihave more possibilities of framework when making the purchase? My project requirements are in framework 4.6

Thank you very much for assisting me

PD: I don't know if this is the best place to post these questions but I could not find the best part

Dimitar
Telerik team
 answered on 27 Oct 2017
1 answer
253 views

I am beginning to dread new updates to Telerik UI for ASP.NET MVC. It takes hours and hours to upgrade.

For the last 2 upgrades I have had to unbind my ASP.NET MVC project from source control (TFS) before even attempting to run the upgrade wizard. If I am lucky it takes hours, if I am unlucky it takes hours and then runs out of memory.

Now I am trying to upgrade from v2017.3.913 to v2017.3.1018, I've unbound the project from source control, ran the upgrade wizard, eventually ran out of memory. I don't need all the culture files that the upgrade is trying to add to my project, which I presume is why the upgrade takes so long (and often fails).

I can't keep spending so much time trying to upgrade to the latest versions. So does anyone have any thoughts on how to speed this up?

 

Misho
Telerik team
 answered on 27 Oct 2017
5 answers
2.7K+ views

Hi,

i am generating a grid with Multi select Combo box in it using a column template.

i am able to select the multiselect combo values and able the read the selected items.

 

i have one more requirement, i have to select/check the values of multiselect combo values dynamically through JQuery.

Please help me how to do that? Below is the code.

This is the code of a grid, where i am creating Multiselect combo box in one of the cell.

var dataSource = new kendo.data.DataSource({

        transport: {
            read: function (e) {
                e.success(result);
            },
            update: function (e) {
                e.success();
            },
            create: function (e) {
                var item = e.result;
                item.Id = result.length + 1;
                e.success(item);
            }
        },
        schema: {
            model: {
                id: "SNO",
                fields: {
                    SNO: { type: "int" },
                    PassengerStatus: { type: "int" },
                    ElevatorShutdown: { type: "bool" },
                    TrappedPassenger: { type: "bool" },
                    UnitControllerStatus: { type: "bool" },
                    ActiveVoiceVideoCall: { type: "bool" },
                    controllerStatus: { type: "bool" },
                    Delay: { type: "int" }
                }
            }
        }
    });

    //my own
    $("#UnitgridPerf").kendoGrid({
        dataSource: dataSource,

        editable: { createAt: "bottom" },
        dataBound: function (e) {
            createMultiSelect(e);

        },
        // pageable: true,

        columns: [
            {
                field: "SNO", width: "50px", editable: function (arg) { return true; }, headerAttributes: {

                }
            },

            {
                field: "PassengerStatus", title: "PD", editable: function (arg) { return true; }, width: "40px"
                , headerAttributes: {

                }
            },
            {
                field: "ElevatorShutdown", title: "OOS", editable: function (arg) { return true; }, width: "50px"
                , headerAttributes: {

                }
            },
            {
                field: "TrappedPassenger", title: "TP", editable: function (arg) { return true; }, width: "50px"
                , headerAttributes: {

                }
            },
            {
                field: "UnitControllerStatus", title: "REM", width: "170px", editable: function (arg) { return false; }, template: "<select class='Multiselectval'></select>"
                , headerAttributes: {

                }


            },
            {

                field: "ActiveVoiceVideoCall", title: "VC", width: "50px", editable: function (arg) { return true; }
                    , headerAttributes: {

                    }

            },
            {
                field: "controllerStatus", title: "CTRL", width: "50px", editable: function (arg) { return true; }
                    , headerAttributes: {

                    }
            },

            {

                field: "Delay", editable: function (arg) { return true; }, width: "50px"
                , headerAttributes: {

                }
            },
          { command: "destroy", title: "", width: "40px" }

        ],


    });


    // code to add Multi Select Combo box to Kendo Grid Cell

    var checkInputs = function (elements) {
        elements.each(function () {
            var element = $(this);
            var input = element.children("input");

            input.prop("checked", element.hasClass("k-state-selected"));

        });
    };
    // create MultiSelect from select HTML element
    function createMultiSelect(e) {
        $(".Multiselectval").append(new Option('ALARM_HANDLER_TASK', enumRemComponents.ALARM_HANDLER_TASK));
        $(".Multiselectval").append(new Option('PERFORMANCE_TASK', enumRemComponents.PERFORMANCE_TASK));
        $(".Multiselectval").append(new Option('REM_DEVICE_AUTH_TASK', enumRemComponents.REM_DEVICE_AUTH_TASK));
        $(".Multiselectval").append(new Option('SERIAL_LINK_TASK', enumRemComponents.SERIAL_LINK_TASK));
        $(".Multiselectval").append(new Option('STATE_MACHINE_TASK', enumRemComponents.STATE_MACHINE_TASK));
        $(".Multiselectval").append(new Option('UNKNOWN_TASK', enumRemComponents.UNKNOWN_TASK));

        var grid = e.sender;
        required = $(".Multiselectval").kendoMultiSelect({
            itemTemplate: "#:data.text# <input type='checkbox'/>",
            autoClose: false,
            dataBound: function () {
                var items = this.ul.find("li");
                setTimeout(function () {
                    checkInputs(items);
                });
            },
            change: function () {
                var items = this.ul.find("li");
                checkInputs(items);
            }
        }).data("kendoMultiSelect");
    }

The above code is working properly.

 

Now i want to select the Multiselect combo values based on the data i got from Database., below is the code i am trying for that, but i am unable to make the values selected.

 var grid = $('#UnitgridPerf').data("kendoGrid");
            grid.dataSource.data(result); 

            for (var j = 0; j < UnitPattern.length; j++) {
                if (PatternName == UnitPattern[j].PatternName) {
                    for (var i = 0; i < UnitPattern[j].Devicestatus[0].ComponentStatus.length; i++) {

                        var gridRows = grid.tbody.find('tr');


                        var row = $(gridRows[i]);
                       
                        var rid = row.find('.Multiselectval');
                        alert(rid[1][UnitPattern[j].Devicestatus[0].ComponentStatus[i].Component].value);

                        
                       rid[1][UnitPattern[j].DeviceStatus[0].ComponentStatus[i].Component].value.checked;

                   

                      // $('.rid option[value=' + UnitPattern[j].DeviceStatus[0].ComponentStatus[i].Component + ']').attr('selected', true);
                    }
                }

Please help on this.

 

Alex Hajigeorgieva
Telerik team
 answered on 27 Oct 2017
6 answers
326 views

Hi,

In Excel there is a setting to set the rows that will repeat at the top of the grid on each page in Page Setup -> Sheet - Print Titles - Rows to repeat at top.

I don't see how to do that in Telerik.Windows.Documents.Spreadsheet. Is it possible?

 

Veselin Tsvetanov
Telerik team
 answered on 27 Oct 2017
1 answer
593 views

Is it possible to make the Radgrid work in the same way as excel so that you can copy and paste a table of data over the top of cells? There is a javascript solution on the market that does this in the right way but I would prefer to do this in MVC using telerik. The example of what I need it to do is: https://www.jqwidgets.com/asp.net-core-mvc-tag-helpers/asp.net-core-mvc-grid-tag-helper/index.htm#https://aspcore.jqwidgets.com/mvc/TagHelpers/GridCellEdit

If somebody could give me a clue as to how this can be done in Telerik, that would be great! Many thanks

 

Tsvetina
Telerik team
 answered on 27 Oct 2017
2 answers
266 views

Hi.  I have a filter in place and I change it at times in js like this.

var ds = $("#scheduler").data("kendoScheduler").dataSource;
           ds.filter([
               {
                   "logic": "or",
                   "filters": [
                       {
                           "field": "OwnerID",
                           "operator": "eq",
                           "value": 1
                       },
                       {
                           "field": "OwnerID",
                           "operator": "eq",
                           "value": 2
                       },
                       {
                           "field": "OwnerID",

In my popup custom edit window I have a dropdown with OwnerID values 1 to 8.

I want the dropdown to show only one default value if my filter is for only 1 value.

My problem is how to read/get data from the current filter.

function filterdata() {
        var scheduler = $("#scheduler").data("kendoScheduler");
        var dataSource = scheduler.dataSource;
        var filters = dataSource.filter();
        alert(filters);  //  this returns the the text "Object"
 
 
      return {
            dept: 2
      };
    }

 

So...  How can I get and check the array values of the filter object?

Thanks

 

Rick Hubka
Top achievements
Rank 1
 answered on 26 Oct 2017
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
+? 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?