DevExpress CallbackPanel PerformCallback freezes when content includes a PageControl or TabControl parameter

Question

I would like to update the tabs in my TabControl on demand when a separate client action occurs on the page. I put the TabControl extension (also the tested PageControl) in the CallbackPanel, and the EndCallBack event never fires. If the ShowLoadingPanel parameter is set to true, you will see that the call hangs because the download bar never disappears. Both OnBeginCallback and the actual action of the controller callback are performed. I suppose there are some conflicting callbacks between the panel and the tabs, but I cannot figure out how to resolve it. If I replaced TabControl with basic html or other simpler DevExpress controls, everything would be fine.

TabControl Partial (CallbackTestPageControl.cshtml):

@Html.DevExpress().TabControl(settings => { settings.Name = "testTabControl"; settings.Width = Unit.Percentage(100); settings.Tabs.Add("tab 1"); settings.Tabs.Add("tab 2"); settings.Tabs.Add("tab 3"); }).GetHtml() 

Partial Panels (CallbackTestPanel.cshtml):

 @Html.DevExpress().CallbackPanel(settings => { settings.Name = "cbpTabStrip"; settings.CallbackRouteValues = new { Controller = "Home", Action = "CallbackTestPanel" }; settings.ClientSideEvents.BeginCallback = "OnBeginCallback"; settings.ClientSideEvents.EndCallback = "OnEndCallback"; settings.SetContent(() => Html.RenderPartial("CallbackTestPageControl")); }).GetHtml() 

View (CallbackTest.cshtml):

 <script type="text/javascript"> var testId = null; function ButtonClicked(s, e) { alert('click'); testId = 1; if (!cbpTabStrip.InCallback()) cbpTabStrip.PerformCallback(); } function OnBeginCallback(s, e) { alert('begin'); e.customArgs["Id"] = testId; testId = null; } function OnEndCallback(s, e) { alert('end'); if (testId != null) cbpTabStrip.PerformCallback(); } </script> @Html.DevExpress().Button(settings => { settings.Name = "CallbackButton"; settings.Text = "Callback"; settings.ClientSideEvents.Click = "ButtonClicked"; }).GetHtml() @Html.Partial("CallbackTestPanel") 

Controller (HomeController.cs):

 public ActionResult CallbackTest() { return View(); } public ActionResult CallbackTestPanel() { int id = !String.IsNullOrEmpty(Request.Params["Id"]) ? int.Parse(Request.Params["Id"]) : 0; return PartialView("CallbackTestPanel"); } 

ADDITIONAL INFORMATION . In addition, I tried updating the DevExpress configuration in web.config based on other suggestions on the Internet. In particular, updating the enableResourceMerging attribute for a compression element to false, not true. This seems to have allowed the interruption to end intermittently. I really don't want to disable resource merging, so I'm really glad that this did not provide a reliable solution. So this is what I have now:

 <devExpress> <themes enableThemesAssembly="true" styleSheetTheme="" theme="Office2010Silver" /> <compression enableHtmlCompression="true" enableCallbackCompression="true" enableResourceCompression="true" enableResourceMerging="true" /> <settings rightToLeft="false" /> <errors callbackErrorRedirectUrl="" /> </devExpress> 

Answer 1

Sorry if I took the time to do this. In the end, the problem was that I had all of my scripts other than DevExpress at the bottom of my layout. I needed to move jQuery to the head before DevExpress scripts. Oddly enough, everything else worked perfectly up to this point. Thanks to everyone who tried to reproduce.

Answer 2

I know this is old, but my problem is that I turned on caching of this form, i.e.

As soon as I deleted everything that worked. Hope this helps someone else in the future.