Partial Views loaded through ajax request and issues with resource manager

  1. #1

    Partial Views loaded through ajax request and issues with resource manager

    Hi,
    As newbie to ext.net (worked until now with kendo), I'm trying to load partial Views with Ext.net items using
    an ajax request. The view is rendered but I can't resolve the following problems :
    - If the resourceManager is included into the view everything works fine but as I close this view, the boundlist I use remains in the <body>. So as I reload the partial View I have multiple boundlist with same id and nothing works.
    - If the resource manager is placed in the body, nothing works.

    The PartialView is rendered as PartialViewResult and contains multiple Html.RenderPartial and those work fine with the resource manager (if it's placed in the partial View), but the partial View itself is loaded through an ajax request and it can't be different because action changes...
    Am I missing something ?

    The ajax request :
    $.ajax({
                type: "POST",
                url: action,  // action is variable 
                async: true,
                cache: false,
                beforeSend: function () {
                    $("#etat_window").data("kendoWindow").open().center().toFront();
                    $("#etat_window").data("kendoWindow").content("<div style=\"text-align:center\"><img src='/Images/22x22/loading.gif' style=\"padding-right:3px\" width=\"15\" height=\"15\"></div>");
                },
                success: function (data) {
                    $("#etat_window").empty();
                    $("#etat_window").data("kendoWindow").content($(data));
                }
            });
    The Partial View requested through the ajax call looks like:
    <div>
            @Html.X().ResourceManager().CleanResourceUrl(false)
            @Html.RenderPartial("Ext_date_picker"); 
            @Html.RenderPartial("Ext_combobox");
    </div>
    Thanks for any help.
  2. #2
    Please provide runable test case
    Vladimir Shcheglov
    Sr. Developer
  3. #3
    Quote Originally Posted by Vladimir View Post
    Please provide runable test case
    Here an easy example to show the problem:

    A PartialView called PartialTest
    <span>Partial View with Ext content</span> <br />
    <span>Now Select date with calendar and reload partial view with button</span>
            @Html.X().ResourceManager().CleanResourceUrl(false)
    @(Html.X().DateField().ID("defaulttimext")
            .SelectedDate(DateTime.Now)
            )
    The corresponding action:
     public PartialViewResult PartialTest() {
                return PartialView();
            }
    And finally the additional data to place in the view you want to render partialview into:
    <input type="button" value="Add / reload Ext partialview" onclick="addExttopage()" />
    <div id="ext_div"></div>
    <script type="text/javascript">
    
        // function called to add / replace the div with the same view, 
        // the action is variable and cannot be called by Html.RenderPartial
    
                function addExttopage() {
                    var action = "Home/PartialTest" // hard coded for the example
                    $.ajax({
                        type: "POST",
                        url: action,
                        async: true,
                        cache: false,
                        success: function (data) {
                            $("#ext_div").empty();
                            $(data).appendTo("#ext_div");
                        }
                    });
                }
            </script>
    Then you choose a date with calendar, reload the partialview with the button and select the date again with the calendar => bug due to multiple datepicker data in view.
    But if you place resource manager in body, it says resourcemanager is not defined.
  4. #4
    Please see how to render Ext.Net partial view
    http://mvc.ext.net/#/Dynamic_Partial_Rendering/Add_Tab/

    - you have to use Ext.Net.MVC.PartialViewResult
    - you have to initiate request via DirectEvent of any widget or use
    Ext.net.directRequest({
        url: "...",
        extraParams : {
              containerId: "..."
        }
    });
    Vladimir Shcheglov
    Sr. Developer
  5. #5
    or use
    Ext.net.directRequest({
        url: "...",
        extraParams : {
              containerId: "..."
        }
    });
    Seems interesting and I'm able to call Action which returns PartialView but I can't find any documentation about
    this javascript function (Ext.Net.DirectRequest),
    So, a few question remain :
    How Handle success ?
    How to return PartialView ?
    How to place in current View ?

    Thanks for answering.

Similar Threads

  1. [CLOSED] request resource via ajax call. Version 1.x
    By thchuong in forum 2.x Premium Help
    Replies: 24
    Last Post: Jan 04, 2013, 2:19 PM
  2. Replies: 4
    Last Post: Aug 29, 2011, 6:46 PM
  3. Script Manager and Resource Manager Conflict
    By EugeneNiemand in forum 1.x Help
    Replies: 6
    Last Post: Jun 20, 2011, 7:34 AM
  4. Replies: 5
    Last Post: Oct 26, 2010, 2:20 PM
  5. Replies: 4
    Last Post: Sep 22, 2010, 7:43 AM

Tags for this Thread

Posting Permissions