Telerik Forums
UI for ASP.NET MVC Forum
4 answers
138 views
Hello,

I m using VS2012 and I m working on a MVC 4 project with the trial version of Kendo.I've managed to implement a simple grid and got some basic functionality.
My controller has these 2 methods

private static IEnumerable<MemberViewModel> GetMembers()
      {
          var context = new EntityContext();
          return context.Members.Select(mem => new MemberViewModel
          {
              MemberId=mem.MemberId,
              Name=mem.FirstName,
              SurName = mem.LastName
           
          });
          
        
      }

public ActionResult Members_Read([DataSourceRequest] DataSourceRequest request)
       {
           return Json(GetMembers().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
       }
And in my view i have this header

<header>

    <link href="~/Styles/kendo.common.min.css" rel="stylesheet" />
    <link href="~/Styles/kendo.default.min.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.9.0.min.js"></script>
    <script src="~/Scripts/kendo.all.min.js"></script>
    <script src="~/Scripts/kendo.aspnetmvc.min.js"></script>

</header>
and the grid code is 
(Html.Kendo().Grid(Model)
      .Name("Grid")
      .DataSource(dataSource => dataSource
                                    .Ajax()
                                    .ServerOperation(false)
                                    .Read(read => read.Action("Members_Read", "Home").Type(HttpVerbs.Get)))
                                     
                                     .Pageable()
                                     .Selectable()
                                     .Sortable()
 
      )
As i said grid is showing the results and pagination.But a)Selectable does not work neither in Chrome-Firefox
 b)Sortable is always giving me a json result from server side.I cannot enable client sorting besides i wrote my code exactly the same
as kendo mvc examples. c)ServerOperation(false) still does not disables server side sorting.d)I ve added to web.config this line
 <modules runAllManagedModulesForAllRequests="true" />  but again no client side sorting.

Any ideas on what is wrong with the above?
Thanx in advance

Missing User
 answered on 22 Jan 2013
26 answers
2.7K+ views
Started a brand new VS2012 MVC4 project and pulled down the Kendo UI from NuGet.

Followed the setup instructions for Kendo from http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/introduction and I'm finding the CSS or js for Kendo is never rendered/sent to my browser.

This worked in the RC version of VS2012, but once i upgraded to RTM it started to fail.
from BundleConfig.cs
//jquery
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                                    "~/Scripts/jquery-1.*"));
 
// The Kendo JavaScript bundle
            bundles.Add(new ScriptBundle("~/bundles/kendo").Include(
                            "~/Scripts/Kendo/2012.2.710/kendo.web.min.js", // or kendo.all.* if you want to use Kendo UI Web and Kendo UI DataViz
                            "~/Scripts/Kendo/2012.2.710/kendo.aspnetmvc.min.js"));
 
    // The Kendo CSS bundle
            bundles.Add(new StyleBundle("~/Content/kendo").Include(
                            "~/Content/Kendo/2012.2.710/kendo.common.*",
                            "~/Content/Kendo/2012.2.710/kendo.default.*"));

From _Layout.cshtml
@Styles.Render("~/Content/kendo")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/kendo")         

No errors are generated when my site runs, and looking at Chrome developer window nothing is generated for those @Scripts.Render lines for Kendo, the css or the js.

Thoughts, or something else I can try?

-ben
Atanas Korchev
Telerik team
 answered on 21 Jan 2013
3 answers
294 views
Hi telerik,

i would like save user settings of grid like filtering, sorting, selections etc. How can do it with your grid. In my project i used kendoui MVC wrapper. If navigate from one web page(with filtered grid) to other (for example detail row) web page all settings of my grid are lost if return to first.

Could you help me?
Petur Subev
Telerik team
 answered on 21 Jan 2013
1 answer
214 views
I am using FCKEditor in one of my grid popup edit forms.  When changing the text in FCKEditor - if I don't change any other field values - by the looks of it the model is not considered "dirty" and results in the ajax call not being made to my controller to save the changes.

I need to have a method / way to force the ajax call to be made - no matter what the client side model indicates - dirty or not.

I have set the ev.model.dirty to true in the client side onsave callback - but it's still not firing the ajax call to my controller on update.

Please advise.

p.s. I am not at liberty of changing to any other editor - the client insists that FCKEditor be used.

Thank You.
Rene
Top achievements
Rank 1
 answered on 19 Jan 2013
2 answers
211 views
Hi!
I have two models in one-more relation:   One "Region" to more "Punkt"
I'am using ASP.NET MVC4 and have Edit page of "Punkt" Model record. The Edit page has ComboBox populated with Regions but which I have to set to adequate Region (where Punkt belongs to).

The problem: I don't know how to set ComboBox to adequate Punkt option. 

Here is PunktController:
// GET: /Punkt/Edit/5
public ActionResult Edit(int id = 0)
{
    Punkt punkt = db.Punktovi.Find(id);
    
    if (punkt == null)
    {
        return HttpNotFound();
    }
 
    ViewBag.MaticniRegionId = new SelectList(db.Regioni, "RegionId", "Name", punkt.MaticniRegionId);
    return View(punkt);
}

//THIS IS MY METHOD USED FOR POPULATING COMBOBOX (SEE: EDIT view)
public ActionResult getRegioni()
{
    if (Request.IsAjaxRequest())
    {
        var ISPISContext = new ISPISContext();
        return Json(ISPISContext.Regioni.Select(r => new { RegionId = r.RegionId, Name = r.Name }), JsonRequestBehavior.AllowGet);
    }
    return View();
}

Here is Edit.cshtml view:
@(Html.Kendo().ComboBox()
    .Name("MaticniRegionId")
    .Placeholder("Select region...")
    .DataTextField("Name")
    .DataValueField("RegionId")
    .DataSource(source =>
    {
        source.Read(read =>
        {
            read.Action("getRegioni", "Punkt");
        });
    })
    .Suggest(true)
)

Ivan
Top achievements
Rank 1
 answered on 18 Jan 2013
1 answer
1.2K+ views
I have 2 Views:  one called Index and one called Summary.  I want to be able to input the values on Index and display back the values to the user on Summary, similar to shopping cart functionality on your favorite e-commerce sites.  The code for the Index is working as expected.  Here's the code I have for my Create action result that is bound to the Save button on the grid.  

[HttpPost]
        public ActionResult Create([Bind(Prefix = "models")]List<ProductModel> products)
        {
            if (products != null)
            {
                products = CalculateRoyalties(products);
            }
            return RedirectToAction("Summary", products);
            //return View("Summary", products);
        }

I've tried both RedirectToAction and return View as seen in code above.  Return View will call the page but will not redirect to it.  RedirectToAction doesn't seem to do anything.  In both cases, my screen returns to my Index page instead of my Summary page.  The products is the list that I am passing to the Summary page to display.  

Any help would be appreciated.
Dimiter Madjarov
Telerik team
 answered on 18 Jan 2013
1 answer
473 views
Hello,

I have a grid that is set to PopUp when Editing
.Editable(ed=>ed.Mode(GridEditMode.PopUp).TemplateName("ActionedBy"))
So I can click on the edit button next to each row in the grid to enter editing mode (which pops up) or click on the Add new button on the toolbar to also open the popup to create a new item.

If I don't want the add new button, but want to have a link somewhere in my page to add new .. How can I open up the "add new" popup?
Can this be done via Javascript?

then if I wanted to remove the edit button next to each row, and make the Name column a hyperlink , so if you click on that item, it will open the "Editing" popup mode for that item ?

Regards,
Vladimir Iliev
Telerik team
 answered on 18 Jan 2013
5 answers
577 views
How can I apply Kendo UI validations with Entity class Data Annotations?

I want to utilize my Validation messages defined with my Model classes. I love to use Kendo UI Validations but I am struggling to implement my ViewModel entity class data annotations. 

Please show/refer some demos of this problem's solution.

Regards,
Haidar
Daniel
Telerik team
 answered on 17 Jan 2013
2 answers
354 views
I am trying to teach myself both ASP.Net MVC and Kendo.   I used Microsoft's "MvcMusicStore" tutorial and app to get the basic principles and next have been working through replacing some of the tutorial app's HTML controls with Kendo from the 2012.3.1114 "Complete for MVC" download to learn how to use Kendo itself. 

Two questions:

1.)  I replaced one of the app's main HTML tables (on the /StoreManager/Index/ view) with the Kendo Grid.   The original table is output by the @RenderBody() function in the 'Main" <div> on the shared "_Layout.cshtml page.   That layout has a vertical menu panel to the left of this <div> that extends down the upper left side of table, so the entire table renders to the right of that menu.  (See attached MvcMusicStoreWithStockTable.jpg screenshot).

I have the Kendo Grid rendering, now, but instead of rendering in the <div> to the right of the shared vertical menu, it renders from the entire page's left margin completely below the vertical menu panel and with its left boundary equal to the left boundary of that panel.  It's basically placed below the shared _Layout instead of rendered as part of it.  (See attached MvcMusicStoreWithKendoGrid.jpg screenshot).

What am I doing wrong here such that I can't retain the menu panel to the left of the "Main" <div> containing the Kendo grid?

2.)   Part of the MvcMusicStore tutorial is about using Html Helpers.   Part of the tutorial defines an "@Truncate" helper which is used to truncate some of the longer strings and leave them as partial string plus an ellipsis.   In the original table, it is used as in this:

        <td>
            @Truncate(item.Artist.Name, 25)
        </td>


But I cannot find a syntax in the "Columns.Bound" sequence of the Grid that will allow me to use the Truncate helper without throwing syntax errors.  (I had thought this might be possible via a Kendo Grid Column Template).   Is that possible or do I need to implement an intermediate ViewModel with the truncation built in instead of being able to make that decision at the View HTML level?

Thank you in advance for the help,
-Bob

@model IEnumerable<MvcMusicStore.Models.Album>
           
@helper Truncate(string input, int length)
{
    if (input.Length <= length) {
        @input
    }
    else {
        @input.Substring(0, length)<text>...</text>
    }
}

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>

@(Html.Kendo().Grid(Model)    
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(o => o.Genre.Name).Title("Genre");
        columns.Bound(o => o.Artist.Name).Title("Artist");
        columns.Bound(o => o.Title).Title("Album Title");
        columns.Bound(o => o.Price).Title("Price");

        columns.Template(@<text>
                    @Html.ActionLink("Edit", "Edit", new { id = @item.AlbumId }) |
                    @Html.ActionLink("Details", "Details", new { id = @item.AlbumId }) |
                    @Html.ActionLink("Delete", "Delete", new { id = @item.AlbumId })  
        </text>);
    })
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { @class = "maxHeight" }).Scrollable(scrolling => scrolling.Height("auto"))
    )

** Note that overwriting the installed Kendo MVC 2012.3.1114 with the files from hotfix 2012.3.1304 did not help.
BRiddle
Top achievements
Rank 1
 answered on 17 Jan 2013
2 answers
122 views
For example on:  http://demos.kendoui.com/web/grid/hierarchy.html  Is there a setting (using the KendoUI ASP.NET MVC controls) that will change the initial grid loading so that the first nested record in a hierarchy grid (ie: the "Nancy" record) loads in a collapsed state.

I attached 2 images to clarify:
hierarchy-before.png is how it currently loads
hierarchy-after.png is how I would like it to initially load.

Thanks
Phil
Top achievements
Rank 1
 answered on 17 Jan 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
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
ColorPicker
DateRangePicker
Security
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
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?