Telerik Forums
UI for ASP.NET MVC Forum
6 answers
305 views
Hi,

I were trying the following things in the kendo grid and facing some issues,

1. Grid Tabbing

       Tabbing is working when there is no calculations are done on text changes. For example, if there are two fixed rows and first row is editable. If we change the data in the first row that should do a calculation and get updated in the second row. So for that purpose I use onCellChange event and i do the following in that

var grid = $('#gridtest').data("kendoGrid");
            var Row0 = grid.dataSource.data()[0];
            var Row1 = grid.dataSource.data()[1];

Row1.set("Total",Math.round(Row0.get("Total")*100)); 

These statement works and sets the value to the cell, but it is not visible until I focus  to the cell. To rectify this problem i used

grid.refresh();

This solves the issue, but it raises an another problem that i am unable to navigate to the next cell when i press tab. Due to this refresh the focus goes to first column. I need a solution for either to navigate to next cell when using grid.refresh() in oncellchange event or to display the cell when the value is set using model.


2. Dropdown Column

I have a dropdown column in the same grid where the model for that column has integer and i am unable to show the name in the cell instead of value.


I have attached a sample project with this and i have removed the packages folder in the attached project due to huge size, so please help me in this issue.

Thanks
Senthil

Tiago
Top achievements
Rank 2
 answered on 20 Oct 2014
1 answer
65 views
Hello,
    I'm relatively new to Telerik and I'm getting a bit stumped about what the best way to proceed is.

I have a grid running InCell mode, however, for a particular cell:

1. I need to pop a list of selections the user can pull from. These selections would then be appended to the text in the cell.
2. The user needs to retain the ability to type in the cell. (which I believe rules out using a multiselect instead)

To that end, I have a grid  with a  command button set up that displays a list of choices in a modal Kendo window using a partial view. You can see this in the attachment. I am trying to append the list of items to the "Comment" column in the main grid.

However, I'm still having issues doing the following:
1. Getting the selected id from the main grid and feeding this into the partial view so that the list shows the correct items for the main grid row.
2. Iterating through the rows in the partial view, getting the checked items and passing the data back to the main grid.

I'm going in circles with javascript and not getting the data back to the main grid.

So, I'm wondering if there is a simpler way to do what I'm trying to accomplish?

The most obvious one is to use the Mutiselect, but I don't think that satisfies the criteria of the user being able to type whatever they would like in addition to making choices.

If anyone has a better notion of how to approach this, please let me know.

Thanks,
Dave 


Petur Subev
Telerik team
 answered on 20 Oct 2014
6 answers
414 views
Hi

i'm using a Kendo UI Grid (Version: 2014.2.716.545) within a ASP .NET MVC 5 Project to bind XML Data from a local hosted REST Webservice. I would like to "activate" ServerPaging. Here is my Datasource Definition

var dataSource = new kendo.data.DataSource({
            serverPaging: true,
            serverFiltering: true,
            serverSorting: true,
            transport: {
                read: function (options) {
                    $.ajax({
                        url: ".../api/{Controller}/GetData",
                        type: "POST",
                        success: function (data) {
                            options.success(data);
                        },
                        error: function (errorThrown) {
                            alert(errorThrown);
                        }
                    });
                },
                create: function (options) {
                    SaveData(options);
                },
                update: function (options) {
                    SaveData(options);
                },
            },
            schema: {
                type: "xml",
                data: "/ArrayOfType/Type",
                model: {
                    id: "Type_ID",
                    fields: {
                        Type_ID: {
                            field: "Type_ID/text()", type: "number",
                            validation: { required: true }
                        },
                        FieldA: {
                            field: "FieldA/text()", type: "string",
                            validation: {
                                required: true,
                                min: 1
                            }
                        },
                        FieldB: {
                            field: "FieldB/text()", type: "string",
                        }
                    }
                }
            },
            pageSize: 50
        });

and my Controller Method:

[System.Web.Http.ActionName("GetData")]
        [System.Web.Http.HttpPost]
        public ResponseMessageResult GetData([DataSourceRequest] DataSourceRequest request)
        {
            try
            {
                var list = _db.Load().ToDataSourceResult(request);
                 
                var resp = ResponseMessage(new HttpResponseMessage(HttpStatusCode.OK)
                {
                    Content = new ObjectContent<DataSourceRequest>(list, new System.Net.Http.Formatting.XmlMediaTypeFormatter
                    {
                        UseXmlSerializer = true
                    })
                });
                resp.Response.Headers.Add("Access-Control-Allow-Origin", "*");
                return resp;
            }
            catch (Exception ex)
            {
                Logger.LogError(ex);
                throw;
            }
        }

The client calls the Controller Method correctly, but the request Parameter is always NULL. Is something wrong with my Client Definition ?
Philipp
Top achievements
Rank 1
 answered on 20 Oct 2014
1 answer
571 views
Hello, I'm having trouble setting up checkbox column in my grid. I am using inline edit mode and my checkbox column is se up like this

@(Html.Kendo().Grid<URBIS.ViewModels.PropisiViewModel>()
.Name("grid")
.Events(e => e.DataBound("onDataBound"))
.Columns(columns =>
{
 
    columns.Bound(p => p.GrupePropisa).ClientTemplate("#=GrupePropisa.Naziv#").EditorTemplateName("GrupePropisa").Width(220);
    columns.Bound(p => p.Naziv).Width(220);
    columns.Bound(p => p.SluzbeniList).Width(220);
    //columns.Bound(p => p.Aktivan).Width(120);
    columns.Bound(p => p.Aktivan)
              .Title("Aktivan")
              .ClientTemplate("<input type='checkbox' #= Aktivan ? checked='checked': '' # class='chkbx' />")
              .HtmlAttributes(new {style = "text-align: center"})
              .Width(50);
})

and script handling check events is
$(function () {
    $('#grid').on('click', '.chkbx', function () {
        var checked = $(this).is(':checked');
        var grid = $('#grid').data().kendoGrid;
        var dataItem = grid.dataItem($(this).closest('tr'));
        dataItem.set('Aktivan', checked);
    });
});

The problem I'm experiencing is very weird. Binding to bool field from database works fine, editing also but when inserting, checkbox always passes as false. Very weird. Also, I would like the checkbox to be disabled if the row is in read only mode and to be editable if the row is in edit/insert mode. Any help? Lost few hours on this and this is too much :)
Alexander Popov
Telerik team
 answered on 20 Oct 2014
2 answers
378 views
In the past, with the AngularJS.KendoUI nuget package I was able to mix both AngularJS style kendo instantiation with traditional Html.Kendo() instantiation.

With the latest version Kendo UI v2014.2.716 the bridge is now integrated.

Today I created a brand new project added Kendo UI v2014.2.716 .  Added <html ng-app="marketing">
with     <script>
        angular.module('marketing', []);
    </script>

and noticed that the traditional instantiation is broken.
"TypeError: m is not a function"


Attached are images with ng-app and without ng-app behavior.


Nik Ivancic
Top achievements
Rank 1
 answered on 19 Oct 2014
2 answers
592 views
I have a problem with Kendo Pie chart about "Aggregate" functions(count, sum, average).Everyting works with Bar or Column chart but when i try to show pie chart i can't use count, sum, average functions of Kendo Pie Chart's.

I can show my values invidually but i can't group my values(like euro, dolar, lira)How can i group my values and show them with Pie chart?

Here is my model:
public decimal MoneyValue{ get; set; }
public string MoneyName{ get; set; }

My values are coming like that with Pie Chart.:
Euro - 10
Dolar- 100
Dolar - 50
Euro -15
Dolar - 50
Lira - 45

I need to show values like that:
Euro - Count: 2 Total:25 Avg: 12,5
Dolar - Count: 3 Total: 200 Avg: 66,6
Lira Count: 1 Total: 200 Avg: 200

View Code


View Code@(Html.Kendo().Chart(Model)
.Name("chart")
.Title(title => title
.Text(@ViewBag.a)
.Position(ChartTitlePosition.Top))
.Legend(legend => legend
.Visible(false)
.Position(ChartLegendPosition.Top))
.Series(series =>
{
series.Pie(model => model.MoneyValue, categoryExpression: model => model.MoneyName);
// .Aggregate(ChartSeriesAggregate.Count)
//.Labels(labels => labels.Visible(true).Position(ChartBarLabelsPosition.Center));

//here i get the error. It shows there is no .Aggregate function so i can't group my values.

})


.Theme("metro")
.Tooltip(tooltip => tooltip
.Visible(true)
.Template("#= category #: #= value #"))
.Events(ev => ev.DataBound("onDB"))

)

Kendo Count - Sum - Average functions:(i've no problem with them, they work correctly.)<div class="configuration-horizontal">

<div class="config-section">
<center>
<span class="configHead">Grafik </span>
</center>
<ul class="options">

<td>
<input id="aggregateSum" name="aggregate" type="radio" value="sum" autocomplete="off" />

Sum

</td>
<td>
<input id="aggregateAvg" name="aggregate" type="radio" value="avg"
autocomplete="off" />

Avg

</td>
<td>
<input id="aggregateCount" name="aggregate" type="radio" value="count" checked="checked" autocomplete="off" />

Count

</td>
</ul>

</div>
</div>
<script>
$(".configuration-horizontal").bind("change", refresh);

function refresh() {
var chart = $("#chart").data("kendoChart"),
series = chart.options.series,
categoryAxis = chart.options.categoryAxis,
baseUnitInputs = $("input:radio[name=baseUnit]"),
aggregateInputs = $("input:radio[name=aggregate]");

for (var i = 0, length = series.length; i < length; i++) {
series[i].aggregate = aggregateInputs.filter(":checked").val();
}

categoryAxis.baseUnit = baseUnitInputs.filter(":checked").val();

chart.refresh();
}
</script>
Gokhan
Top achievements
Rank 1
 answered on 17 Oct 2014
1 answer
118 views
The sample source code does not show, What is the Kendo Mobile Type we need to use to create such a form?

http://demos.telerik.com/aspnet-mvc/mobile-forms/index

​
Sebastian
Telerik team
 answered on 17 Oct 2014
1 answer
121 views
Hi,

I'm trying to use KendoGrid server-side logic for grouping grid data with the help of ToDataSourceResult extension.

public class User
{
        public int UserID;
        public string UserName;
        public int UserType;
        public ComplexID complexID;
}

public class ComplexID
{
       public string cID;
       public string Description;
}

I have a list of users:

var userLst = new List<User>{usr1, usr2, usr3};

I'm trying to group the users to be displayed in the KendoGrid:

var kendoData = userLst.AsQueryable().ToDataSourceResult(kendoRequest);

If I group by UserType, everything works fine. My question is how can I group the data by complexID.cID? What should I specify in kendoRequest?

Thank you.
Alexander Popov
Telerik team
 answered on 17 Oct 2014
1 answer
150 views
Hi,

We have a specific situation which is not so uncommon. We are using Kendo controls for ASP.NET MVC and binding them to ASP.NET Sitemap which works ok.

We would need to setup on the top of the page Kendo Menu (or any other Kendo control?) which will show only the top level menu options without their children. Besides that, on the left side there should be another menu which does not show the top level items, but only their children.

For example:
- Users
       - Create
       - Manage
       - List
- Payments
       - Create
       - Due
       - List

Top menu should show only Users and Payments items. Left menu should show depending on which page you are either children of Users or children of Payments.


How can this be achieved?



Thank you!






Dimo
Telerik team
 answered on 16 Oct 2014
1 answer
97 views
I'm trying to perform editing like in the example :
http://demos.telerik.com/aspnet-mvc/mobile-listview/editing

I have an error on .Events(events => events.Init("listViewInit"))

Error 2 'Kendo.Mvc.UI.Fluent.MobileListViewEventBuilder' does not contain a definition for 'Init' and no extension method 'Init' accepting a first argument of type 'Kendo.Mvc.UI.Fluent.MobileListViewEventBuilder' could be found (are you missing a using directive or an assembly

Thank you
Eric
Top achievements
Rank 1
 answered on 16 Oct 2014
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?