ASP.NET AJAX всплывает на странице в виде модального окна

я хочу добавить данные в БД, используя модальное всплывающее окно страницы .aspx.

поэтому у меня есть сетка с некоторыми данными таблицы SQL о сотрудниках. я хочу, чтобы где-то на этой странице была кнопка или ссылка, чтобы пользователи могли добавлять записи в БД, а затем обновлять сетку, чтобы отображать новые данные.

у меня есть addEmployee.aspx, который я хочу открыть в модальном окне (и затемнить базовую страницу, как я вижу на некоторых сайтах), что позволяет пользователям вводить данные и сохранять их в БД в addEmployee.aspx. на этой странице есть вся логика sql и проверки, инкапсулированная для этой работы. когда добавление завершено, я хочу предупредить пользователя, что оно ушло (вероятно, лучше всего после закрытия всплывающего окна и отображения сообщения на главной странице, также я хочу обновить информацию о сетке данных из БД, чтобы она отражала новые добавлена ​​запись.

может ли кто-нибудь указать мне направление, чтобы получить этот тип функциональности без необходимости писать код в течение нескольких недель, чтобы получить его.

если у вас есть лучшее решение, я весь внимание !!!

Спасибо


c# jquery asp.net asp.net-ajax
person kacalapy    schedule 11.08.2010    source источник

Ответы (3)


arrow_upward
1
arrow_downward

Если вместо этого вы можете инкапсулировать функциональность addEmployee.aspx в пользовательский элемент управления, вы можете добавить этот пользовательский элемент управления (addEmployee.ascx) на страницу с сеткой (например, viewEmployee.aspx).

Затем, используя расширитель модального всплывающего окна (в случае, если вы используете набор инструментов управления ajax), вы можете показать этот элемент управления addEmployee.ascx, в котором у пользователя есть кнопка сохранения с соответствующей логикой для добавления сотрудника.

Кроме того, если вы используете панели обновлений (опять же в случае набора инструментов управления ajax), вы выполняете listofEmployeeUpdatePanel.Update(), который обновляет список элементов в сетке.

Вот как я сейчас реализую очень похожий вариант использования в своем текущем приложении.

Один из недостатков этого подхода: пользовательский элемент управления addEmployee.ascx является частью исходной страницы и увеличивает размер независимо от того, используется он или нет.

person Jagmag    schedule 11.08.2010

arrow_upward
0
arrow_downward

в вашем случае вы можете использовать плагин jquery facebox, чтобы показать модальное всплывающее окно, или вы также можете обратиться к прототипу javascript, который очень гибкий и простой в использовании.

Для фейсбокса фейсбокс позволяет отображать iframe как модальное всплывающее окно. так что вы можете поместить свою ссылку в iframe. Альтернативой «facebox» является «fancybox» с приятным графическим интерфейсом. Это работает фантастически, потому что я использовал его раньше.

Надеюсь, что это поможет вам.

person mehul9595    schedule 11.08.2010
comment
позволит ли упаковка каждой из моих 8 сеток внутри панелей обновления обновить сетку частиц, когда модальное окно будет завершено? поэтому, когда вы находитесь на вкладке «Риск» и нажимаете «Изменить» в сетке рисков для определенной строки, вы получаете всплывающее окно пользовательского элемента управления для редактирования этих данных риска... когда вы закончите, вы либо удалите запись, либо обновите ее, и появится всплывающее окно. - закрыто. это должно обновить данные таблицы рисков. панель обновлений сможет это сделать? как это будет срабатывать для этого? Будут ли обновлены остальные, потому что я не хочу, чтобы все 8 обновлялись, поскольку нужно обновить только один? - person kacalapy; 11.08.2010
comment
С updatePanels вы можете использовать соответствующую комбинацию атрибутов UpdateMode = Conditional и ChildrenAsTriggers = false (зависит от того, как вы структурируете свой пользовательский интерфейс и соответствующие ему панели обновлений), чтобы гарантировать, что updatePanels не все обновляются. На самом деле вы можете явно убедиться, что только updatePanel, который вы хотите обновить, действительно обновлен, вызвав updatePanelInstance.Update() для updatePanel, который вы хотите обновить. - person Jagmag; 11.08.2010
comment
где я могу посмотреть пример кода для этого материала? также не должны ли все панели загружаться вместе со страницей и создавать одну большую, огромную тяжелую страницу? Я стремлюсь вывести внешние страницы в модальное окно, чтобы я мог отделить каждый элемент, редактировать пользовательский интерфейс и логику. - person kacalapy; 11.08.2010

arrow_upward
0
arrow_downward

Вы можете поместить IFrame в свое модальное окно, указывающее на addEmployee.aspx. Затем добавьте скрытую кнопку на главную страницу, например:

<div style="visibility: hidden; display: none;">
    <asp:Button ID="btnHidden" runat="server" />
</div>

Добавьте Cick даже к скрытой кнопке, которая должна содержать код для обновления вашей сетки:

protected void btnHidden_Click(object sender, EventArgs e)
{
  //Hidden button was clicked.  Update grid.
}

Затем в событии щелчка «Добавить» в addEmployee.aspx добавьте код, сообщающий главной странице об отправке и обновлении сетки:

  private void SubmitParentPage()
    {
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), "submitHiddenButton", "window.parent.submitHiddenButton();", true);
    }

Вот функция javascript, которая вызывается на главной странице:

function submitHiddenButton() {
    var btn = $get('<%= btnHidden.ClientID %>');
    btn.click();
}
person Jemes    schedule 18.08.2010