Telerik Forums
UI for ASP.NET MVC Forum
8 answers
326 views
Hi, I nedd some help.
I  want to populate a Grid in MVC but I can't
I have the next code in view Index

<%: Html.Kendo().Grid<KronosWorkV2.Models.Employee>()
                    .Name("Grid")
                    .Columns(columns => {        
                        columns.Bound(p => p.id);
                        columns.Bound(p => p.Name).Width(140);
                    })                        
                    .Pageable()
                    .Navigatable()
                    .Sortable()
                    .Scrollable()
                    .DataSource(dataSource => dataSource        
                        .Ajax()
                        .Read(read => read.Action("Editing_Read", "SupEmps"))                        
                    ) %>

then I have the nex code in ActionResult:

public ActionResult Editing_Read([DataSourceRequest] DataSourceRequest request)
        {            
            return Json(db.Employees.ToDataSourceResult(request));            
        }

when I debug in the action I see that the object db.Employees has items(rows) but when return to Index.aspx the Grid is empty.
 
where I am rong, some body please can help me.
Thanks beforehand for your help.
Michele
Top achievements
Rank 2
 answered on 31 Jul 2013
1 answer
144 views
Hi,

I need change functionality for standard adding a new row (toolbar command Create() ) so that it would add the row straight above the selected row, for user's convenience - to allow the user to fill new row data based on the data in the selected row.
See the attached picture

Thank you in advance

Shabtai

Iliana Dyankova
Telerik team
 answered on 31 Jul 2013
4 answers
224 views
Hello,
I'm trying to load some combobox values from the controller... but when I open the dropdown I got 2 items undefined (even if in the controller for test I return an empty collection)...what am I doing wrong?
Thanks

View :

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<KendoUIMvcApplication1.TestObj>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    PROVA HEADER
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
   <%
       Html.Kendo().ComboBox()
           .Name("comboBox")
           .DataTextField("Description")
           .DataValueField("Value")
           .AutoBind(false)
           .Placeholder("Selezionare un oggetto")
           .DataSource(ds =>
               {
                   
                  // ds.Ajax()
                  // .ServeOperation(false)    
                   ds.Read(read =>
                       {
                           read.Action("GetCombo", "TestIDEA");
                       });
               })
               .Events(events =>
                   {
                       events.Change("Test");
                   })
               .Render();
        %>
   
    <script>
        function Test(e) {
            alert('changed');
        }
        
    </script>
</asp:Content>

Controller :

   public ActionResult GetCombo([DataSourceRequest] DataSourceRequest request)
        {

            List<TestObj> myList = new List<TestObj>();

            //myList.Add(new TestObj { Value = "1", Description = "A1" });
            //myList.Add(new TestObj { Value = "2", Description = "A2" });

            return Json(myList, "text/html", Encoding.UTF8, JsonRequestBehavior.AllowGet);
          
        }

Thanks
Michele
Top achievements
Rank 2
 answered on 31 Jul 2013
1 answer
227 views
Hi, 
   I am remotely consuming a grid hosed in an MVC application. For the most part I have got it working as I am using template fields for the allot of things. 

I am parsing some of the elements in a method that calls to controller which renders the grid as a partial view. I then spit this out into a literal control in an aspx page. 

I need to be able to get the pager functionality calling the ajax data  source with an absolute url rather than the relative one it currently uses. 

so this is my data source action 
[AllowCrossSite]
public ActionResult FallsDataSource([DataSourceRequest] DataSourceRequest request, string casenote)
{
    IList<FallsAssessEventDTO> events = bedmanEvents.GetEvents(casenote, BedmanEventType.FallsRiskAssessment).Cast<FallsAssessEventDTO>().ToList();
    var model = events.Select(e => (FallsAssessment)e).ToList();
    AddImages(model);
    var queryable = model.AsQueryable();
    return Json(model.ToDataSourceResult(request));
}
below is the ajax datasource configuration 

datasource.Ajax().Read(read => read.Url("http://" + Request.Url.Host).Action("FallsDataSource", "FallsAssessment", new { Casenote = ViewBag.Casenote }))).Pageable()


I was looking at the Url method on the CrudOperationBuilder but unsure how to use this properly. 

Thanks 

David 
Vladimir Iliev
Telerik team
 answered on 31 Jul 2013
7 answers
318 views

I'm experimenting with the scheduler to display some log entries from one of our applications (events with a start / end date  - and although I can display the events, the time bands aren't lining up with the events.

The upshot of this is that events happening at 11pm, are showing up in the 8pm band, due to the slippage.

I've attached a screenshot.

The definition is:-

@{
    DateTime startDate = ViewBag.InitialDate;
    DateTime startTime = ViewBag.StartTime;
 
@(Html.Kendo().Scheduler<LogBuddy3.Models.SchedulerEvt>()
    .Name("scheduler")
     
      
      .Date(startDate)
    .StartTime(startTime)
 
     .Height(600)
     .Views(views=>
    {
        views.DayView();
        views.WeekView();
        views.AgendaView(av=>av.Selected(true));
 
    })
       
        .Editable(false)
         
        
        .BindTo(Model)
 
    )
                         
}

Thanks

Erik
Top achievements
Rank 1
 answered on 30 Jul 2013
2 answers
104 views
Hi,

I'm trying to filter on value from parent GRID  (dynamically)  
.Filter(filter => filter.Add(prod => prod.COUNTER_PRNITER_ID).IsEqualTo(decimal.Parse("# =PRINTER_ID#")))
But he try to parse the string not the value of printer id

the COUNTER_PRNITER_ID is the Forgen KEY of the PRINTER_ID (Parent KEY)

I want to show in the second GRID only the data that belong to selected printer
Kan somebody help me?

Thanks in advance
Dmitriy Utsmiyev

Sample code below

 @(Html.Kendo().Grid((IEnumerable<KendoUIMvcLoginApp.Models.Data.Printer>)ViewBag.Printers)
            .Name("grid")
            .Columns(columns =>
            {
                columns.Bound(e => e.PRINTER_NAME).Title("Printer Name");
                columns.Bound(e => e.PRINTER_IP).Hidden();
                columns.Bound(e => e.PRINTER_ID).Hidden();
                columns.Bound(e => e.PRINTER_MIB_ID).Hidden();
               
                columns.Command(command => command.Custom("Start").Click("showDetails")).Width(50);
            })
            .ClientDetailTemplateId("template")
            .DataSource(dataSource => dataSource
                .Ajax()
                .Read(read => read.Action("HierarchyBinding_Employees", "Grid"))
            )
            .Events(events => events.DataBound("dataBound"))
        )
   
        <script id="template" type="text/x-kendo-template">
            @(Html.Kendo().TabStrip()
                    .Name("tabStrip_#=PRINTER_ID#")
                    .SelectedIndex(0)
                    .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
                    .Items(items =>
                    {  
                        items.Add().Text("Test Counters").Content(@<text>
                            @(Html.Kendo().Grid((IEnumerable<KendoUIMvcLoginApp.Models.Data.Counter>)ViewBag.Counters)
                                .Name("grid_#=PRINTER_ID#")
                                .Columns(columns =>
                                {
                                    columns.Bound(o => o.COUNTER_NAME).Title("Name");
                                    columns.Bound(o => o.COUNTER_VALUE).Title("Value");
                                    columns.Bound(o => o.COUNTER_PRICE).Title("Price");
                                    columns.Bound(o => o.COUNTER_PRICE_TOTAL).Title("Total Price");
                                    columns.Bound(o => o.COUNTER_PRNITER_ID).Title("ID");
                                })
                                .DataSource(dataSource => dataSource
                                    .Ajax()
                                    .Read(read => read.Action("HierarchyBinding_Orders", "Grid", new { employeeID = "#=PRINTER_ID#" }))
                                    .Filter(filter => filter.Add(prod => prod.COUNTER_PRNITER_ID).IsEqualTo(decimal.Parse("# =PRINTER_ID#")))
                             )
                                .Sortable()
                                .ToClientTemplate())
                        </text>
                        );
                        items.Add().Text("Printer Information").Content(
                            "<div class='employee-details'>" +
                                "<ul>" +
                                    "<li><label>Printer:</label>#= PRINTER_NAME #</li>" +
                                    "<li><label>Ip address:</label>#= PRINTER_IP #</li>" +
                                    "<li><label>ID:</label>#= PRINTER_ID #</li>" +
                                    "<li><label>MIB:</label>#= PRINTER_MIB_ID #</li>" +
                                "</ul>" +
                            "</div>"
                        );
                    })
                    .ToClientTemplate())
        </script>        <script>
            function dataBound() {
                this.expandRow(this.tbody.find("tr.k-master-row").first());
            }
        </script>
         <script>
            function dataBound() {
                this.expandRow(this.tbody.find("tr.k-master-row").first());
            }
        </script>
        <style scoped="scoped">
            .k-detail-cell .k-tabstrip .k-content {
                padding: 0.2em;
            }
            .employee-details ul
            {
                list-style:none;
                font-style:italic;
                margin: 15px;
                padding: 0;
            }
            .employee-details ul li
            {
                margin: 0;
                line-height: 1.7em;
            }            .employee-details label
            {
                display:inline-block;
                width:90px;
                padding-right: 10px;
                text-align: right;
                font-style:normal;
                font-weight:bold;
            }
        </style>
Vladimir Iliev
Telerik team
 answered on 30 Jul 2013
13 answers
225 views
Hi there,

I have just installed KendoUI 2013.2.716 on a new machine. It previously had no version of KendoUI on it. I have installed the VS Extensions to allow MVC apps to be created from scratch including KendoUI. I am on VS2012 Version 11.0.60610.01 Update 3. I am running Windows 8 Pro. 

The problem is that Javascript is failing.

I have gone for the fresh install because that version of KendoUI is also failing on another machine that I attempted to upgrade, but I couldn't figure out why. So I decided to install a fresh install on a new machine and copy the files across, if it was all working. Unfortunately, it's not.

javascript-error-1.png shows an error that occurred immediately in kendo.all.min.js
javascript-error-2.png shows the next error that occurred in kendo.aspnetmvc.min.js
javascript-error-3.png shows the next error that occured in dynamic javascript. 

The head section is as follows:
    <head>
        <title>Home Page</title>
        <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
        <link href="/Content/kendo/2013.2.716/kendo.common.min.css" rel="stylesheet" type="text/css" />
    <link href="/Content/kendo/2013.2.716/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
    <link href="/Content/kendo/2013.2.716/kendo.default.min.css" rel="stylesheet" type="text/css" />
    <link href="/Content/kendo/2013.2.716/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/kendo/2013.2.716/jquery.min.js"></script>
    <script src="/Scripts/kendo/2013.2.716/kendo.all.min.js"></script>
    <script src="/Scripts/kendo/2013.2.716/kendo.aspnetmvc.min.js"></script>
    <script src="/Scripts/kendo.modernizr.custom.js"></script>
</head>

Is this fixable? Otherwise I'm hoping to get hold of a starter MVC4 application that works with the latest KendoUI release.

Regards,
Tony










Tony
Top achievements
Rank 1
 answered on 30 Jul 2013
1 answer
1.5K+ views
Hello,
I've started playing with kendo and I got a problem with getting the data on the eventchanged... my code is

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <input id="comboBox" />
   
    <script>
        $(document).ready(function () {
            $("#comboBox").kendoComboBox({
                dataTextField: "text",
                dataValueField: "value",
                dataSource: [
                    { text: "Item1", value: "1" },
                    { text: "Item2", value: "2" }
                ],
                change: function (e) {
                    var combobox = $("#comboBox").data("kendoComboBox");
                      var selectedIndex = combobox.select();
                    alert(combobox.select().text);
                }
            });
        });

    </script>
</asp:Content>

How do I get the object I've selected? for now it's as imple text/value what if it's an object of type

text, value, additionalinfo?

Thanks
Dimiter Madjarov
Telerik team
 answered on 30 Jul 2013
1 answer
170 views
Hi,

I believe my experience below is a bug, in which case I can report it elsewhere if this is not the proper channel.

I'm currently creating a Menu with custom text in an absolutely-positioned context menu. Each item has a checkbox and a label. Everything works fine except clicking on the label does not alter the checkbox (no click/change event is fired on the checkbox). What's even weirder, is that while holding the mouse button down on the label, the checkbox changes to its active state, so the link between the two items is clearly made.

I believe this bug stems from the openOnClick and closeOnClick configurations, because with a simple test case of one item, the bug can only be reproduced by passing values to one or both of these parameters in the configuration object. Adding a child to this test case will always produce the bug (presumably because the configurations are set to their defaults internally).

Below is my server wrapper code and a client-side test case. Both exhibit the bug, although the subitem from the latter can be removed to result in correct functionality.
@(Html.Kendo().Menu()
            .Name("s-mapMenu")
            .Orientation(MenuOrientation.Vertical)
            .Direction(MenuDirection.Right)
            .OpenOnClick(false)
            .CloseOnClick(false)
            .BindTo((IEnumerable<MyModels.Event>)ViewBag.EventList, (Kendo.Mvc.UI.Fluent.NavigationBindingFactory<MenuItem> mappings) => mappings
                .For<MyModels.Event>(binding => binding
                    .ItemDataBound((item, e) =>
                    {
                        item.Text = "<input type=\"checkbox\" checked class=\"s-checkbox\" id=\"toggle-" + e.EventID + "\" /><label for=\"toggle-" + e.EventID + "\">" + e.Name + "</label>";
                        item.Encoded = false; // Need this in order to render item.Text as HTML
                    })
                    .Children(e => e.EventObjects.Where(obj => obj.ArchivedDate == null).OrderByDescending(obj => obj.LastUpdated))
                )
                .For<MyModels.EventObject>(binding => binding
                    .ItemDataBound((item, o) =>
                    {
                        item.Text = "<input type=\"checkbox\" checked class=\"s-checkbox\" id=\"toggle-" + o.EventObjectID + "\" /><label for=\"toggle-" + o.EventObjectID + "\">" + o.Name + "</label>";
                        item.Encoded = false; // Need this in order to render item.Text as HTML
                    })
                    .Children(o => o.EventObjects.Where(obj => obj.ArchivedDate == null).OrderByDescending(obj => obj.LastUpdated))
                )
            )
        )
<ul id="myMenu">
    <li>
        <input id="foo" type="checkbox" /><label for="foo">hello</label>
        <!-- Removing the interior list below removes the bug -->
        <ul>
            <li>child</li>
        </ul>
    </li>
</ul>
<script>
    $("#myMenu").kendoMenu();
</script>
If you know of any workarounds, I would greatly appreciate it, as right now I have to manually listen for click events on the label.

Thanks,
Jeff
Dimo
Telerik team
 answered on 30 Jul 2013
4 answers
164 views
I am new to the Kendo  UI framework and would like some assistance in setting up an application layout.

In looking at several ways of laying out an application, I have settled on the layout the Telerik team used on their current incarnation of TeamPulse, and would like some assistance on setting up a similar layout.I would like to implement:
  • content containers as seen in the application
  • pin/unpin navigation on the LHS and RHS
  • LHS menu, where clicking on Work, Plan Analyze, Settings, slides the menu over, exposes the sub-menu. I would also like to know if this menu can go more than two levels deep, as I would prefer this type of menu over a tree-type menu.
I realize some of this can all be done without Telerik controls, but since I am considering using the KendoUI components, I'd like some assistance on using them to generate this UI.

I have started to go through some good tutorials, and currently working on a SPA application that makes use of kendo.fx.  I'm guessing the slideInLeft/Right is what is used for the TeamPulse LHS menu.

Is there a tutorial around that explains how to setup a similar UI?

Assistance appreciated.
Jordan
Telerik team
 answered on 30 Jul 2013
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
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
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?