如何使用devexpress元素正確加載partialview到extjs面板

我想知道是否可以使用devexpress元素的partialview在Extjs面板中正常工作。到目前爲止，我設法將partialview加載到Extjs面板中。所有devexpress控件都以適當的方式呈現，但似乎devexpress的整個客戶端功能已消失 - 對懸停，點擊等沒有反應。以下是我的代碼如何使用devexpress元素正確加載partialview到extjs面板

//loading partialView 
    Ext.getCmp('centerPanel').body.load({ url: 'Home/TempView',scripts:true}) 

//controller 
public class HomeController : Controller 
    { 
     // 
     // GET: /Home/ 

     public ActionResult Index() 
     { 
      return View(); 
     } 

     public PartialViewResult TempView() 
     { 
      return PartialView(); 
     }  

    } 

//TempView 
<div> 
    @Html.Partial("ToolBarView"); 
</div> 


//ToolBarView 
@using DevExpress.Web.Mvc.UI 

@Html.DevExpress().ReportToolbar(settings => { 
    // The following settings are necessary for a Report Toolbar. 
    settings.Name = "ReportToolbar"; 
    settings.ReportViewerName = "reportViewer1"; 
    }).GetHtml()

有沒有什麼辦法讓它工作？這裏是我的應用程序 http://www.sendspace.pl/file/591cd7a07e43f15a22759b2

來源

2012-05-05 John

隨着ExtJS的contentEl屬性您可以在一個面板中的任何內容。

//index.cshtml 
<div id="dxGrid"> 
    @Html.Partial("GridViewPartialView") 
</div> 

//GridViewPartialView.cshtml 
@Html.DevExpress().GridView(settings => 
{ 
    settings.Name = "DevExGrid"; 
    settings.CallbackRouteValues = new { Controller = "Home", Action = "GridViewPartialView" }; 
    settings.Width = System.Web.UI.WebControls.Unit.Percentage(100); 
    settings.ClientSideEvents.EndCallback = "function(s, e) { endSizeGrid(s); }"; 
}).Bind(Model).GetHtml() 

//ExtJS code 
Ext.create('Ext.panel.Panel', { 
    contentEl: 'dxGrid', 
    id: 'gridContainer', 
    title: 'Devexpress inside ExtJS' 
});

請記住，如果調整面板大小，您需要手動調整DevEx網格的大小。您可以通過在面板上使用DevEx控件設置偵聽器來實現此目的。

listeners: { 
    resize: function() { 
     adjustGridSize(this, DevExGrid); 
    } 
}

當你用DevEx控制將調整過互動，這就是爲什麼你需要指定一個名爲EndCallBack clientsideevent。

的縮放功能的實現看起來是這樣的：

function endSizeGrid(sender) { 
     var el = Ext.get("gridContainer"); 
     adjustGridSize(el, sender); 
}; 
function adjustGridSize(aGridPnl, aGridView) { 
    aGridView.SetHeight(aGridPnl.getHeight()); 
    aGridView.SetWidth(aGridPnl.getWidth()); 
};

我希望這會幫助別人。

來源

2012-09-28 12:57:33 A1rPun

如何使用devexpress元素正確加載partialview到extjs面板

回答

相關問題