Questions on Kendo UI for jQuery Forum

2 answers

573 views

Hi All

I'm trying to get the Kendo Grid to display with a hierarchical row displaying history data for a given row.
My colleague has setup the project with the primary model having a one to many relationship to the second model.
Models are as follows:

public class CrossReferenceRelationship

{

public int Id { get; set; }

[Display(Name = "From Partner")]

public string FromPartner { get; set; }

[Display(Name = "To Partner")]

public string ToPartner { get; set; }

[Display(Name = "From Role")]

public string FromRole { get; set; }

[Display(Name = "From Account")]

public string FromAccount { get; set; }

[Display(Name = "To Account")]

public string ToAccount { get; set; }

[Display(Name = "Is Deleted")]

public bool IsDeleted { get; set; }

public ICollection<CrossReferenceRelationshipHistoricEntry> HistoricEntries { get; set; }

}

public class CrossReferenceRelationshipHistoricEntry

{

public int Id { get; set; }

public int XrefId { get; set; }

[Display(Name = "From Partner")]

public string FromPartner { get; set; }

[Display(Name = "To Partner")]

public string ToPartner { get; set; }

[Display(Name = "From Role")]

public string FromRole { get; set; }

[Display(Name = "From Account")]

public string FromAccount { get; set; }

[Display(Name = "To Account")]

public string ToAccount { get; set; }

[Display(Name = "Action Type")]

public string ActionType { get; set; }

[Display(Name = "Method Used")]

public string MethodUsed { get; set; }

[Display(Name = "Modified By")]

public string ModifiedBy { get; set; }

[Display(Name = "Modified Datetime")]

public DateTime ModifiedDatetime { get; set; }

}

He then maps these using EntityMapper, populating these objects.
So far my view contains the following code for the Kendo grid:

@(Html.Kendo()

.Grid(Model)

.Name("adminGrid")

.Columns(columns =>

{

columns.Bound(crr => crr.Id).Filterable(false).Width(100);

columns.Bound(crr => crr.FromPartner).Width(200);

columns.Bound(crr => crr.FromAccount).Width(200);

columns.Bound(crr => crr.ToPartner).Width(200);

columns.Bound(crr => crr.ToAccount).Width(150);

columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);

})

.ToolBar(toolbar => toolbar.Create())

.Editable(editable => editable.Mode(GridEditMode.InLine))

.Pageable()

.Sortable()

.Scrollable()

.ClientDetailTemplateId("HistoricEntries")

.Filterable()

.HtmlAttributes(new { style = "height:430px;" })

.Events(events => events.DataBound("dataBound"))

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Events(events => events.Error("error_handler"))

.Model(model => model.Id(crr => crr.Id))

.Create(update => update.Action("Partner_Create", "CrossReferenceRelationship"))

.Read(read => read.Action("Read", "CrossReferenceRelationship"))

.Update(update => update.Action("Update", "CrossReferenceRelationship"))

.Destroy(update => update.Action("Delete", "CrossReferenceRelationship"))

)

<script id="HistoricEntries" type="text/kendo-tmpl">

@(Html.Kendo().Grid<CrossReferencePortal.Models.CrossReferenceRelationshipHistoricEntry>()

.Name("historyGrid_#=Id#")

.Columns(columns =>

{

columns.Bound(he => he.FromPartner);

columns.Bound(he => he.FromAccount);

columns.Bound(he => he.ToPartner);

columns.Bound(he => he.ToAccount);

columns.Bound(he => he.FromRole);

columns.Bound(he => he.ActionType);

columns.Bound(he => he.MethodUsed);

columns.Bound(he => he.ModifiedBy);

columns.Bound(he => he.ModifiedDatetime);

})

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(5)

.Read(read => read.Action("HistoryRead", "CrossReferenceRelationship", new { Id = "#=Id#" }))

)

.Pageable()

.Sortable()

.ToClientTemplate()

)

</script>

I feel I should be able to bind the history grid to the primary grid's Model, so that I can simple expose the HistoricEntries e.g.
crr.HistoricEntries

Is this possible and are there any examples showing something similar?

Many thanks
Christian

Grid

answered on 27 Nov 2013

1 answer

56 views

Move valueAxis to min with 'object' data (vs 'array' data)

Hi All,

I was trying to move the valueAxis to the minimum value, however this is not working when the data is an object compared to the examples where it uses data arrays. Is there a way to move the axis with this kind of configuration? Please see the following jsFiddle:

http://jsfiddle.net/kousei2040/D42M6/10/

Thanks in advance.

Charts

answered on 27 Nov 2013

1 answer

789 views

Not able to select a dropdown value using selenium automation.

Hi ,

I am facing an issue to select a dropdown value using selenium. Please suggest how can we automate to select kendo ui dropdown value using selenium.

DropDownList

answered on 27 Nov 2013

7 answers

781 views

Column Filter, Reorder and highlight don't want to lost after refresh.

Dear Support Team,

I'm new for Kendo UI Grid. For the moment, I enable "Filterable, groupable, sortable and reorderable" at the grid. And I do refresh the grid every 3 minutes to get the latest data. But if the user do Filter or Reorder or sorting or grouping at the grid, I don't want to effect that setting when the grid has been auto refresh is on.
Currently all the setting are gone after refresh. Is there any way not to lost such setting?

Here is part of my code :

var grdTmp = grdReport.data("kendoGrid");

grdTmp.destroy();

grdReport.empty();

grdReport.kendoGrid({

dataSource: {

data: vMenuData,

pageSize: 20 //To replace with Header Value

},

dataBound: onMenuDataBound,

reorderable: true,

groupable: true,

sortable: true,

selectable: "row",

filterable: true,

pageable: {

refresh: true,

pageSizes: true

},

columns: vMenuHead,

schema: vMenuSchema

});

Thanks & Regards

Grid

answered on 27 Nov 2013

1 answer

427 views

Override validation message with custom icon

Is it possible to replace the validation message with my own image? I would like to provide an image and set it's title to the validation message. If there is a way to provide a validation message template, that would be great.

Thanks!

Validation

answered on 27 Nov 2013

3 answers

83 views

Preview not available from MVC wrappers?

I am using the KendoUI MVC wrappers, I believe Q2 2013. In the documentation I see that the ColorPicker has a preview flag that can disable the preview pane. This does not appear to be available in the MVC wrapper? Am I missing something?

Thanks
Dave Goughnour

ColorPicker

answered on 27 Nov 2013

1 answer

63 views

Grid tabbing problem in Google Chrome

Hello,

We see that tabbing doesn't work in Chrome on the grid control samples . We try to tab on header and page indexes in grid, but it doesn't hit on appropriate areas.
We admitted this behaviour in our application too (kendo v2013.2.716).
It is to be noted you may see this issue only in Chrome.

Should we expect fixing of the mentioned above bug by new releases of kendo or maybe you can propose workaround?

Thank you,

Best regards

Grid

answered on 27 Nov 2013

1 answer

656 views

Custom destroy command click event not firing

Hello,

In my Grid i have a column with 2 commands, which both use custom functionality like this.

{

className: "btn-edit",

text: "Bewerken",

name: "edit",

click: function (e) {

e.preventDefault();

var tr = $(e.target).closest("tr"); /* get the current table row (tr) */

var data = this.dataItem(tr);

CIX.CRM.Navigate('/businesses/' + data.ID, '/administration', data);

}

},

{

className: "btn-destroy",

name: "destroy",

text: "Verwijderen",

click: function (e) {

e.preventDefault();

var tr = $(e.target).closest("tr"); /* get the current table row (tr) */

var data = this.dataItem(tr);

CIX.CRM.MessageDialog("Verwijderen", data.Code + ' - ' + data.Name, "Weet u zeker dat u " + data.Name + " wilt verwijderen ?", [{ title: "Ja", action: _delete }, { title: "Nee", action: _cancelDelete }], data);

}

The problem is... when i give the 2nd command the name "destroy", the click event of that command is never called. When i give it another name, it doesn't show the destroy icon and leaves the inner span with an empty classname.

is there another way to have an icon with the destroy action without breaking the click event handler ?

Thanks in advance.

Grid

answered on 27 Nov 2013

1 answer

198 views

ListView, Template and right Arrow

Hi!
I am using a ListView together with a template to show information to my users.
If the user presses an item in my listview, a new listview apperes showing sub data for the item the user pressed.
When I'm not using a template, a > sign is visible to the right, notifying the user that the item can be pressed.

How can I add this > sign to my template so it looks the same as the build in one?
My current template looks like this:

Regards
Per

<script type="text/x-kendo-template" id="feedTemplate">

<div style="float:right">

>

</div>

<img class="item-image" src="${ImageUrl}" />

<h3 class="item-title">${Title}</h3>

<p class="item-description">${Description}</p>

<a href="\\#" data-role="button" class="delete">Delete</a>

</script>

ListView (Mobile)

answered on 27 Nov 2013

1 answer

193 views

Need to group by one column at time

Hello,
for design reasons i need to group by one column at time, there is a way to do it with the configurations? Or do it with some event bind?

I use MVC with kendo extensions.

Thanks,

Grid

answered on 27 Nov 2013