Добавление элемента управления ASP.net в JQuery Dialog не отображается правильно - PullRequest
0 голосов
/ 14 октября 2011

Здравствуйте, я видел довольно много похожих вопросов, но все они были решены путем добавления диалога обратно в основную форму страницы.Это не решает следующую проблему:

В моем файле Aspx я определил сегмент кода следующим образом:

    <asp:UpdatePanel runat="server" ID="RadAjaxPanel2" UpdateMode="always">
        <ContentTemplate>
            <div id="areaFilterDialog" runat="server">
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>

, и у меня есть следующий javascript / jqueryчтобы инициализировать диалог

 $("#areaFilterDialog").dialog({
                    bgiframe: true,
                    autoOpen: false,
                    resizable: false,
                    modal: true,
                    draggable: true,
                    closeOnEscape: true,
                    width: 630,
                    open: function (type, data) {
                        dialogOpen = true;
                        $(this).parent().appendTo("form");
                    }
                });
        });

, который добавляет элемент диалога в форму на родительской странице.

В файле .cs я добавляю содержимое в элемент следующим образом:

var departmentCode = e.DepartmentCode;
var summaryType = e.SummaryType;
var summaryCode = e.SummaryCode;
var totalName = e.TotalName;
var view = this.TemplateControl.LoadControl(".\\WebControls\\FilteredAreaRadGrid.ascx") as FilteredAreaRadGrid;

using (var businessManager = new BusinessManager(new DALConnection(this.DalConnectionString)))
{
       view.DataSource = businessManager.GetData(departmentCode, summaryType, summaryCode, string.Empty);
       this.AreaFilterDialog.Controls.Add(view);
}

и я показываю диалог JQuery UI, регистрируя следующий скрипт запуска с помощью ScriptManager:

 var script = string.Format("ShowAttendanceFilterPopup('{0}');", totalName);
 ScriptManager.RegisterStartupScript(
      this.Page,
      this.Page.GetType(),
      "tmp",
      string.Format("<script type='text/javascript'>{0}</script>", script),
      false);

, который вызывает следующий javascript / jquery:

function ShowAttendanceFilterPopup(summaryName) {
    $("#areaFilterDialog").data('title.dialog', summaryName);
    $('#areaFilterDialog').dialog("open");
    $('#areaFilterDialog').dialog("enable");
}

Проблема в том, что HTML, который должен был быть добавлен в диалоговое окно, на самом деле просто добавляется в верхнюю часть страницы, а диалоговое окно вообще не отображается.Если я не добавляю элемент управления в диалоговое окно, прежде чем я его показываю, диалоговое окно отображается правильно.

Я пробовал это с тем, что я добавляю в настоящее время, то есть UserControl, содержащийTelerik RadGrid, но также со стандартной кнопкой asp, и оба имеют одинаковое поведение.

Кто-нибудь получил какие-либо идеи о том, что я делаю неправильно или даже лучше, решение этой проблемы?

Большое спасибо,

Роб

1 Ответ

1 голос
/ 14 октября 2011

Возможно, попробуйте:

<div id="areaFilterDialog">
    <asp:UpdatePanel runat="server" ID="RadAjaxPanel2" UpdateMode="always">
        <ContentTemplate></ContentTemplate>
    </asp:UpdatePanel>
</div>

Я не использовал Telerik Ajax Panels, но я предполагаю что-то вроде:

using (var businessManager = new BusinessManager(new DALConnection(this.DalConnectionString)))
{
       view.DataSource = businessManager.GetData(departmentCode, summaryType, summaryCode, string.Empty);
       RadAjaxPanel2.Controls.Add(view);
}

Мне кажется, что div внутри AjaxPanel ContentTemplate и добавление в него элемента управления view просто не подходит.

...