Questions on UI for ASP.NET MVC Forum

1 answer

118 views

Change event is not fired when moving mouse pointer while clicking listitem in ListViewSelectionMode.Single

Hello,

I use the ListView with the selectable option set to ListViewSelectionMode.Single via MVC Wrapper.
Clicking on an item and therefore changing selection doesn't fire the change event if I move the mouse (within list item borders) while clicking.

I think this behaviour can be reproduced by setting selectable option to ListViewSelectionMode.Single at this demo.
Just click the text and move mouse pointer to hilight the text. The change event si not fired.

The event is always fired as soon as you set selection mode to ListViewSelectionMode.Multiple.

Is this a bug?
Is there a workaround (can't use multiple select)?

Thanks in advance
Dirk

ListView

answered on 06 Dec 2013

1 answer

119 views

Adding "required" to the model

Hi there,

Trying to make use of the wrappers to speed things up, but I cant find a way to add "required" to a field, since the modelbinding doesn't care about the [Required] attribute on the property.

public class TaskItem : ISchedulerEvent

{

[DatabaseGenerated(DatabaseGeneratedOption.Identity)]

public int TaskItemID { get; set; }

[Required]

public string Title { get; set; }

public string Description { get; set; }

[Required]

public DateTime Start { get; set; }

public string StartTimezone { get; set; }

[Required]

public DateTime End { get; set; }

public string EndTimezone { get; set; }

public string RecurrenceRule { get; set; }

public int? RecurrenceID { get; set; }

public string RecurrenceException { get; set; }

public bool IsAllDay { get; set; }

public int? OwnerID { get; set; }

}

In javascript this seems easy:

schema: {

model: {

id: "taskID",

fields: {

taskID: { from: "TaskID", type: "number" },

title: { from: "Title", validation: { required: true } }

}

Also, I read that servervalidation were supposed to be implemented in q3-release, but I can't get it to work.

Regards,
Pär Sandgren

Scheduler

answered on 06 Dec 2013

3 answers

87 views

Color picker doesn't work with legacy telerik themes

We are migrating our application from Telerik MVC extension to Kendo UI. But with Telerik legacy themes Color picker is not working. With Kendo themes this is working fine.

ColorPicker

answered on 06 Dec 2013

1 answer

115 views

Row removed from grid before server call

Hi,

I have a simple grid with only the Read and Destroy actions defined for the datasource. I also have an error event handler defined. While playing around with this setup, I noticed, that the row is removed as soon as I click the destroy button, even before the controller is called. If an error occures in the controller, my error handler does, what it should, but the grid is not refreshed. Do I have to do that by myself (If so, how do i do this in the error handler?) or did I make a mistake?

My View:

@(Html.Kendo().Grid<StorageClasses>()

.Name("StorageClassesGrid")

.ToolBar(toolbar => toolbar.Template("<button id='btnAddSC' class='k-button'><span class='k-icon k-add'></button>"))

.Columns(columns =>

{

columns.Command(command =>

{

command.Destroy().Text(" ").HtmlAttributes(new { style = "width:14px;min-width:27px" });

}).Width("40px;");

columns.Bound(p => p.Name);

columns.Bound(p => p.Remark);

})

.Pageable(pager => pager.Refresh(true))

.Sortable()

.Scrollable(s => s.Height("auto"))

.Filterable()

.Resizable(r => r.Columns(true))

.DataSource(dataSource => dataSource

.Ajax()

.ServerOperation(false)

.Model(model => model.Id(m => m.ID))

.Read(read => read.Action("GetStorageClassesByLocation", "Locations", new { LocationID = Model.ID }))

.Destroy(destroy => destroy.Action("StorageClass_Delete", "Locations", new { LocationID = Model.ID }))

.Events(e => e.Error("onGridError"))

)

.Events(e => e.Remove("onGridRowRemove").DataBound("resizeTabs"))

)

Controller:

[HttpPost]

public ActionResult StorageClass_Delete([DataSourceRequest] DataSourceRequest request, long? LocationID, StorageClasses StorageClass)

{

Exception exception;

if (StorageClass != null && LocationID != null)

{

try

{

if (ModelState.IsValid)

{

// delete entity in database

var result = _db.StorageClass_Delete(

LocationID.HasValue ? LocationID.Value : 0,

StorageClass.ID,

ClientName,

"WEB",

UserName,

out exception);

if (exception != null)

{

AddException(exception);

}

// check database action result

if (result != null && result.ErrorID == 0)

{

// database action successful

return Json(new[] { StorageClass }.ToDataSourceResult(request, ModelState));

}

else

{

ModelState.AddModelError("StorageClass_Delete", result.ErrorMessage);

return Json(new[] { StorageClass }.ToDataSourceResult(request, ModelState));

}

catch (Exception ex)

{

AddException(ex);

ModelState.AddModelError("StorageClass_Delete", ex.Message);

return Json(new[] { StorageClass }.ToDataSourceResult(request, ModelState));

}

ModelState.AddModelError("StorageClass_Delete", "Parameter Fehler.");

return Json(new[] { StorageClass }.ToDataSourceResult(request, ModelState));

}

Error Handler:

function onGridError(e) {

var txt = "";

$.each(e.errors, function (propertyName) {

txt = txt +this.errors + " ";

});

$("#lblStatus").text(txt);

$("#lblStatus").css('color', 'red', 'font-weight ', 'bold');

}

Best regards

Dietmar

Grid

answered on 05 Dec 2013

1 answer

279 views

How to force user to input only items on Combobox

Hello ,i m using Kendo grid with pop-up edit mode.I have created custom template page for pop-up window.On this template there are some comboboxes.
I want user that can input(on combo's textarea) only from combobox's value.

E.g.:

Combobox-Values: red,yellow,green

When user fill the combobox's textarea like "RED" or "Yellow" validator message should appears and ,update button should return false such required = "required"
does on combobox.

@(Html.Kendo().ComboBox() 

.Name("IDTYPE") 

//.AutoBind(false) 

//.Events(e => e 

// .Change("combobox_select")) 

.DataTextField("DESCRIPTION").HtmlAttributes(new { style = "width:220px", required = "required" }) 

.DataValueField("REFERENCEID") 

// .Value(Model.IDTYPEGUID.ToString()) // Initial value 

// .BindTo(Model.IDTYPE) 

//.AutoBind(true) 

.Placeholder("SELECT") 

 

.DataSource(source => 

{ 

source.Read(read => 

{ 

 

read.Action("GetDefinitionDetails", "Definition", new { definitionCode = "IDTYPE", addEmptyRow = false }) 

// .Data("onAdditionalData") 

; 

 

}) 

.ServerFiltering(true); 

 

}))

ComboBox

answered on 05 Dec 2013

1 answer

95 views

Kendo Grid dependent columns

HI All
Im having a kendo MVC grid. Where say there are three columns A,B,C. Now i need to update the value of the B column on edit of A column.On Edit of A . B should be autmatically calculated and updated on UI. Ex B=A-45 .. Please help me how do i achieve this.

Regards
VIPUL

Grid

answered on 05 Dec 2013

1 answer

455 views

Databound event doesn't fire

Hi,

I'm using a TreeView like in this example. It is located in the left pane of a two pane splitter, if that matters. All events fire as they should, except the DataBound one. I already tried to modify the example code, that comes with kendo. It does not work here, too.

My TreeView code:

@(Html.Kendo().TreeView()

.Name("MyTreeView")

.BindTo(Model, mappings => mappings.For<TreeViewNode>(binding => binding

.ItemDataBound((item, node) =>

{

item.Text = node.Name;

item.Id = node.Value.ToString();

item.Expanded = ViewData[ViewBag.ExpandedCookie] != null &&

((string[])ViewData[ViewBag.ExpandedCookie]).Contains(item.Id);

//item.HtmlAttributes["data-selectable"] = node.Selectable;

if (node.AddOnly)

item.HtmlAttributes["data-addOnly"] = true;

else

item.HtmlAttributes["data-addOnly"] = false;

if (!node.Selectable)

{

item.HtmlAttributes["style"] = "color: #888";

}

else

item.HtmlAttributes["style"] = "color: black";

})

.Children(parent => parent.Childs))).HtmlAttributes(new { @class = "k-group" }).Events(e => e

.Select("onSelect")

.Expand("updateTreeViewState")

.Collapse("updateTreeViewState")

.DragStart("onNodeDragStart")

.DataBound("onTreeDataBound")

.Drop("onNodeDrop")).DragAndDrop(true)

)

And the javascript code:

function onTreeDataBound(e) {

alert("databound");

}

// select event as an example (this works)

function onSelect(e) {

var dataItem = this.dataItem(e.node);

$("#ID").val(dataItem.id);

if ($(e.item).attr("data-selectable") == "0" || dataItem.id == "0")

e.preventDefault();

else

// request server for partial view for details and refresh right pane of splitter

getSplitter("#outerSplitter").ajaxRequest("#right-pane", "/" + getArea() + "/" + getController() + "/Details", { id: dataItem.id });

// update statusbar to default

$("#lblStatus").text("Ready");

$("#lblStatus").css('color', 'black', 'font-weight ', 'normal')

//}

}

Am I missing something here?

Best Regards

Dietmar

TreeView

answered on 05 Dec 2013

1 answer

668 views

How to use Different Templates For Edit and Create Operations

I am using Kendo Grid for Edit,Update,Delete user Informations.

I want to use different templates for edit and create opetation.
Currently:

.TemplateName("EditPerson"))

With this i created a view file(name is EditPerson.cshtml) under "EditorTemplates" folder.
i want to use another template for Create Operations.How can i do it?

Grid

answered on 04 Dec 2013

4 answers

362 views

Dynamic columns in grid

Hi,

I just watched the keynote to the new release Q3/2013. While there are many cool features, I am a little underwhelmed by what was presented regarding adaptiveness of the grid.

What I expected: I thought there would be a feature that allows me to dynamically (depending on the screen size) add or remove columns shown in the grid. That's rather a usecase for me than soemone showing the grid on a mobile.

Are there solutions for this? I think there were announced at some point in time, not long ago...

Thanks,
Volker

Edit: Here is the link to the blog post I had in mind:
http://www.kendoui.com/blogs/teamblog/posts/13-10-10/building-an-adaptive-grid-and-scheduler-for-kendo-ui.aspx

Grid

answered on 04 Dec 2013

1 answer

328 views

a directory with this name was not found

I updated to latest Kendo today and now get this error.
"a directory with this name was not found"
I have had this error in the past, but cant remember how to fix it.
I have looked at permissions and have checked the paths but all looks ok. any ideas, thanks

Editor

answered on 03 Dec 2013