Questions on Kendo UI for jQuery Forum

1 answer

126 views

IE 11: pasting large image results in browser freeze

Pasting a large (>500kb) image into the editor in IE 11 renders the browser frozen for a significant time.

To reproduce:

1. Go here: http://demos.telerik.com/kendo-ui/editor/index

2. Open any image greater than 500kb in MS Paint. A larger image will make the problem worse.

3. Select all and copy the image.

4. Paste into the demo editor.

On my i7 machine, this takes around 24 seconds to unfreeze, and then the image is pasted normally. No other browsers exhibit this behavior.

After digging through the Editor source code, and placing timers in several locations within the "paste" function, I found that there is quite a bit of DOM manipulation going on, without the clipboard content being validated in any way.

My question is this: what is the best way to stop the execution of the paste function based on the size of the clipboard data? Is there something already within the Editor API that I'm missing? PasteCleanup doesn't fire until after the paste event, so a custom function there doesn't help. What I really need is something like a maxPasteSize option in the Editor instantiation, that will reject anything over that without manipulating the DOM.

Editor

answered on 04 Oct 2017

4 answers

889 views

How to use paging and filtering in angular 2

Hi everyone,

I am beginner and I am trying to generate a grid and I would like that my grid would have the options of sorting, paging and filtering, so I have been trying to achieve it without a good result unfortunately.

1- At the moment I can sorting but I can't pass to the next page in the grid.

2 - I got two button in the grid to call functions and I don't know how to show them and extract a specific id from the array data

3 - I would appreciate as well if someone can send me any tutorial or samples about filtering mixed with the rest of the options.

The telerik code is in the next route:
SolucionCore2\Core2.WebApi\ClientApp\app\components\arboles\registro

Here is my project: Download

Thanks in advance and Kind Regards

General Discussions

answered on 04 Oct 2017

3 answers

1.7K+ views

Hide Label when all values are zero or null

Hi,

I was wondering if there is a way of hiding a label if all the values in that series are either zero or null? For example I've got a test block of code below:

@(Html.Kendo().Chart(Model)

.Name("ChartTest")

.Legend(l => l.Visible(true))

.Series(series =>

{

series.Column(x => x.WebSite01);

series.Column(x => x.WebSite02);

series.Column(x => x.WebSite03);

series.Column(x => x.WebSite04);

series.Column(x => x.WebSite05);

series.Column(x => x.WebSite06);

series.Column(x => x.WebSite07);

series.Column(x => x.WebSite08);

series.Column(x => x.WebSite09);

}

)

.SeriesDefaults(s => s.Column().Stack(true))

.Legend(l => l.Position(ChartLegendPosition.Bottom))

.CategoryAxis(axis => axis

.Categories(model => model.ChartDateStamp)

.MajorGridLines(lines => lines.Visible(false))

.Labels(l =>

{

l.Format("MM/yy");

l.Rotation(90);

})

)

.Tooltip(t => t

.Visible(true)

.Color("#FFFFFF")

.Background("#0000CC")

.Template("${series.name} : #= kendo.toString(value, 'n') #")

)

This is all fine and works as I'd expect however in my test data WebSite02 is all NULL and WebSite06 is all 0.00 value so there is no point in showing this information on a label, see the diagram attached. What I would like to do is hide the label for Website02 and Website06 as they will clutter the chart and in my real world example I could have 70+ items in there!

I've tried doing this from Javascript but run into issues getting a tool tip working as well as putting custom labels in under the chart so due to time constraints am settling with this way for this version.

If it helps, I've also included a screen grab of the raw data.

Thanks in advance
Mike

Charts

answered on 04 Oct 2017

1 answer

99 views

viewModel.attr vs. viewModel.get('attr')

Hi,

When retrieving data from a model whats the difference between using "viewModel.attr" and "viewModel.get('attr')" ?

Both return the same object.

Thanks,
Grant

MVVM

answered on 04 Oct 2017

4 answers

2.0K+ views

Want to add dropdownlist in my grid

Hi,
I want to add dropdownlist list of Role field to my grid cell.
Currently I am using ASP.NET MVC3 RAZOR engine.

I have a template. When it is executed, RoleName field is displayed as label in grid cell which should be displayed as drop down list.

_RoleDropDown.cshtml
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

@(Html.Kendo().DropDownList()
.Name("RoleName")
.DataTextField("Text")
.DataValueField("Value")
.BindTo(new List<SelectListItem>
{
new SelectListItem {Text = "Admin", Value = "Admin"},
new SelectListItem {Text = "User", Value = "User"}
}))
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

My current view is as follows.

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

@model List<TssPlog.Models.User>

@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/AdminLayout.cshtml";
}

<div>
<fieldset>
<legend>Logs</legend>
<p></p>
@{

Html.Kendo().Grid(Model)
.Name("UserGrid")
.Columns(
columns =>
{
columns.Bound(p => p.FirstName);
columns.Bound(p => p.LastName);
columns.Bound(p => p.Ntid);
columns.Bound(p => p.RoleName).EditorTemplateName("_RoleDropDown");
columns.Bound(p => p.Phone);
columns.Bound(p => p.EmailAddress);

}
)

.Pageable(ps => ps.Refresh(true)
.PreviousNext(true).PageSizes(true))
.Sortable()
.Editable(m=>m.Mode(GridEditMode.InCell))
.ToolBar(toolbar=>toolbar.Save().SaveText("Save").CancelText("Cancel"))
.Selectable(s => s.Enabled(true)
.Type(GridSelectionType.Row)
.Mode(GridSelectionMode.Single))
.Filterable()

.DataSource
(dataSource => dataSource
.Ajax()
.Batch(true)
.Read(read => read.Action("UsersRead", "AdminUserAdministration"))
.Update(update => update.Action("UsersUpdate", "AdminUserAdministration"))
.PageSize(5)
.ServerOperation(false)
.Model(model => { model.Id(p => p.UserId); model.Field(p => p.UserId).Editable(false); }
)
).Render();


}

</fieldset>
</div>
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

and my controller is as follows.

----------------------------------------------------------------------------------------------------------------------------------------------------------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Kendo.Mvc.Extensions;
using Kendo.Mvc.UI;
using TssPlog.Models;

namespace TssPlog.Controllers
{
public class AdminUserAdministrationController : Controller
{
//
// GET: /AdminUserAdministration/
public ActionResult Index()
{
var userManager = new UserManager(Request.ServerVariables["LOGON_USER"]);
PopulateRoleNames();
return View(userManager.GetAllUser());
}

public ActionResult UsersRead([DataSourceRequest] DataSourceRequest request)
{
var userManager = new UserManager(Request.ServerVariables["LOGON_USER"]);
return Json(userManager.GetAllUser().ToDataSourceResult(request));
}

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult UsersUpdate([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")]IEnumerable<User> users)
{
if (users != null && ModelState.IsValid)
{
foreach (var user in users)
{
var userManager = new UserManager();
userManager.UpdateUser(user);
}
}

return Json(ModelState.ToDataSourceResult());
}

}
}

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

Best regards
Parvez Nawaz

Grid

answered on 04 Oct 2017

2 answers

317 views

Combobox with custom transport read en serverpaging

I'm trying to create a Comboxbox with server side paging and a custom transport read, i can't get it to work so i made a small ex-sample.

If you run the example it isn't possible to scroll "below" the already loaded items, so there isn't another read to get the next 10 items

https://dojo.telerik.com/eHaJU/5

$("#orders").kendoComboBox({

dataTextField: "text",

dataValueField: "value",

dataSource: {

serverPaging: true,

schema: {

data: "data",

total: "total"

},

pageSize: 10,

transport: {

read: function(options) {

var data = getData(options.data.page);

options.success(data);

}

},

update: function() {}

}

});

function getData(page)

{

var dataArr = [];

for (var i = 0; i < 10; i++)

dataArr.push({ text: "Item " + (i + 1) + " on page " + page, value: 1});

return {data: dataArr, total: 100};

}

How can I make this work? Thanks in advance.

ComboBox

answered on 04 Oct 2017

5 answers

248 views

Sortable: A-Z items

how to print alphabetically items in multiselect?

MultiSelect

answered on 04 Oct 2017

1 answer

113 views

Formula value change doesn't reflect in bound datasource.

Hi folks,

I have a datasource bound spreasheet. When I enter a value in a cell, the change is reflected in the datasource. That's good.

A1

Now, I enter a formula, =SUM(A1:B1), in cell C1, on the first time I input the formula in C1, the bound datasource gets the sum value correctly. Then I change value in cell A1 from 100

Spreadsheet

answered on 03 Oct 2017

1 answer

178 views

Formatting is lost after I update value

Hi!

I am using kendo spreadsheet to batch-edit a list of values.

In the last version available, if I change a value, I lose the format (I append a currency to the number; currency that can be different in each cell). That's removed after I update the value

Here's a demo:

http://dojo.telerik.com/AyOXo/13

Try to change the value of the amount in the cell to something else.The currency (SEK/USD will dissapear from the format)

Thanks!

Spreadsheet