This is a migrated thread and some comments may be shown as answers.

Scheduler - load additional Data on Edit

17 Answers 210 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Thomas
Top achievements
Rank 1
Thomas asked on 20 Oct 2016, 01:37 PM

Hi,

I have pretty complex appointment classes (with lots of dependencies). Now when I want to display them inside the scheduler I just read the most important information (start, end, title ...). But when I want to edit the appointment with my custom template, I want to load all the additional information (it would be too slow to load all that data for the scheduler).

So is there a possiblity to "reload" my object before showing it inside the template ?

 

Regards

Semir

17 Answers, 1 is accepted

Sort by
0
Thomas
Top achievements
Rank 1
answered on 20 Oct 2016, 07:53 PM

And one more question. 

 

How do I set the times and dates for new appointments from the scheduler ? For example if I dbl clicked on 9:00 at the 21.10.2016 I want my startdate and time to be set to those values (or if i dbl click on the allDay bar inside the scheduler I want my new appointment to have the allday flag set)

 

Regards

0
Thomas
Top achievements
Rank 1
answered on 21 Oct 2016, 12:22 AM

And one more.

Is it not possible to use jquery syntax inside an editortemplate cshtml file?

When I do smt like that  $("#terminKategorie") inside any function of the editor template, I get an error that the template is invalid when I try to create/edit an appointment.

Now I helped myself by putting all my javascript funtions regarding that editortemplate inside an javascript file (but there I cant interact with my Model so it would be nice if it would work from the template).

 

Regards

0
Thomas
Top achievements
Rank 1
answered on 21 Oct 2016, 02:34 PM
The last problem I solved with adding "\\" in front of the #. Then I remebered that inside templates you have to use \\ for escape (even when the template, like in this case, is in a separate file)
0
Thomas
Top achievements
Rank 1
answered on 21 Oct 2016, 04:56 PM

Hi,

I solved also the second problem, needed to set @data_bind=start,then the right date/time is set.

So far, I am left with the first problem (from the first post) and this new one:

  when I try to use a tabstrip inside the template I get an error that the template is invalid

 

Regards

0
Thomas
Top achievements
Rank 1
answered on 21 Oct 2016, 08:12 PM

Hi,

one more problem.

When I have a jquery object inside of document.ready in an editortemplate I get an error "Unexpected identifier":

 

$(document).ready(function () {
console.log($("\\#terminpersonenGrid"))
;})
0
Veselin Tsvetanov
Telerik team
answered on 24 Oct 2016, 09:56 AM
Hello Semir,

Answering your initial question, you won't be able to pass only subset of fields for the Scheduler load and the full set of them when you edit an appointment. The reason for that is the fact that the Scheduler uses the same DataSource for both cases, which has one Read action that should return the required information to the Scheduler.

Concerning the last reported issue, I would suggest you to try use the same syntax as in the following Forum post:
jQuery(function() {
    $("\#terminpersonenGrid").kendoRecurrenceEditor();
})

If this does not fix the issue, please, send us a runnable sample, reproducing it. this way we will be able to troubleshoot the problem and provide you with the most appropriate assistance for your case.

Concerning the TabStrip issue, may I ask you to send us your implementation of the Editor template so we will be able to troubleshoot the problem observed?

I am looking forward to hearing from you.

Regards,
Veselin Tsvetanov
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
0
Thomas
Top achievements
Rank 1
answered on 25 Oct 2016, 07:16 AM

Hi Veselin,

I will provide you with the examples tonight.

One more question, how do I bind Grid data to one of my properties. I solved that loading of additional data in that way, that I populate the grids inside the form after it has been shown. Now I have the problem with binding the grid from the template to my actual object. I did it this way:

 

    @(Html.Kendo().Grid<Interfaces.Interfaces.ModelLayer.IImmobilieDTO>()
        .Name("terminimmobilienGrid")
        .Columns(columns =>
        {
            columns.Bound(m => m.ImmobilieId).Hidden();
            columns.Bound(m => m.TitelbildUrl).Width(80).Title("").ClientTemplate("<img class='titelbild' style='max-width:80px;height:auto' src='\\#: TitelbildUrl\\#' onError='showAltImg(this)'/>");
            columns.Bound(m => m.Titel).ClientTemplate("<a href=javascript:personAusGridAnzeigen(this,\\#= ImmobilieId \\#)>\\#= Titel \\#</>"); ;
        })
        .AutoBind(false)
        .DataSource(dataSource => dataSource
            .Ajax()
            .ServerOperation(false)
            .Model(model => model.Id(p => p. ImmobilieId))
            .Read(read => read.Action("ImmobilienFuerTermin", "Termin").Data("terminImmobilienSuchparameter"))
        )
        .Selectable(s=> s.Mode(GridSelectionMode.Single))
        .Events(e=> e.Change("immobilieGridUebersichtAnzeigen"))
        .HtmlAttributes(new { @data_bind = "value:Immobilien" })
)

 

But when I double click on the appointment inside the scheduer I get the error message

Uncaught TypeError: i.value is not a function(…)

 

When I remove

@data_bind=value:Immobilie

 

it works fine, but then when I save the appointment I dont get the data from the grid

Regards

Semir

0
Veselin Tsvetanov
Telerik team
answered on 27 Oct 2016, 06:49 AM
Hello Semir,

I am afraid that I was not able to replicate locally your scenario, as the provided snippet does not give us enough information. As soon as you provide us with the isolated runnable sample, we will be able to troubleshoot all the issues locally and to provide you with further assistance.

Regards,
Veselin Tsvetanov
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
0
Thomas
Top achievements
Rank 1
answered on 31 Oct 2016, 10:29 AM

Hi Veselin,

 

Here is the example application [1].

I have added a tabstrip inside the template so you cant open it when you double click on an appointment.

When you remove the tabstrip you get another error message from the embedded grid inside the template (e.Value is not a function).

When you remove the @data_val="value:Akte" from the Grid you can open the template (but then the data from the grid is not being sent to the server when saving the appointment

 

[1] http://www.filedropper.com/schedulerexample

Regards

Semir

0
Veselin Tsvetanov
Telerik team
answered on 02 Nov 2016, 10:11 AM
Hi Semir,

Thank you for the sample provided. Based on that I was able to reproduce locally the issues discussed.

- Concerning the TabStrip issue, I noticed that it is present when having the Content declared within a  @<text></text>. This is a template escaping issue and makes the template invalid. Therefore, I would suggest you to declare the TabStrip inline and create a Kendo widget for it;

- Concerning the Grid issue, I am afraid that you won't be able to bind the items in the Grid to be sent to the controller, as the Grid does not actually have a data-value, like the input and the select widgets. Therefore, I would suggest you to use a MultiSelect HTML helper instead.

Attached you will find a modified version of the â€‹TerminmaskeTemplate.cshtml.

Regards,
Veselin Tsvetanov
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
0
Thomas
Top achievements
Rank 1
answered on 02 Nov 2016, 11:07 AM

Hi Veselin,

since it is not possible to add the grid data via data_bind, is it somehow possible to add the data manually to the post upon saving the appointment form ?

Regards

Semir

0
Veselin Tsvetanov
Telerik team
answered on 03 Nov 2016, 07:48 AM
Hi Semir,

Yes, this is possible. To do that you should specify a Data JavaScript function, that would add the additional parameters to your AJAX call (Create or / and Update). To achieve that, you could follow the suggestion from the following forum post.

Regards,
Veselin Tsvetanov
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
0
Thomas
Top achievements
Rank 1
answered on 03 Nov 2016, 02:21 PM

Hi Veselin,

but these methods are set from the scheduler is that right ?

I would need to access the grid that I put inside the template, read its datasource and post that data to update/create 

Regards

Semir

0
Veselin Tsvetanov
Telerik team
answered on 04 Nov 2016, 09:18 AM
Hi Semir,

If you configure the Update Action of the Scheduler DataSource in the following way:
.Update(u => u.Action("EditTermin", "Home").Data("dataFunction"))

in the â€‹dataFunction() you could access the elements on the editor template, including the Akte Grid:
function dataFunction(e) {
    var akteGrid = $('#Akte').data('kendoGrid');
}

Regards,
Veselin Tsvetanov
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
0
Thomas
Top achievements
Rank 1
answered on 21 Nov 2016, 11:32 AM

How to make an ajax call from within a template ?

When I do it like this I get an error "Unexpected end of input" when trying to open the template from the scheduler

function loadAdditionData() {
     $.ajax({
            cache: false,
            async: true,
            dataType: "json",
            type: "GET",
            url: "/Termin/Details?terminNumber=6",
            success: function (data) {
                
                log("Termindetails loaded");
                log(data);
            },
            error: function (xhr) {
                log("Termin error");
            }
        });
}

 

0
Thomas
Top achievements
Rank 1
answered on 21 Nov 2016, 12:36 PM

Ah yes, in order to reproduce this error just put the ajax call function inside the ready function of the example I already sent to you

 

Regards

0
Veselin Tsvetanov
Telerik team
answered on 22 Nov 2016, 11:59 AM
Hello Thomas,

Attached you will find a modified version of the â€‹TerminmaskeTemplate.cshtml. You will notice that in the $(document).ready(function () {...}); I call the â€‹loadAdditionData() method. At my end, it successfully makes an AJAX call, which returns 404 Not found error. Here you will find a short video of running the sample.

Does your implementation deffer in some way? Do you observe the same issue after changing your implementation as the one attached?

Regards,
Veselin Tsvetanov
Telerik by Progress
Telerik UI for ASP.NET MVC is ready for Visual Studio 2017 RC! Learn more.
Tags
Scheduler
Asked by
Thomas
Top achievements
Rank 1
Answers by
Thomas
Top achievements
Rank 1
Veselin Tsvetanov
Telerik team
Share this question
or