Telerik Forums
UI for ASP.NET Core Forum
1 answer
197 views

Is there a way of binding a Toolbar to data in the same way as the Treeview can be bound to data?

I have tried creating my toolbar list dynamically as follows.

List<ToolBarItem> toolbaritems = new List<ToolBarItem>();
ToolBarItem item = new ToolBarItem
{
    Text = "Button",
    Type = CommandType.Button
};
toolbaritems.Add(item);
ToolBarItemFactory factory = new ToolBarItemFactory(toolbaritems);
ViewData["DocumentToolbar"] = factory;

I have then tried to bind the data to the control as follows.

@(Html.Kendo().ToolBar()
    .Name("ToolBar")
    .Items((Action<ToolBarItemFactory>) ViewData["DocumentToolbar"]))

I am getting the following error.

InvalidCastException: Unable to cast object of type 'Kendo.Mvc.UI.Fluent.ToolBarItemFactory' to type 'System.Action`1[Kendo.Mvc.UI.Fluent.ToolBarItemFactory]'.

Is this possible? And if so, how?

Ianko
Telerik team
 answered on 15 May 2018
1 answer
245 views

I have a requirement to edit an object that has a list of texts associated with the object. The texts can not be edited again. I have found how to post a grid at this link https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/post-grid-with-form but the example uses incell editing.

So I decided to just change the incell to popup and extected it to work. At my surprise they were not. It seems popup requires the server editing. Is this true or are there posibilities to have the popup editing also on the client?

Tsvetina
Telerik team
 answered on 14 May 2018
1 answer
173 views

I want to use the telerik DropDownList to display a list of objects. I saw that the DropDownList support also an optional label but it seems it does not work.

Here is the code

@model IEnumerable<ActionViewModel>
 
@(Html.Kendo().DropDownList()
          .Name("actionDropDownList")
          .DataTextField("Display")
          .DataValueField("Id")
          .BindTo(Model)
          .OptionLabel(Localizer.GetString("Select an action..."))
          .Deferred()
 )

The generated script contains ""optionLabel":{"Name":"Select an action...","Value":"Select an action...","ResourceNotFound":true,"SearchedLocation":null}"

What do I have to give to the OptionalLabel so that it generates the optionalLabel with the properties of DataValueField and DataTextField?

 

 

Dan
Top achievements
Rank 1
Iron
Iron
Veteran
 answered on 14 May 2018
7 answers
1.1K+ views

Hi,

I have a strange issue using the HtmlHelper generating a Checkbox using @Html.Kendo().CheckBoxFor(m => m.enabled) and submitting the form to my controller.
The issue happens after submitting the form when some server validation errors occur.
The form is properly rendered again, but when i re-submit the form, i get an error when the model is deserialized. (The value 'on, false' is not valid for Enabled).
Looking at the serialized form data i can see enabled actually have the value "on,false" instead of just "false".
Any ideas ?
Thanks in advance.

Joana
Telerik team
 answered on 14 May 2018
1 answer
159 views

Hi all,

 

So I've seen a couple of questions about this, but none of the solutions have helped. 

I'm attempting to build something like this demo for Asp.Net Core 2.0:  https://demos.telerik.com/aspnet-core/grid/checkbox-selection

 

When I set up the app, I don't get the checkboxes in the grid.  I've tried multiple browsers.

 

I'm using version 2017.3.1206.  I built a test project to try to get this to work, building off the code in the above demo.

 

Here is my view:

@(Html.Kendo().Grid<TestKendo.Controllers.ProductViewModel>()
                .Name("grid")
                .Columns(columns =>
                {
                    columns.Select().Width(50);
                    columns.Bound(p => p.ProductName);
                    columns.Bound(p => p.UnitPrice).Width(100);
                    columns.Bound(p => p.UnitsInStock).Width(100);
                    columns.Bound(p => p.Discontinued).Width(100);
                })
                .Pageable()
                .PersistSelection()
                .Sortable()
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Model(model => model.Id(p => p.ProductID))
                    .Read(read => read.Action("Selection_Read", "Home"))
                )
)
 
@section scripts {
    @Html.Kendo().DeferredScripts()
}

 

 

Here is my controller:

 

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Kendo.Mvc.Extensions;
using Kendo.Mvc.UI;
using Microsoft.AspNetCore.Mvc;
using TestKendo.Models;
 
namespace TestKendo.Controllers
{
    public class ProductViewModel
    {
        public int ProductID { get; set; }
        public string ProductName { get; set; }
        public decimal UnitPrice { get; set; }
        public int UnitsInStock { get; set; }
        public bool Discontinued { get; set; }
    }
 
    public class HomeController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }
 
        public ActionResult Selection_Read([DataSourceRequest] DataSourceRequest request)
        {
            var products = new List<ProductViewModel>
            {
                new ProductViewModel { ProductID = 1, ProductName = "Prod1", UnitPrice = 1.25M, UnitsInStock = 10 },
                new ProductViewModel { ProductID = 2, ProductName = "Prod2", UnitPrice = 2.50M, UnitsInStock = 20 },
            };
            return Json(products.ToDataSourceResult(request));
        }
         
 
        public IActionResult About()
        {
            ViewData["Message"] = "Your application description page.";
 
            return View();
        }
 
        public IActionResult Contact()
        {
            ViewData["Message"] = "Your contact page.";
 
            return View();
        }
 
        public IActionResult Error()
        {
            return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
        }
    }
}

 

Here's my _Layout.cshtml:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - TestKendo</title>
 
    <environment include="Development">
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <link rel="stylesheet" href="~/css/site.css" />
        <link rel="stylesheet" href="~/lib/kendo/css/web/kendo.common-nova.min.css" />
        <link rel="stylesheet" href="~/lib/kendo/css/web/kendo.nova.min.css" />
        <script src="~/lib/jquery/dist/jquery.js"></script>
        <script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
        <script src="~/js/site.js" asp-append-version="true"></script>
        <script src="~/lib/kendo/js/kendo.all.min.js"></script>
        <script src="~/lib/kendo/js/kendo.aspnetmvc.min.js"></script>
    </environment>
    <environment exclude="Development">
        <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
              asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
              asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
        <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha384-K+ctZQ+LL8q6tP7I94W+qzQsfRV2a+AfHIi9k8z8l9ggpc8X+Ytst4yBo/hH+8Fk">
        </script>
                asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
                asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
                crossorigin="anonymous"
                integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">
        </script>
        <script src="~/js/site.min.js" asp-append-version="true"></script>
    </environment>
</head>
<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a asp-area="" asp-controller="Home" asp-action="Index" class="navbar-brand">TestKendo</a>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a asp-area="" asp-controller="Home" asp-action="Index">Home</a></li>
                    <li><a asp-area="" asp-controller="Home" asp-action="About">About</a></li>
                    <li><a asp-area="" asp-controller="Home" asp-action="Contact">Contact</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container body-content">
        @RenderBody()
        <hr />
        <footer>
            <p>© 2018 - TestKendo</p>
        </footer>
    </div>
 
    @RenderSection("Scripts", required: false)
</body>
</html>

 

The grid renders fine, but the selection columns are empty.  Any help is appreciated - thanks!

Phil
Top achievements
Rank 1
 answered on 11 May 2018
1 answer
600 views
I want to persist grid state whenever a column width, order, or visibility state is changed such that when a user visits the same page in the future the columns are in the same state.  I don't want to require an extra button click after the user makes a change to column state.
Viktor Tachev
Telerik team
 answered on 11 May 2018
4 answers
1.0K+ views

I am familiar with having a client template for a Boolean column to display "Yes" or "No" for true or false.  I have many templates that use the syntax below with no problems yet this grid on one template will show no data at all if I display that column.  If I comment it out the data shows fine.

 

columns.Bound(a => a.Mosfet.isESD).ClientTemplate("#= isESD ? 'Yes' : 'No' #").Width(80).Title("ESD").Width(100);

 

I can observe the 5 records that are returned in the grid's Read method in the debugger and see that the non null able column has valid values

 

Any suggestions?

Reid
Top achievements
Rank 2
 answered on 11 May 2018
1 answer
379 views

I created a grid with a dropdown.  The drop down has an Id and a Name.  The name is what the user should see and the Id is what the system will use.

 

When using inline editing, the drop down appears ok, but when selecting the item, the data doesn't go back to the service and when in display mode nothing is shown.

 

It wont let me attach an example:

 

here is the code

  public class ReferenceData
    {
        /// <summary>
        /// Gets or sets the identifier of the model.
        /// </summary>
        /// <value>
        /// The identifier of the model.
        /// </value>
        public int Id { get; set; }

        /// <summary>
        /// Gets or sets the name.
        /// </summary>
        /// <value>
        /// The name.
        /// </value>
        public string Name { get; set; }
    }

public class GridRowViewModel
    {
        /// <summary>
        /// Gets or sets the identifier of the model.
        /// </summary>
        /// <value>
        /// The identifier of the model.
        /// </value>
        public int Id { get; set; }

        /// <summary>
        /// Gets or sets when the career gap started.
        /// </summary>
        /// <value>
        /// the start of the career gap
        /// </value>
        public DateTime From { get; set; }

        /// <summary>
        /// Gets or sets a value indicating whether [qualifying service].
        /// </summary>
        /// <value>
        ///   <c>true</c> if [qualifying service]; otherwise, <c>false</c>.
        /// </value>
        public bool Flag { get; set; }

        /// <summary>
        /// Gets or sets the reason.
        /// </summary>
        /// <value>
        /// The reason.
        /// </value>
        public ReferenceData ReferenceData { get; set; }

        /// <summary>
        /// Gets or sets the reason identifier.
        /// </summary>
        /// <value>
        /// The reason identifier.
        /// </value>
        public int ReferenceDataId { get; set; }

        /// <summary>
        /// Gets or sets when the career gap ended
        /// </summary>
        /// <value>
        /// The end of the career gap
        /// </value>
        public DateTime To { get; set; }
    }

public class IndexViewModel
    {
        public IList<ReferenceData> ReferenceDataList { get; set; }
    }



















----------------------------

HOMECONTROLLER.CS
public class HomeController : Controller
    {
        public IActionResult Index()
        {
            IndexViewModel viewModel = new IndexViewModel();
            viewModel.ReferenceDataList = new List<ReferenceData>();
            viewModel.ReferenceDataList.Add(new ReferenceData() {Id = 1, Name = "Item 1" });
            viewModel.ReferenceDataList.Add(new ReferenceData() { Id = 1, Name = "Item 1" });
            return View(viewModel);
        }

        [HttpPost]
        public ActionResult Editing_Create([DataSourceRequest] DataSourceRequest request, GridRowViewModel careerGap)
        {
            var results = new List<GridRowViewModel>();

            if (careerGap != null && this.ModelState.IsValid)
            {
                    results.Add(careerGap);
                
            }

            return this.Json(results.ToDataSourceResult(request, this.ModelState));
        }

      
    }
---------------------------------------
INDEX.CSHTML

@(Html.Kendo().Grid<GridRowViewModel>().Name("testGrid").Columns(columns =>
      {
          columns.Bound(model => model.From);
          columns.Bound(model => model.To);
          columns.Bound(model => model.Flag);
          columns.ForeignKey(model => model.ReferenceDataId, Model.ReferenceDataList, "Id", "Name").EditorTemplateName("_GridDropDown");//.ClientTemplate("#=Reason.Name#");
          columns.Command(command => { command.Edit(); command.Destroy(); }).Width(172);

      })
      .ToolBar(toolbar => toolbar.Create())
      .Editable(editable => editable.Mode(GridEditMode.InLine))
      .DataSource(dataSource => dataSource
                                    .Ajax()
                                    .PageSize(20)
                                    .ServerOperation(false)
                                    .Model(model => model.Id(p => p.Id))
                                    .Create(update => update.Action("Editing_Create", "Home"))
      ))

------------------------------------
_GRIDDROPDOWN.CSHTML
@using Kendo.Mvc.UI
@model object

@(Html.Kendo().DropDownList()
      .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(""))
      .BindTo((SelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])
      .HtmlAttributes(new { style = "width: 100%" })
      )

 

Cheers,

Thomas

Georgi
Telerik team
 answered on 10 May 2018
1 answer
305 views

Is there an example of Kendo UI async Upload on Razor pages (No controller) ? I tried below but I get 404 error .

 

<div class=""> @(Html.Kendo().Upload() .Name("files") .Async(a => a .Save("Save", "UploadManagement/Index") .Remove("Remove", "UploadManagement/Index") .AutoUpload(true) ) ) </div>

 

[HttpPost]public ActionResult Save(IEnumerable<IFormFile> files){}

Neli
Telerik team
 answered on 10 May 2018
2 answers
293 views

Hello,

How can i call the Get method of my controller ? When i load my page, it's only calling the Post Method. I followed the web api events exemple. Thank you.

 

[Produces("application/json")]
[Route("api/[controller]")]
public class AstreintesController : Controller
{
    private readonly PlanningContext _context;
    private readonly IAgentService _agentService;
 
    public AstreintesController(PlanningContext context, IAgentService agentService)
        {
            _context = context;
            _agentService = agentService;
        }
 
    //GET api/Astreintes
    [HttpGet]
    public DataSourceResult Get([DataSourceRequest]DataSourceRequest request)
    {
        return _context.Astreintes.ToDataSourceResult(request);
    }
 
    [HttpPost]
    public DataSourceResult Post([DataSourceRequest]DataSourceRequest request)
    {
        if (!ModelState.IsValid)
        {
           //todo: handle error
        }
 
        return _context.Astreintes.ToDataSourceResult(request);
    }

 

@(Html.Kendo().Scheduler<NC.Enercal.PlanningPE.Web.Areas.Planification.ViewModels.TaskViewModel>()
    .Name("scheduler")
    .Date(new DateTime(2013, 6, 13))
    .StartTime(new DateTime(2013, 6, 13, 7, 00, 00))
    .Selectable(true)
        .Editable(editable =>
        {
            editable.Resize(false);
        })
    .Height(650)
    .Views(views =>
    {
        views.MonthView(month => month.Selected(true));
 
    })
    .Timezone("Etc/UTC")
    .Resources(resource =>
    {
 
    })
    .DataSource(d => d
        .Events(e => e.Error("onError"))
        .Model(m =>
        {
            m.Id(f => f.Id);
            m.Field(f => f.Title).DefaultValue("No title");
            m.Field(f => f.AgentId).DefaultValue(1);
        })
    .Read("Get", "Astreintes")
    .Create("Create", "Astreintes")
)
Julien
Top achievements
Rank 1
 answered on 09 May 2018
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?