Telerik Forums
UI for ASP.NET MVC Forum
4 answers
698 views
Hi,

I have a stored procedure which returns  2 result sets. First result-set is collection of Columns ,data types, column order, Is column sortable and is column filterable. 
Second resultset is actual data for the columns which are there in first resultset. So in short my stored procedure returns the metadata for the columns and their values. I dont know in advance what will be my columns list. At code level stored procedure is  returning a dataset with 2 tables inside it.  Now I want to bind the kendo grid with the second table of dataset and first table of dataset will give me information about the columns which are suppose to have sort ,filter criteria. My problem is  i dont know the columns in advance still i execute the stored procedure then how can i use DataSourecRequest object to find out custom sorting and filtering stuff.
e.g. 
private CriteriaDto GetCriteriaDtoValues(DataSourceRequest request)
        {
           var criteriaDto = new DocumentHistoryCriteriaDto { Filters = new Dictionary<string, string>() };
            if (request.PageSize == 0)
            {
                request.PageSize = 20;
                criteriaDto.PageSize = 20;
            }
            else
            {
                criteriaDto.PageSize = request.PageSize;
            }
            if (request.Sorts != null && request.Sorts.Count > 0)
            {
                foreach (SortDescriptor sortDescriptor in request.Sorts)
                {
                    if (sortDescriptor.SortDirection == ListSortDirection.Ascending)
                    {
                        switch (sortDescriptor.Member)
                        {
                            case "ActivityDate": //This is hard coded column just for example but by this time i dont knwo what are the columns there in resultset
                                criteriaDto.SortBy = "ActivityDate";
                                criteriaDto.IsSortAcending = true;
                                currentSortType = criteriaDto.SortBy;
                                break;
                            case "RecordId": ////This is hard coded column just for example but by this time i dont knwo what are the columns there in resultset
                                criteriaDto.SortBy = "RecordId";
                                criteriaDto.IsSortAcending = true;
                                currentSortType = criteriaDto.SortBy;
                                break;                            
                        }
                    }
                    else
                    {
                        switch (sortDescriptor.Member)
                        {
                            case "ActivityDate": //This is hard coded column just for example but by this time i dont knwo what are the columns there in resultset
                                criteriaDto.SortBy = "ActivityDate";
                                criteriaDto.IsSortAcending = false;
                                currentSortType = criteriaDto.SortBy;
                                break;
                            case "RecordId": //This is hard coded column just for example but by this time i dont knwo what are the columns there in resultset
                                criteriaDto.SortBy = "RecordId";
                                criteriaDto.IsSortAcending = false;
                                currentSortType = criteriaDto.SortBy;
                                break;                            
                        }

                    }
                }
            }
            else
            {
                criteriaDto.SortBy = "ActivityDate"; //This is hard coded column just for example but by this time i dont know what are the columns there in resultset
                criteriaDto.IsSortAcending = true;
                currentSortType = criteriaDto.SortBy;
            }
            if (request.Filters != null && request.Filters.Count > 0)
            {
                foreach (FilterDescriptor filterDescriptor in request.Filters)
                {
                    switch (filterDescriptor.Member)
                    {
                        case "RecordId": //This is hard coded column just for example but by this time i dont know what are the columns there in resultset
                            criteriaDto.Filters.Add("LoanNo", filterDescriptor.Value.ToString());
                            break;
                    }

                }
            }
            if (request.Page > 0)
            {
                criteriaDto.PageNumber = request.Page;
            }
            return criteriaDto;

        }  

Also I have written below ajax method which is calling the above code before it calls the Store procedure. Can you provide some exmaple on how I can actually
pass the data set's data table collection to view in MVC  and How can i bind it to grid for 2nd table in dataset and how can i make use of first table
to decide which columns to sort and filter using DataSourceRequest object

 public ActionResult View_ByRecordId_Read([DataSourceRequest] DataSourceRequest request)
{
        
DataSet dsModel;
int  total=0;
int RecordId = 2;
string RecordValue = "0000224374";
 int timeFrame = 50;

 criteriaDto = this.GetCriteriaDtoValues(request);  //So here it calls this method to decide which columns got sort and filer criteria but actually by this time i dint get my procedure called so how can i figure it out which columns are meant to be for sorting and filtering.

dsModel = this._Service.GetDocumentView (userDto.Id,RecordId,RecordValue,timeFrame,criteriaDto,Guid.NewGuid());  //This is calling stored procedure and returning a dataset with 2 tables inside it.

if (dsModel != null && dsModel.Tables.Count > 0)        {
 bool tryParse=int.TryParse(dsModel.Tables[1].Rows[0]["TotalCount"].ToString(),out  total);    }

            var  result = new DataSourceResult() { Data = dsModel.Tables, Total = total };

            return Json(result);

        }
Aarti
Top achievements
Rank 1
 answered on 17 Apr 2014
1 answer
145 views

So I'm pretty new to using this component, so I'm not very familiar with it yet.

Here's what I'm trying to do:

I have a scheduler that I'm pre-populating with a lot of tasks.  I don't want the user to be able to add, delete, or update anything.  However, on selecting or clicking (or double clicking, whatever works best) I want to be able to update some other value in the model that was passed into the view.

For example: When user clicks on a task at 12:00 PM I don't want to show any pop ups or anything, but I want to set Model.appontmentTime equal to the tasks start time (i.e. 12:00 PM).

Also, as a side issue, for some reason when I attach a task to an owner as listed in the resources, the task is not showing in the right color.  Am I doing something wrong there?

So Far I have:

01.@(Html.Kendo().Scheduler<Humana.RetailSales.CGX.Site.TaskViewModel>()
02.            .Name("timeSlots")
03.            .Views(views => { views.WeekView(); })
04.            .Height(300)
05.            .Date(Model.appointmentCalendarRenderStartDate)
06.            .Height(400)
07.            .AllDaySlot(false)
08.            .MajorTick((int)Model.timeSlotInterval.TotalMinutes)
09.            .MinorTickCount(1)
10.            .Min(Model.appointmentCalendarRenderStartDate)
11.            .Max(Model.appointmentCalendarRenderFinishDate)
12.            .Resources(resource =>
13.            {
14.                resource.Add(m=> m.OwnerID)
15.                    .Title("Owner")
16.                    .DataTextField("Text")
17.                    .DataValueField("Value")
18.                    .DataColorField("Color")
19.                    .BindTo(new[] {
20.                        new { Text = "Many", Value = 1, color = "#003300"},
21.                        new { Text = "Few", Value = 2, color = "#CC3300"}
22.                    });
23.            })
24.            .DataSource(d => d
25.                .Model(m => {
26.                    m.Id(f => f.TaskID);
27.                    m.Field(f => f.Title).DefaultValue("No title");
28.                    m.Field(f => f.OwnerID).DefaultValue(1);
29.                    m.Field(f => f.Title).DefaultValue("No title");
30.                    m.RecurrenceId(f => f.RecurrenceID);
31.                })
32.
33.            )
Vladimir Iliev
Telerik team
 answered on 17 Apr 2014
3 answers
340 views
I am trying to pass data to the controller using MVC wrappers. But data not being send, controller is executing but data is not passed. am I doing things correctly?
Thanks

var chart = $("#SalesChart").data("kendoChart");
chart.refresh({
    data: { "FromDate": $("#FromDate").data("kendoDatePicker").value(), "ToDate": $("#ToDate").data("kendoDatePicker").value() }
});

​
@code
           Dim SalesChart As Kendo.Mvc.UI.Chart(Of BO.Models.Statistics.SalesTimeSpan) = _
               Html.Kendo.Chart(Of BO.Models.Statistics.SalesTimeSpan).
               Name("SalesChart").Title("Units sold").Series(Sub(series)
                                                                     series.Line(Function(model) model.Value, categoryExpression:=Function(model) model.Period).
                                                                     Aggregate(ChartSeriesAggregate.Avg)
                                                             End Sub).
           CategoryAxis(Function(axis) axis.Date().BaseUnit(ChartAxisBaseUnit.Weeks)).
           DataSource(Function(ds) ds.Read(Function(read) read.Action("getsalesbydate", "statistics", New With {.area = String.Empty})))
 
           SalesChart.Render()
 
 
       End Code
Daniel
Telerik team
 answered on 17 Apr 2014
2 answers
555 views
This bug is fixed with the internal build: kendoui.aspnetmvc.internal.2013.3.1321.commercial !

Hi kendo support team,

i have updated my Kendo Version yesterday to the new "Kendo UI for ASP.NET MVC Q3 2013" Release.

Now my Scheduler works with additional parameters they will calculate on runtime.
The user click some btns and the Scheduler refresh the data by call JavaScript method read()

like this:
01.var initialMitarbeiterId =5;
02.var filterKategorieArray = new Array();
03. 
04.function SchedulerAdditionalData() {
05.    return { mitarbeiterId: initialMitarbeiterId, filterKategorien: filterKategorieArray.toString() };
06.}
07. 
08.function SchedulerReadData() {
09.    var scheduler = $("#ErfassungScheduler").data("kendoScheduler");
10.    scheduler.dataSource.read();
11.}
the Scheduler code in razor Logik Looks like this:

01.@(Html.Kendo().Scheduler<Sachverhalt>()
02.          .Name("ErfassungScheduler")
03.          .Date(DateTime.Now)
04.          .Views(views =>
05.          {
06.              views.DayView(oDayView => oDayView.DateHeaderTemplate("#=kendo.toString(date, 'ddd dd. MM.')#").Selected(false));
07.              views.WeekView(oWeekView => oWeekView.DateHeaderTemplate("#=kendo.toString(date, 'ddd dd. MM.')#").Selected(false));
08.              views.MonthView(oMonthView => oMonthView.Selected(true));
09.              views.AgendaView(oAgendaView => oAgendaView.Selected(false));
10. 
11.          })
12.          .Selectable(true)
13.          .Timezone(timezoneString)
14.          .DataSource(oDs => oDs.Model(m =>
15.              {
16.                  m.Id(f => f.Id);
17.                  m.Field(f => f.IsAllDay);
18.                  m.Field(f => f.Title).DefaultValue("Neuer Termin");
19.                  m.Field(f => f.SachverhaltKategorieId);
20.                  m.Field(f => f.SachverhaltTypId);
21.              })
22.             .Read( r => r.Action("SchedulerRead", "Erfassung").Data("SchedulerAdditionalData"))
23.        .Destroy("SchedulerDestroy", "Erfassung")
24.             )
25.          .Events(e => e.Edit("scheduler_edit").Add("scheduler_add").Navigate("scheduler_navigate"))
26.          .Resources(resource =>
27.              resource.Add(m => m.SachverhaltKategorieId)
28.                .Title("Kategorie")
29.                .DataTextField("Text")
30.                .DataValueField("Value")
31.                .DataColorField("Color")
32.                .BindTo(colorResourceList)
33.          )
34.          .ShowWorkHours(true)
35. )

The Controller Methode

1.[HttpPost]
2.public JsonResult SchedulerRead([DataSourceRequest] DataSourceRequest oRequest, long mitarbeiterId, string filterKategorien)
3.{
4.            var selectedMitarbeiterId = mitarbeiterId;
5.            return Json(this.sachverhaltBL.LoadSachverhalte(selectedMitarbeiterId, filterKategorien).ToDataSourceResult(oRequest));
6.}

This line .Read( r => r.Action("SchedulerRead", "Erfassung").Data("SchedulerAdditionalData")) works fine with the previous Version. The JavaScript function "SchedulerAdditionalData" is called before post to Controller, but the Controller throws a http Status 500 because mitarbeiterId is null. In the previus Version it works correct, Did Kendo have Changed something in this Version. The release notes don't talk about this Problem.

If i change the JavaScript file "kendo.aspnetmvc.min.js" to the privious Version only, this Scenario works fine! I think there is a new bug in the js libraray.

Best regards

Gerd Kontze

Daniel
Telerik team
 answered on 17 Apr 2014
1 answer
438 views
Hi,

I'm trying to use a Kendo Grid inside a field template to handle the edit of a list of objects define as a property of another object using the UIHintAttribute.
The problem that I have is when you click the edit on the grid the values are not set to the editor controls they are all empty.

I have attached the relevant files from my test project and would appreciate any help.

Thanks, 
Vladimir Iliev
Telerik team
 answered on 17 Apr 2014
2 answers
178 views
Hello,

I created a grid using the example provided herehere and here.

When I click on any cell to edit it, the following error is triggered. Any help?

Uncaught TypeError: undefined is not a function         kendo.all.min.js:9
O                                       kendo.all.min.js:9
D                                       kendo.all.min.js:9
e.extend.kendoFocusable                 kendo.all.min.js:10
Sizzle.selectors.filter.PSEUDO          jquery-1.7.1.js:4605
Sizzle.filter                           jquery-1.7.1.js:4127
Sizzle                                  jquery-1.7.1.js:3955
Sizzle                                  jquery-1.7.1.js:5083
jQuery.fn.extend.find                   jquery-1.7.1.js:5339
u.extend.refresh                        kendo.all.min.js:20
u.extend.init                           kendo.all.min.js:20
(anonymous function)                    kendo.all.min.js:10
jQuery.extend.each                      jquery-1.7.1.js:658
jQuery.fn.jQuery.each                   jquery-1.7.1.js:271
e.fn.(anonymous function)               kendo.all.min.js:10
j.extend.editCell                       kendo.all.min.js:22
(anonymous function)                    kendo.all.min.js:22
jQuery.event.dispatch                   jquery-1.7.1.js:3256
elemData.handle.eventHandle             jquery-1.7.1.js:2875

The grid has the following code:

@(Html.Kendo().Grid<Kendo2.Models.Product>()
    .Name("grid")
    .Columns(c =>
        {
            c.Bound(b => b.Id).Hidden();
            c.Bound(b => b.Name);
            c.Bound(b => b.Company);
        }
    )
    .Editable(e => e.Mode(GridEditMode.InCell))
    .Sortable()
    .Pageable(p => p
        .Refresh(true)
        .PageSizes(new int[] {2, 10})
        .ButtonCount(5)
    )
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(m => m.Id))
        .Read(read => read.Action("List", "Home"))
    )
)

Alexander Popov
Telerik team
 answered on 17 Apr 2014
5 answers
664 views
We are using Kendo UI grid to import data from one grid to another grid, For that purpose we need to input some data to the kendo grid in the ADD Mode, Unfortunately Kendo grid input only available in the edit mode,I'm using ClientTemplate to input the data,but that is not support exactly,because kendo feature overridden....Please give me a solution to input data...

 @(Html.Kendo().Grid<Portal.Presentation.Web.BoundedContext.TNA.Template.MVC.Areas.Razor.Models.TaskPoupModel>()
                  .Name("importtaskgrid")
                  .AutoBind(true)
                  .HtmlAttributes(new {style = "border: 0;"})
                  .Columns(c =>
                               {
                                   c.Bound(x => x.TaskId).Hidden();
                                   c.ForeignKey(p => p.TaskGroupId, (System.Collections.IEnumerable) ViewData["TaskGroups"], "Key", "Value").Title("TASK GROUP").Sortable(true);
                                   c.Bound(x => x.TaskName).Title("TASK NAME").Sortable(true);
                                   c.Bound(x => x.LeadTime).Title("LEAD TIME").Sortable(false).
                                       ClientTemplate("<input type='text' name='importtaskgrid[#= ImportPopupHandler.index(data)#].LeadTime' value='#= LeadTime #' validateFor='number'/>");

                                   c.ForeignKey(p => p.UserId, (System.Collections.IEnumerable) ViewData["Users"], "Key", "Value").Title("TASK OWNER").Sortable(true);
                                   c.Bound(x => x.IsImport).ClientTemplate("<input type='checkbox' #= IsImport ? checked='checked' : '' # ></input>").Title("PICK TO IMPORT").Width(100).Sortable(false);
                               })
                  .Sortable()
                  .Editable(x => x.Mode(GridEditMode.InCell))
                  .DataSource(dataSource => dataSource
                                                .Ajax().ServerOperation(true)
                                                .Sort(sort => sort.Add(p => p.TaskName).Descending())
                                                .PageSize(20)
                                                .Events(events => events.Error("error_handler"))
                                                .Model(model =>
                                                           {
                                                               model.Id(p => p.TaskId);
                                                               model.Field(p => p.TaskGroupId).Editable(false);
                                                               model.Field(p => p.TaskName).Editable(false);
                                                               model.Field(p => p.LeadTime).DefaultValue(0);
                                                               model.Field(p => p.UserId).DefaultValue(0);
                                                           })
                                                .Read(read => read.Action("OnPopupTaskRead", "Tna").Data("ImportPopupHandler.getAdditionalData").Type(HttpVerbs.Get)
                                                ))
                  .Scrollable()        
                  )
Vladimir Iliev
Telerik team
 answered on 17 Apr 2014
2 answers
234 views
@(Html.Kendo().Grid<McGladrey.DOTT.DataAccess.EngagementStatusDataItem>()
            .Name("grid")
            .Columns(columns =>
            {
                
                columns.Bound(c => c.ClientName).Width("9%").Title("Client Name");
                columns.Bound(c => c.ClientNumber).Width("7%");
                columns.Bound(c => c.TaxYear).Width("7%");
                columns.Bound(c => c.EngType).Width("7%").Title("Eng Type");
                columns.Bound(c => c.MasterClient).Width("7%");
                columns.Bound(c => c.Assembler).Width("7%");
                columns.Bound(c => c.Status).Width("7%");
                columns.Bound(c => c.Amended).Width("9%");
                columns.Bound(c => c.ReturnTypes).Width("10%");
                columns.Bound(c => c.EIMessage).Width(175).Title("Comments");
                columns.Bound(c => c.ToDoUsers).Width("9%").Title("To Do");
                columns.Bound(c => c.eUpdated).Width("10%").Title("Last Updated").ClientTemplate("#= eUpdated ? kendo.toString(kendo.parseDate(eUpdated), 'MM/dd/yyyy') : '' #");
                columns.Bound(c => c.IsInEngagement).Width("10%");
            })
        .HtmlAttributes(new { style = "height: 380px;" })
        .ClientDetailTemplateId("template")
        .Scrollable()
        
        .Sortable()
         
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
        .Events(events => events
            .DataBound("dataBound")
            .DetailExpand("expand"))
   
)
</div>
 
 
<script id="template" type="text/x-kendo-template">
 
    @(Html.Kendo().Grid<McGladrey.DOTT.DataModel.WorkSiteDOTT.IManWorkspaceSerializeable>()
                .Name("grid_#=eFolderID#")
                .Columns(columns =>
                {
                    columns.Bound(ws => ws.Name).Width(110);
                    columns.Bound(ws => ws.Owner).Width(110);
                    columns.Bound(ws => ws.CreationDate).ClientTemplate("\\#= CreationDate ? kendo.toString(kendo.parseDate(CreationDate), 'MM/dd/yyyy') : '' \\#");
                    columns.Bound(ws => ws.Description).Width(200);
                })
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Read(read => read
                            .Action("WorksiteRequest", "Admin", new { clientNumber = "#=ClientNumber#", taxYear = "#=TaxYear#", amended = "#=Amended#", engType = "#=EngType#" })
                         )                  
                )
                .Events(events => events.DataBound("dataBinding"))
                .HtmlAttributes(new { style = "height: 180px;" })
                .ToClientTemplate()
        )
 
</script>
 
<script type="text/javascript">
 
    function dataBound() {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }
    function dataBinding()
    {
        alert("here");
        
    }
 
    function expand(e) {
        alert("in expand");
    }
 
    $("#ok").bind("click", function (e) {
 
        var dataSource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: "/Admin/EngagmentRequest",
                    dataType: "json",
                    data: {
                        ClientNumber: $('[name=clientNumber]').val(),
                        ClientName: $('[name=clientName]').val(),
                        TaxYear: $('[name=taxYear]').val()
                    }
                }
            }
        });
        dataSource.pageSize(5);
 
        var grid = $("#grid").data("kendoGrid");
        grid.setDataSource(dataSource);
 
    });
</script>

The issue with the above code is the Child Grid ("grid_#=eFolderID#") does not display any data.

The model is correct. This was proven by removing the columns and letting the grid determine them and all columns displayed correctly.
Data is coming back. This was proven via Fiddler. The following request returns data: /Admin/WorksiteRequest?clientNumber=4010574&taxYear=2013&amended=N&engType=Income%20Tax%20Compliance clientNumber=4010574&taxYear=2013&amended=N&engType=Income%20Tax%20Compliance 
{"CreationDate":"\/Date(1382465699000)\/","Description":"...","FolderID":983371,"ID":"!nrtdms:0:!session:XXXXX:!database:XXX:!page:983371:","LastUser":"XXXX XXXX","Name":"XXXXXXXXX","Owner":"XXXXXX","Path":"XXXXXXXXX","WorkspaceID":XXXXXXX}

The above code will also hit any events I tag on to it. The child grid will hit DataBound and DataBinding events

Everything is there it just will not display the data. 
 
Thoughts?


Thanks,
Martin

Dimiter Madjarov
Telerik team
 answered on 17 Apr 2014
1 answer
72 views
I would like to use it to schedule the staffs's shift for 14 days. Is this possible have 14 days as the day view in one page?
Vladimir Iliev
Telerik team
 answered on 16 Apr 2014
2 answers
1.3K+ views
Hello,

I am using Kendo UI for ASP.NET MVC and I am very new to it. I am trying to increase the width of the editor controls in the grid popup editor. Even though I could increase the width of the popup window using 
.Editable(e => e.Mode(GridEditMode.PopUp).TemplateName("CustomEdit").Window(w => w.Title("Edit").Name("customedit").Width(1000)))
the controls inside the window are not widened with it.

Can anyone please advise me how it can be done?

Thanks

Shameer
Shameer
Top achievements
Rank 1
 answered on 15 Apr 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
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
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?