How to load window content from PartialView

[T]

Hi
I'm using Kendo window in my MVC application. I was wondering if there is any way to fill the content of the window from partialView ?
For example I have a partial view stored in file PartialViewSample.cshtml

@model Product

@using(Html.BeginForm("InsertProduct","Product"))

{

    Html.TextBoxFor(val => val.Name);

    Html.TextBoxFor(val => val.Id);

}

and in some other place I would like to load this content to kendo window.

<button id="addButton">Add</button>

 <script type="text/javascript">

     $(document).ready(function () {

         var window = $("#window").kendoWindow({

             height: "200px",

             modal: true,

             title: "Centered Window",

             visible: false,

             width: "200px"

             

         }).data("kendoWindow");

     });

If the user clicks the button I would like to load content of the window. I was trying to do this that way

    

$("#addButton ").click(function () {

        var window = $("#window").data("kendoWindow");

        window.content("@Html.Partial("PartialViewSample ",new Product()).ToHtmlString()");

        window.center();

        window.open();

    });

Unfortunatelly it doesnt work. Is there any way to load content of the window from using Html.Partial or sth like that ?

[TrentCioran]

The content property will load content sing ajax, you should do this

$("#addButton ").click(function () {

        var window = $("#window").data("kendoWindow");

        window.content("YourController/YourActionReturningThePartialView");

        window.center();

        window.open();

    });

Cheers,

[Alex Gyoshev]

If you want to display static content in the window, by rendering it to the page or from a HTML string, you can do so by:

• setting the content of the element that the window is created from,
  $("#window").html("<p>foo</p>").kendoWindow();
• using the content method after the window has been initialized:
  var dialog = $("#window").data("kendoWindow");
  dialog.content("<p>foo</p>");

If you want to load content in the window dynamically (through AJAX), you can do so by:

• using the content initialization option:
  $("#window").kendoWindow({
      content: {
          url: "/customerDetails",
          data: { customerId: 100 }
       }
  }); 
• using the refresh method after the window has been intialized:
  var dialog = $("#window").data("kendoWindow");
  dialog.refresh({
      url: "/search",
      data: { query: "foobar" }
  }); 
  
  

Regards,
Alex Gyoshev
the Telerik team

[Palani]

Awesome :)
the refresh method is working
thanks

[Ho]

hi Alex Gyoshev
how to get customerID in Controller.
I'm using MVC3

Please help me!!

Thanks

[Holger]

You will just have to add a parameter named "customerId" from type "int" to the controller action method.
The MVC ModelBinder then will automatically put in the matching value from the request.

Regards,
Holger

[Josh]

Initializing data like this does not seem to work in the latest version (2013.1.514):

$("#window").kendoWindow({
    content: {
        url: "/customerDetails",
        data: { customerId: 100 }
     }
}); 

You only have access to the url to pass query string parameters using asp.net mvc 4.

[Daniel]

Hello,

I attached a sample MVC 4 project  that uses the provided code to send a parameter to the controller. At least on my side it is working as expected. Please check it and let me know if I am missing something.

Regards,
Daniel
Telerik

[Josh]

Enable the iframe feature of your window and then observe the behavior.  You will now have to make your parameter null and it is not passed in.

[Daniel]

Hello,

If you are using an iframe then the values should be added as query string parameters to the URL.

Regards,
Daniel
Telerik