Telerik Forums
UI for ASP.NET MVC Forum
3 answers
702 views
Am new to to Kendo.mvc
Inherited a MVC app that make use of a Kendo Grid that seems to be making calls to a controller methods (returns list).
When Debugging in VS2010 I can cannot hit break points that I am setting in the controller, is that because I am going out of process through the Kendo.MVC DLL ?

I would welcome any tips about debugging Kendo in general.
Atanas Korchev
Telerik team
 answered on 21 Oct 2013
1 answer
132 views
I am not able to bind a dropdown in a grid which is in a tabstrip. I followed the foriegn key demo but didn't work. I also tried binding dropdown to hard coded vaule but no luck. Below is the code of my view:

items.Add().Text("Charges").Content(@<text>
<h1>Hauling Charges</h1>
@(Html.Kendo().Grid<IAAI.ASAP.DomainModel.Operations.Dispatch.TowCharge>()
.Name("chargeGrid")
.Columns(columns =>
{
//columns.Bound(p => p.ChargeType).ClientTemplate("#=ChargeTypes.Charge_Description#").Title("Charge Type").Width(110); //.EditorTemplateName("testNew").Width(160);//Title("Charge Type").Width(110);//.EditorTemplateName("ChargeType");
// columns.Bound(p => p.ChargeType).EditorTemplateName("testNew").ClientTemplate("#=ChargeType.Charge_ID#");
columns.Bound(p => p.Amount).Title("Amount").Width(110);
columns.Bound(p => p.ResponsibleParty).Title("Responsible").Width(150);
//columns.ForeignKey(p => p.Charge_ID, (IEnumerable<IAAI.ASAP.DomainModel.Operations.Dispatch.ChargeType>)ViewBag.ChargeType, "Charge_ID", "Charge_Description")
// .Title("Charge Test").Width(150);
columns.ForeignKey(c => c.Charge_ID, new SelectList(new[]{
new {text="t1",value = "1"},
new {text="t2",value = "2"},
new {text="t3",value = "3"},
}, "value", "text")).Title("Charge New");
// columns.ForeignKey(p => p.Charge_ID, (System.Collections.IEnumerable)ViewBag.ChargeType, "Charge_ID", "Charge_Description").HtmlAttributes(new { id = "Charge_ID" }).Title("Charge New");
columns.Command(command => command.Destroy()).Width(110);
columns.Command(command => command.Edit()).Width(200);

})

.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Pageable()
.Sortable()
.DataSource(datasource => datasource
.Ajax()
.Model(model =>
{
model.Id(p => p.Charge_ID);
// model.Field(p => p.Charge_ID).Editable(false);
//// model.Field(p => p.Charge_ID).DefaultValue(1);
model.Field(p => p.ChargeTypes).DefaultValue(
ViewBag.ChargeType as IEnumerable<IAAI.ASAP.DomainModel.Operations.Dispatch.ChargeType>);
})

.Read(read => read.Action("ChargesRead", "Dispatch", new { salvageID = "#=SalvageID#", towbill="#=TowBillNumber#", towChargeType="Hauling" }))
.Update(update => update.Action("ChargeTypes_Update", "Dispatch"))
.Destroy(destroy => destroy.Action("ChargeTypes_Destroy", "Dispatch"))
)
.ToClientTemplate()
)


</text>
Daniel
Telerik team
 answered on 18 Oct 2013
3 answers
1.3K+ views
Hi,

I have the kendoui.aspnetmvc.2013.2.918 version, so I want to know if it is possible to populate the Upload control with a previously uploaded file and be able to remove the file if I want.
If it is not supported now, are you planning to add this functionality in a new release ?

Thanks in advance.
Dimiter Madjarov
Telerik team
 answered on 18 Oct 2013
0 answers
112 views
This demo shows the DropDownLists vertically:
http://demos.kendoui.com/web/dropdownlist/cascadingdropdownlist.html
Can i change this to horizontal?
Daniel
Top achievements
Rank 1
 asked on 18 Oct 2013
2 answers
429 views
I have a pure JS grid I was using with an asp.net forms backend (.ashx). It has been working fine for six months. I am trying to convert it to an MVC controller for the backend now, but having no luck:

function MaterialsGrid(ticket_ID, grid_id, is_editable, default_billable) {
    var self = this;
    self.ticket_ID = ticket_ID;
    self.GRID_ID = '#' + grid_id;
    self.HANDLER_URL = "/MaterialEntry";
    self.IS_EDITABLE = is_editable;
    self.DEFAULT_BILLABLE = default_billable;
 
    self.material_source = new kendo.data.DataSource({
        batch: true,
        schema: {
            model: {
                id: "MaterialEntryID",
                fields: {
                    MaterialEntryID: { type: "string" },
                    TicketID: { type: "string" },
 
                    ItemID: { type: "number", defaultValue: 0 },
                    ItemName: { type: "string", defaultValue: GridCommon.emptyText },
 
                    Description: { type: "string" },
 
                    Quantity: { type: "number", defaultValue: 0, validation: { required: true, min: 0 } },
 
                    Rate: { type: "number", defaultValue: 0 },
                    Total: { type: "number", defaultValue: 0 },
                     
                    Billable: { type: "boolean", defaultValue: self.DEFAULT_BILLABLE },
                },
            }
        },
 
        transport: {
            read: {
                url: self.HANDLER_URL + "/Read",
                dataType: "json",
                type: "GET",
                cache: false,
            },
            update: {
                url: self.HANDLER_URL + "/Update",
                dataType: "json",
                type: "PUT",
            },
            destroy: {
                url: self.HANDLER_URL + "/Destroy",
                dataType: "json",
                type: "POST",
            },
            create: {
                url: self.HANDLER_URL + "/Create",
                dataType: "json",
                type: "POST",
            },
 
            parameterMap: function (options, operation) {
                if (operation === "read") {
                    return { ticketID: self.ticket_ID };
                }
 
                if (operation === "read") {
                    return { ticketID: self.ticket_ID };
                } else if (options.models) {
                    return { materials: kendo.stringify(options.models), ticketID: self.ticket_ID };
                }
            }
        },
 
        error: GridCommon.showCallBackError
    });
 
    self.items_src = new kendo.data.DataSource({
        transport: {
            read: {
                url: self.HANDLER_URL + "/GetItems",
                dataType: "json",
                type: "GET"
            }
        },
        error: GridCommon.showCallBackError
    });
 
    self.itemDropDownEditor = function (container, options) {
 
        $('<input required data-text-field="ExtendedItemName" data-value-field="ItemName" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({
                autoBind: false,
                optionLabel: { ExtendedItemName: GridCommon.emptyText, ItemID: 0 },
                dataSource: self.items_src,
                change: function (e) {
                    options.model.set('ItemID', e.sender.dataItem().ItemID);
                }
            });
    }
 
    self.updateTotal = function (e) {
        var r = e.values.Rate ? e.values.Rate : e.model.Rate;
        var q = e.values.Quantity ? e.values.Quantity : e.model.Quantity;
        e.model.set('Total', q * r);
    }
 
    self.init = function () {
 
        var tools = null;
        var row_commands = null;
        if (self.IS_EDITABLE) {
            tools = [
                { name: "save", text: "Save" },
                { name: "cancel", text: "Cancel" },
                { name: "create", text: "Add" },
                { template: GridCommon.toggleBillableTemplate(self.GRID_ID) }
            ];
            row_commands = [{
                name: "destroy",
                template: '<a href="##" class="k-grid-delete"><img img src="/Content/images/icons/delete.png" /></a>'
            }]
        } else {
            $(self.GRID_ID).addClass('readonly');
        }
        $(self.GRID_ID).kendoGrid({
            toolbar: tools,
 
            save: self.updateTotal,
 
            columns: [
                { field: "ItemName", title: "Item Type", editor: self.itemDropDownEditor },
                { field: "Description" },
                { field: "Quantity", title: "QTY", width: 65, editor: GridCommon.numberEditor },
                { field: "Rate", title: "Price", format: "{0:c}", width: 90, editor: GridCommon.numberEditor },
                { field: "Total", editor: GridCommon.notEditable, format: "{0:c}", width: 95 },
                { field: "Billable", template: '#= GridCommon.getBillableText(Billable) #', width: 100},
                { command: row_commands, width: 40 }
            ],
 
            pageable: false,
            scrollable: true,
            editable: self.IS_EDITABLE,
            navigatable: true,
            sortable: true,
            batch: true,
 
            dataSource: self.material_source,
            saveChanges: GridCommon.saveAll
        });
    }
}

@model Guid
 
<div class="grid-wrapper">
    <div id="materials-data" class="grid-global-save">
        <!-- grid will appear here -->
    </div>
</div>
<script type="text/javascript">
    var mat_grid = new MaterialsGrid('@Model', 'materials-data', true, true);
    $(document).ready(mat_grid.init);
</script>
My material entry controller for the Create function looks like this:
[AcceptVerbs(HttpVerbs.Post)]
public JsonResult Create([DataSourceRequest] DataSourceRequest request, IEnumerable<TempVM> materials, string ticketId)
{
    ModelState.Remove("MaterialEntryId");
    ModelState.Remove("Id");
 
    return Json("");
}
public class TempVM
{
    public string MaterialEntryID { get; set; }
    public string TicketID { get; set; }
    public int ItemID { get; set; }
    public string Description { get; set; }
 
}

I know the logic inside create isn't right. But the problem is that the 'materials' parameter is empty when the Create method is called. You can see that the form data seems to be being sent correctly in chrome's Netowork tab, by looking at the attached file.

Any ideas what I am doing wrong?
Petur Subev
Telerik team
 answered on 17 Oct 2013
3 answers
456 views
Hello,
I'm trying to use an MVC-grid with a custom edit template. I think I got most of it working, but I have a strange problem. The validationmessages ends up in a weird position. The middle message ends up under the dropdown, even though the first one end up on top of another dropdown. Is there a possibility to control the z-level? I don't even set the ValidationMessageFor for the dropdowns, but I guess they are automatic since I have an OptionLabel on them. 

@Html.HiddenFor(model => model.Id)
 
<div class="editor-label">
    @Html.LabelFor(model => model.Name)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Name)
    @Html.ValidationMessageFor(model => model.Name)
</div>
 
<div class="editor-label">
    @Html.LabelFor(model => model.OwnerId)
</div>
<div class="editor-field">
     
  @(Html.Kendo().DropDownList()
          .Name("OwnerId")
          .HtmlAttributes(new { style = "width: 250px" })
           .DataTextField("NamePlusDepartment")
          .DataValueField("Id")
          .OptionLabel("Välj en person")
          .DataValueField("Id")         
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("GetPersonal", "List");
              });
          })                  
    )
 
     
</div>
<div class="editor-label">
    @Html.LabelFor(model => model.ResponsibleId)
</div>
<div class="editor-field">
     
  @(Html.Kendo().DropDownList()
          .Name("ResponsibleId")
          .HtmlAttributes(new { style = "width: 250px" })
           .DataTextField("NamePlusDepartment")
          .DataValueField("Id")
          .OptionLabel("Välj en person")
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("GetPersonal", "List");
              });
          })                   
    )
 
     
</div>
Kiril Nikolov
Telerik team
 answered on 17 Oct 2013
2 answers
1.4K+ views
Hello -

I had to change my Model to include two lists so i can bind it to two sets.

Now my model looks like:
public class PaymentsViewModel
{
    public List<CorporateViewModel> Corporations { get; set; }
    public List<PaymentViewModel> Payments { get; set; }
}
My controller looks like
public ActionResult Payments_Read([DataSourceRequest]DataSourceRequest request)
{
    //get corps
    //get payments
 
    PaymentsViewModel returnObj = new PaymentsViewModel();
    returnObj.Corporations = corps;
    returnObj.Payments = payments;
 
    DataSourceResult result = returnObj.ToDataSourceResult(request); <== returns error
 
    return Json(result);
}

Errors:
  • cannot convert from 'PaymentsViewModel' to 'System.Data.DataTable' 
  • 'PaymentsViewModel' does not contain a definition for 'ToDataSourceResult' and the best extension method overload 'Kendo.Mvc.Extensions.QueryableExtensions.ToDataSourceResult(System.Data.DataTable, Kendo.Mvc.UI.DataSourceRequest)' has some invalid arguments 
Any  ideas how to go about it? Should I change my ViewModel? Or have different approach?

Thanks.
Christos
Top achievements
Rank 1
 answered on 16 Oct 2013
1 answer
133 views
Hello, I'm new with MVC & Kendo and follow some demo videos (http://www.youtube.com/watch?v=1CPediqnIt8) and tried "do-it yourself".

The Controller:

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace KendoUIMvcApplication3.Controllers
{
    public class FoldersController : Controller
    {
        private FotosACSEntities db = new FotosACSEntities();

        //
        // GET: /Folders/

        public ActionResult Index()
        {
            var folders = db.Folders.Select(f => new
            {
                ID = f.ID,
                Nome = f.Nome
            });

            return Json(folders, "text/html", System.Text.Encoding.UTF8, JsonRequestBehavior.AllowGet); 
...

The View:

@model IEnumerable<KendoUIMvcApplication3.Folders>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<br />

@Html.Kendo().DropDownList().Name("cbFolders").DataSource(dataSource => dataSource.Read(read => read
            .Action("Index", "Folders"))).DataTextField("Nome").DataValueField("ID");

...

And the Result: (IE and Chrome)

[{"ID":1,"Nome":"\\CD 06_Fotos Pessoais"},{"ID":2,"Nome":"\\Fotos Pessoais\\Album 002\\JPG"},{"ID":3,"Nome":"\\Fotos Pessoais\\Album 003\\JPG"},{"ID":4,"Nome":"\\Fotos Pessoais\\Album 004\\JPG"},{"ID":5,"Nome":"\\Fotos Pessoais\\Album 007\\JPG"},{"ID":6,"Nome":"\\Fotos Pessoais\\Album 008\\JPG"},{"ID":7,"Nome":"\\Fotos Pessoais\\Album 009\\JPG"},{"ID":8,"Nome":"\\Fotos Pessoais\\Album 010\\JPG"},{"ID":9,"Nome":"\\Fotos Pessoais\\Album 011\\JPG"},{"ID":10,"Nome":"\\Fotos Pessoais\\Album 013\\JPG"},{"ID":11,"Nome":"\\Fotos Pessoais\\Album 014\\JPG"},{"ID":12,"Nome":"\\Fotos Pessoais\\Album 017\\JPG"},{"ID":13,"Nome":"\\Fotos PM\\Album 001"},{"ID":14,"Nome":"\\Fotos PM\\Album 002"},...

What's happening?

Regards,

Rui
Daniel
Telerik team
 answered on 16 Oct 2013
1 answer
95 views
This code is needed for binding to a normal Linq
return Json(model.ToDataSourceResult(request));
But because I need to bind to a XRM 2011 so have few limits I want to customize the query
How can I do it?
Rosen
Telerik team
 answered on 16 Oct 2013
1 answer
89 views
Hi,

I am new to kendo, I am using kendo menu component, the data for menu comes on a ajax call. I want to open menu at runtime on some user interaction other than clicking menu, I found open method in API, but what value should I pass as argument. If I need to pass Id of an element how can I get Id of elements that were created at run time with ajax call.

It's very urgent for me, please can any give solution?

Thanks,
Gopi.
 
Ignacio
Top achievements
Rank 1
 answered on 15 Oct 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?