Telerik Forums
UI for ASP.NET MVC Forum
2 answers
607 views
Hello,

I followed every step like the mvc  examples to try to bind a list view.

My setup is as follows:       

The Controller:
public ActionResult Scans_Read([DataSourceRequest] DataSourceRequest request)
{
    return Json(GetScans().ToDataSourceResult(request));
}
private static IEnumerable<ScanModel> GetScans()
        {
            var ec = new entityContext();
            return ec.tScan.Select(scanmodel => new ScanModel
            {
                scanId = scanmodel.scanId,
                description = scanmodel.description,
                directoryPath = scanmodel.directoryPath
            });
        }
 The Model:
public class ScanModel
    {
        [ScaffoldColumn(false)]
        public int scanId
        {
            get;
            set;
        }
 
        [Required]
        [DisplayName("description")]
        public string description
        {
            get;
            set;
        }
 
        [Required]
        [DisplayName("directoryPath")]
        public string directoryPath
        {
            get;
            set;
        }
    }
The view:
@model IEnumerable<ns.Models.ScanModel>
<script type="text/x-kendo-tmpl" id="template">
    <div class="scanmodel">
        <h3>#:description#</h3>
    </div>
</script>
@(Html.Kendo().ListView<ns.Models.ScanModel>(Model)
    .Name("listView")
    .TagName("div")
    .ClientTemplateId("template")
    .DataSource(dataSource => {
        dataSource.Read(read => read.Action("Scans_Read", "CustomerPortal"));
    })
)
This is practically the same as in the example.

But it doesn't display data. 

The resultset from "return Json(GetScans().ToDataSourceResult(request));" does contain the dataset.

What am I doing wrong here...!

Thanks,
Leroy
Top achievements
Rank 1
 answered on 28 May 2013
1 answer
479 views
Hi,

How to give space/set distance between toolbar buttons/custom buttons like in telerik's IsSeparator :

http://www.telerik.com/community/forums/aspnet-ajax/toolbar/add-a-space-between-two-toolbar-buttons.aspx

Thank you

Shabtai
Dimiter Madjarov
Telerik team
 answered on 28 May 2013
2 answers
321 views
Dear Wizards of the Realm,

New to MVC4 and to Kendo. So probably some misconceptions. Tried for a couple days. Need suggestions.

1. Started Visual Studio 2012 new project using Asp.net mvc 4 web app. Connected to existing database with edmx file. Put in a controller. All works great - retrieve, create, update, delete.
2. From Telerik menu, reconfigure to use KendoUI. Using 2012.2.710. (Separate note - if trying to upgrade to 2013.1.x.x - a breaking upgrade). Add an Admin and a Member area - routing seems to be working oK
3. Add Kendo Grid

            @(Html.Kendo().Grid(Model).Name("KeysGrid")
            .Columns(columns =>
            {
                columns.Bound(curkey => curkey.ID).Hidden();
                columns.Bound(curkey => curkey.CreateStamp).Visible(false);
                columns.Bound(curkey => curkey.OwnerAccountsID).Visible(false);
                columns.Bound(curkey => curkey.ReplacedBy).Hidden();
                columns.Bound(curkey => curkey.Name).Width("20%");
                columns.Bound(curkey => curkey.Description).Width("60%");
                columns.Command(cmd =>
                {
                    cmd.Edit().HtmlAttributes(new { title = "edit this key" }).;
                    cmd.Destroy().HtmlAttributes(new { title = "delete this key" });
                })
                    .Width("20%")
                    .Title("Commands")
                    .Width(75);
            })
            .ToolBar(toolBar => toolBar.Template(@"
                <div>
                    <a onclick='createRow()' title='Create a new key' style='float:left;'> <img src='/Content/images/button_add_01.png' style='width:32px; height:32px; text-decoration:none; border:none;' /></a>
                    <a onclick='callHelp()' title='Help on keys' style='float:right;'><img src='/Content/images/button_info_01.png' style='width:32px; height:32px; text-decoration:none; border:none;' /></a>
                </div>
            "))
            .Editable(editable => editable.Mode(GridEditMode.PopUp)
                .TemplateName("AddEditKey").Window(w => w.Title("Add / Edit Keys")))
            .Pageable(pages => pages.PageSizes(new int[] { 10, 20, 50 }))
            .Resizable(p => p.Columns(true))
            .Sortable()
            .Selectable()
            .Filterable()
            .Scrollable(p => p.Enabled(false))
            .Groupable(p => p.Enabled(false))
            .DataSource(datasource => datasource
                .Ajax()
                .Events(e => e.Error("error_handler")
                )
                .Create(c => c.Action("Create", "YFKey", new { area="Member", controller="YFKey", action="Create" }))
                .Update(c => c.Action("Edit", "YFKey", new { area="Member", controller="YFKey", action="Edit" }))
                .Destroy(c => c.Action("Delete", "YFKey", new { area="Member", controller="YFKey", action="Delete" }))
                )
            )
4. Now when go to index page, grid shows data from underlying database. I edit grid, popup comes up with proper fields, edit data, save - popup goes away and changed fields marked with little red triangle - changes to underlying DB not made.
5. In Chrome, hit F12, look at network, it's getting a 500 Internal Server Error. All data from edit form looks proper - just not happening. Any ideas?

Autogenerated controller from database methods include:
        [Authorize]
        public ActionResult Edit(long id = 0)
        {
            YFKey yfkey = db.YFKeys.Find(id);
            if (yfkey == null)
            {
                return HttpNotFound();
            }
            return View(yfkey);
        }

        //
        // POST: /Member/YFKey/Edit/5

        [HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult Edit(YFKey yfkey)
        {
            if (ModelState.IsValid)
            {
                db.Entry(yfkey).State = EntityState.Modified;
                db.SaveChanges();
                return RedirectToAction("Index");
            }
            return View(yfkey);
        }

Note that at the same time, the auto created forms from the database first edmx file still work, and even on the same form.

Maybe obvious to me someday, but not today.
Thanks.
Chris
Chris
Top achievements
Rank 1
 answered on 27 May 2013
2 answers
302 views
Hi,

how do i add a custom column to a child grid containing a Action Link with the ID of the current child row entity?

here is a example of the hierarchical grid:
@(Html.Kendo().Grid<MyParentGridModel>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.Id).Groupable(false).Width(50);
        columns.Bound(p => p.Name);
        columns.Bound(p => p.ShortDescription);
        columns.Bound(p => p.LinkText);
    })
    .Sortable()
    .Pageable()
    .Scrollable(scr=>scr.Height(500))
    .ClientDetailTemplateId("template")
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("ParentModel_Read", "ControllerName"))
    )   
)
 
<script id="template" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<ChildGridModel>()
        .Name("Grid_#=Id#")
        .Columns(columns =>
        {
            columns.Bound(o => o.PageNumber).Width(50);
            columns.Bound(o => o.ChapterTitle).Width(150);
            columns.Bound(o => o.BodyContent);
            columns.Template(@<text>
                            @Html.ActionLink("edit", "ControllerAction", "ControllerName", new { id = @item.Id }, new {@class = "k-button" })
                            </text>)
            .ClientTemplate(@Html.ActionLink("edit", "ControllerAction", "ControllerName", new { ID = "#=Id#" }, new { @class = "k-button" }).ToHtmlString());
 
             
        })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(10)
            .Read(read => read.Action("ChildModel_Read", "ControllerName", new { parentModelId = "#=Id#" }))
        )
        .Pageable()
        .Sortable()
        .ToClientTemplate()
    )
</script>
The Question is: How can the Id of the ChildModelEntity be resolved and passed into the ActionLinkMethod?  "#=Id#" returns the Id of the parent model.

Thanks in advance for answers!
Mehmet
Top achievements
Rank 1
 answered on 27 May 2013
3 answers
328 views
Morning folks!

What I'm trying to do is...when I change the item of the dropdownlist, I'll need to REload the TreeView with the selectedValue of the dropDownList.

In my case, as I'm a new kendoui user, I'm not going on the right track, for sure.

Any ideas?

Here's my JS dumb script...hope you can help me!

<script type="text/javascript">
 
    function onChange(e) {
        $.ajax({
            url: "/Nav/MontaMenu/",
            dataType: "json",
            cache: false,
            type: 'GET',
            data: { nomePastaSelecionada: this.text(), caminhoPastaSelecionada: this.value() },
            success: function (result) {
 
                $('#treeview').kendoTreeView();
 
                var tvProjeto = $('#treeview').getKendoTreeView();
 
                tvProjeto.destroy();
                 
                var dataSource = new kendo.data.DataSource({
                    data: result
                });
                 
                dataSource.fetch(function () {
                    tvProjeto.setDataSource({
                        data: dataSource
                    });                   
                });
            }
        });
    }
</script>

Dimiter Madjarov
Telerik team
 answered on 27 May 2013
1 answer
256 views
 I am using the ASP.NET MVC server side wrappers to create a page with a splitter control with 3 horizontal panes.  Each pane includes a single <div> with header text, and a Kendo Grid.

How do I get the grid to resize appropriately within each pane?
I have tried the following, but the splitterPane.scrollHeight value does not seem correct when the pane gets smaller.  For example, when the page starts all panes report a scrollHeight of 278, but if I move the top splitter up, the scrollheight of the top pane goes to up to 280 instead of being reduced..
I have tried to find another property/method other than scrollHeight and have been unsuccessful..
Any help is greatly appreciated!!!
function LayoutChange() {
    UpdateGridSize("#PendingVessels", 0);
    UpdateGridSize("#DueToSellVessels", 1);
    UpdateGridSize("#DueToShiftVessele", 2);
}
 
function UpdateGridSize(gridName, indexPane) {
    var splitter = $("#Main");
    var splitterPane = splitter.find(".k-pane")[indexPane];
    var splitterHeight = splitterPane.scrollHeight;
 
    var gridElement = $(gridName),
        dataArea = gridElement.find(".k-grid-content"),
        //gridHeight = gridElement.innerHeight(),
        otherElements = gridElement.children().not(".k-grid-content"),
        otherElementsHeight = 0;
    otherElements.each(function () {
        otherElementsHeight += $(this).outerHeight();
    });
 
    gridElement.height(splitterHeight - 25);  //-25 for the header item
    dataArea.height(gridElement.innerHeight() - otherElementsHeight);
}
Dimo
Telerik team
 answered on 27 May 2013
1 answer
197 views
When Adding a model to my grid via a controller action, it is possible that there may be more than one model created as a result of the process.

Normally, when only one item is added, we are sending the created or updated Model back to the View by calling:            
return this.Json((new Model[] { singleModelRecord }).ToDataSourceResult(request, this.ModelState));
Where "singleModelRecord" is a single model.

However, in this case, I would like to be able to send a List of Models back to the client, and have all the rows added to the grid, instead of having just one of them added, and needing to refresh the grid to see the rest.  This is what I was trying, but only one new model was being shown in the grid:

return this.Json(arrayOfModels.ToDataSourceResult(request, this.ModelState));
where "arrayOfModels" is the array of Models that have just been created.

Is this functionality supported?
Vladimir Iliev
Telerik team
 answered on 24 May 2013
1 answer
286 views
Hello Telerik Team,
I am a licensed user for Telerik ASP.NET MVC, we are planning to upgrade to Kendo UI. Please let me know where can i download for Kendo UI ASP.NET MVC controls.

Thanks,
Sundar.
Dyanko
Telerik team
 answered on 24 May 2013
2 answers
86 views
Good morning!

I'm having some issues creating a simple treeview in my project. Maybe some reference problem, I don't know. I'm attaching a print from my screen.

Regards,
Davi Rodrigues
Davi Rodrigues
Top achievements
Rank 1
 answered on 24 May 2013
6 answers
265 views
Hi,

I'm using the latest Kendo (v2013.1.319), and I have hit a snag.  In Firefox ONLY, I cannot open the file browse window (accessed through the "Select..." button).

I am experiencing the same issue on the demos.
My version of Firefox is latest at v22.0.

I had another person test the demo on their machine in Firefox.  It worked at first when they were using v21.0, but when they updated to the latest Firefox version, the Select button stopped opening the file browse window.

Hopefully, this is an easy workaround/fix, but I did find that when tinkering around in Firebug, if I remove the k-upload-button class from the div element surrounding the input element, then it would revert to a Browse button and became clickable.

Here's my code, but it's virtually identical to that in the demo.  Please let me know if I can provide any more useful info.

@(Html.Kendo().Upload()
    .Name("ImageUpload")
    .Multiple(false)
    .Async(a => a
        .Save("UploadImage", "Home")
        .AutoUpload(false)
    )
    .Events(e =>
    {
        e.Error("UploadError");
        e.Success("GetImagePreviews");
    })
)
best,
-mark
Atanas Korchev
Telerik team
 answered on 24 May 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?