Cascading window and parameter

[Regis]

Hello,

I am currently working on a View with multiple window.

In the main window, I have a grid of data. 
In this screen I have a button used to add a new entry in my database. 

Once pushed button, a window opens for first start creating the folder that will be in several stage but in the same view. The more steps are done through multiple windows in the same view. 

So my problem is that I would pass the ID of the file created after the first window in the other window without reloading the page / view from each window opening. 

Here's how I did for the moment :

<button class="k-button k-button-icontext pull-left" id="CreateFolder">@Resources.Add</button>

 

@(Html.Kendo().Grid<Data.Models.Folder>()
.Name("Table")
.Columns(columns =>
 {
columns.Bound(c => c.ShopName);
columns.Bound(c => c.SaleDate).Format(Resources.FormatDate);
columns.Bound(c => c.folderStatusTitle);
columns.Bound(c => c.CustomerFullName);
                   })
                    .Pageable(pageable => pageable
                    .Refresh(true)
                    .PageSizes(true)
                    .ButtonCount(5))
                    .Groupable()
                    .Filterable()
                    .Reorderable(r => r.Columns(true))
                    .Sortable()
                    .ColumnMenu()
                    .Resizable(r => r.Columns(true))
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(10)
                        .ServerOperation(true)
                        .Model(model => model.Id(p => p.FolderID))
                        .Read(read => read.Action("FolderList", "Folder"))
                        .Destroy("DeleteFolder", "Folder")
                    )
            )

@{
    Html.Kendo().Window().Name("Create")
   .Title("createcustomer")
   .Visible(false)
   .Modal(true)
   .Resizable()
   .Draggable(true)
   .Width(600)
   .Content(() =>
   {
       @Html.RenderAction("Create");
   })
   .Render();
}

<script>
$("#CreateFolder").click(function (e) {
            e.preventDefault();
            var wnd = $("#Create").data("kendoWindow");
            wnd.center().open();
        });
</script>

This is the first step. With this I can open the first window without problem. And associate my customer to a new folder. 
I associate my client through a grid, where I get the customer ID in javascript and returns it in my controller.

Here are the grid and controller :

@(Html.Kendo().Grid<Data.Models.CreateCustomer>()
.Name("TableCustomer")
.Columns(columns =>
{
columns.Bound(c => c.LastName).Title(Resources.HeaderGridCustomerLastname);
columns.Bound(c => c.FirstName).Title(Resources.HeaderGridCustomerFirstname);
columns.Bound(c => c.Address).Title(Resources.HeaderGridCustomerAddress);
})
                    .Events(events => events.Change("onChanges"))
                    .Pageable(pageable => pageable
                    .Refresh(true)
                    .PageSizes(true)
                    .ButtonCount(5))
                    .Selectable(selectable => selectable
                    .Mode(GridSelectionMode.Single))
                    .Filterable()
                    .Reorderable(r => r.Columns(true))
                    .Sortable()
                    .ColumnMenu()
                    .Resizable(r => r.Columns(true))
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(10)
                        .ServerOperation(true)
                        .Model(model => model.Id(p => p.CustomerID))
                        .Read(read => read.Action("CustomerList", "Customer"))
                        .Events(events => events.Change("onDataChange"))
                    )
        )

My controller :


[HttpPost]

public ActionResult CreateCustomer([DataSourceRequest]DataSourceRequest request, Folder folder)

        {

            using (LSContext db = new LSContext())

            {

                if (ModelState.IsValid)

                {

                    var entity = new Customer

                    {

                        LastName = customer.LastName,

                        FirstName = customer.FirstName,

                        Address = customer.Address,

                    };

 

                    db.Customers.Add(entity);

                    //Insert the entity in the database

                    db.SaveChanges();

 

                    var folders = new Folder

                    {

                        CompanyID = Convert.ToInt32(UserCompanyID),

                        CustomerID = entity.CustomerID

                    };

 

                    db.Folders.Add(folders);

                    db.SaveChanges();
                          TempData["FolderID"] = folders.FolderID;


                }

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

            }

}

Then comes my problem.

We are still in the same view. Once I send the form used to close the first window open and my second this piece of javascript:

<script>
$(document).ready(function () {
                $(function () {
                    var Isvalid = false;
                    $("form").kendoValidator({
                        validate: function (event) {
                            var validatation = event.valid;
                            //alert(event.valid);
                            Isvalid = true;
                        }
                    });

                    $('form').submit(function (e) {
                        var wnd = $("#Create-Customer").data("kendoWindow");
                        var wndCreate = $("#Create").data("kendoWindow");
                        e.preventDefault();
                        if (Isvalid == true) {
                            $.post(this.action, $(this).serialize(), function (response) {
                                if (response.error) {
                                    alert(response.error);
                                }
                                else {
                                    var wndFolder = $("#Address-Folder");
                                    wndFolder.kendoWindow({
                                        Name: "Address-Folder",
                                        modal: true,
                                        resizable:true,
                                        width: "600px",
                                        visible: false,
                                        actions: ["Minimize", "Maximize"],
                                        title: "@Resources.AddressFolder",
                                        content: "Folder/AddressFolder/",
                                    });


                                    wnd.close();
                                    wndCreate.close();
                                    wndFolder.data("kendoWindow").refresh({
                                        url: "Folder/AddressFolder/@TempData["FolderID"]",

                                    });
                                    wndFolder.data("kendoWindow").open();
                                    wndFolder.data("kendoWindow").center();
                                }
                            }, 'json');
                        }
                    });
                });
            });
</script>

My idea is that once the saved folder, I would like to get its ID to open my second window with information about it. That's why I use TempData. But the window is set to the opening of the frame. I want it to be created and initialized after the form validation. But for now, despite the conditions javascript code, the window is initialized at the openning of the view.

I try to refresh the view, but nothing works for now.

Can you told me if this is possible ? Or how can I pass the ID on different Window. 

Sorry for this long post and sorry for my english.

If it is not very clear or precise, I'm sorry and I wish I brought more accuracy

Best Regards,

[Dimo]

Hello Regis,

If I understand you correctly, the problem is related to the initialization timing of the "#Address-Folder" Window widget. However, the initialization appears to depend solely on custom code and event handlers, so the issue does not seem to be related to Kendo UI. Please debug the Javascript to find out why the initialization (i.e. the $.post) occurs earlier than expected and let me know if you need additional information with regard to Kendo UI.

In general, it is possible to pass data from one Window widget and use it in another Window widget.

Regards,
Dimo
Telerik