`
forestkqq
  • 浏览: 210347 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
社区版块
存档分类
最新评论

UI Dialog 中使用 AJAX 装载内容

阅读更多

如何在显示 jQuery UI Dialog 中,以 ajax 方式调入 dialog 中显示的内容呢?

 

一种格式是:

 

	$("#myDialog").load( openUrl, postData ,
		function (responseText, textStatus, XMLHttpRequest) {
			$("#myDialog").dialog('open');	// 打开对话框
		}
	);


 

另一种 ajax 调用格式则是:

	$.ajax({ type: "POST", url: openUrl , data: jsonPostData, 
		success: function(html,textStatus, XMLHttpRequest){
			$("#myDialog").html(html).dialog('open');	
		}
	});
 

其实,这只是jQuery 的 ajax 调用的两种方式,与 dialog 无关。

 

至于 dialog 的初始化工作,则需要在之前进行,比如:

 

		jqDialog.dialog({
			bgiframe: true,
			autoOpen: false,
			resizable: false,
			width:650,	Height:500,
			modal: true,
			overlay: {	backgroundColor: '#000', opacity: 0.5	},
			close: function() {	...  },
			open:  function() {	 ... },
			buttons: {
				'选定当前记录': function() {... },
				'取消': function() { 
					$(this).dialog('close');
				}
			}
		});
 

 

 

 

可参考:

 

jquery-ui dialog with ajax how to avoid a common error

 

JQuery.UI Dialog & $().load() & JavaScript

 

 

分享到:
评论

相关推荐

    jquery ui dialog 扩展

    这篇内容将深入探讨jQuery UI Dialog的扩展,包括如何自定义行为、增强功能以及与其他技术(如Ajax)的集成。 首先,Dialog是jQuery UI库中的一个核心组件,它基于jQuery框架,提供了一种优雅的方式来创建可交互的...

    jquery ui中的dialog

    **jQuery UI中的Dialog组件** jQuery UI是一个功能丰富的JavaScript库,它提供了许多用户界面元素,如对话框(Dialog)、拖放(Draggable)、可排序(Sortable)等。在这些元素中,Dialog是创建弹出式窗口或模拟...

    JQuery UI Dialog使用样例

    在本篇文章中,我们将深入探讨如何使用 jQuery UI 实现 Dialog,并通过实例来展示其用法。 1. **引入 jQuery 和 jQuery UI** 在使用 Dialog 之前,确保你的页面已经引入了 jQuery 和 jQuery UI 的 CSS 和 JS 文件...

    jq ui dialog 示例

    jq ui dialog 示例jq ui dialog 示例漂亮哦.可以比美EXT哦.喜欢的同学们快来

    jquery ui Dialog 添加最大最小化按钮控制

    在IT领域,jQuery UI是一个非常流行的前端开发库,它提供了许多可交互的用户界面组件,如Dialog(对话框)就是其中之一。"jquery ui Dialog 添加最大最小化按钮控制"的主题涉及如何扩展jQuery UI Dialog的功能,使其...

    jQuery UI dialog 的使用

    这里的`jquery.ui.all.css`文件引用了jQuery UI中`development-bundle/themes/base`文件夹下的所有样式文件。样式文件是展示dialog组件外观的关键,它定义了按钮、窗口、阴影等元素的样式。 在准备好环境后,我们...

    JQuery UI Dialog

    在本文中,我们将详细介绍 JQuery UI Dialog 的一些重要属性和方法,并提供实践中常见的应用场景。 一、autoOpen 属性 autoOpen 属性用于设置对话框是否在页面加载完成后自动打开。如果将其设置为 true,那么...

    Android-dialog库可以在任意类内调用子线程或ui线程内均可显示

    标题提到的“Android-dialog库”是Android开发中的一个第三方库,它提供了一种灵活的方式,使得开发者能够在任意类中方便地调用Dialog,并且支持在子线程或UI线程内显示,这极大地提高了代码的可复用性和执行效率。...

    jqueryUI_dialog实例

    总结来说,"jqueryUI_dialog实例"主要涉及了如何使用jQuery UI库中的Dialog组件创建交互式的对话框,并通过添加按钮和配置参数来实现特定的功能。掌握这些知识,能够帮助开发者构建更具有吸引力和用户体验友好的Web...

    jquery-ui-dialog-demo

    总的来说,`jquery-ui-dialog-demo` 提供了一个很好的起点,帮助开发者快速理解和使用 jQuery UI 的 Dialog 组件,以增强网页的交互性和用户体验。通过深入学习和实践,开发者可以利用 Dialog 实现更多创新的功能。

    Jquery UI dialog 详解 (弹出层)

    Jquery UI Dialog 是 jQuery UI 库中的一个重要组件,它提供了一个简洁而强大的界面来创建对话框或者弹出层。通过简单的配置和使用,开发人员可以轻松地集成各种交互式的弹出窗口到他们的网站或应用中。本文档将详细...

    jQuery_UI全教程之一(dialog的使用教程).

    2. `demos.css`:jQuery UI演示中使用的额外CSS样式,非必需,可根据需要引入。 3. `jquery-1.4.4.min.js`:jQuery的核心库,所有jQuery UI的功能都依赖于它。 4. `jquery-ui-1.8.7.custom.min.js`:jQuery UI的核心...

    WEBUI--Dialog

    下面我们将深入探讨关于WEBUI中的Dialog设计和实现的相关知识点。 一、Dialog类型 1. 模态对话框(Modal Dialogs):模态对话框在打开时会阻止用户与页面其余部分的交互,直到对话框关闭。这确保了用户专注于当前的...

    jquery.ui.dialog

    里面是经过修改的jquery.ui.dialog.js(版本jQuery UI Dialog 1.8.12),添加了parentElement: 'body',详情查看http://forum.jquery.com/topic/dialog-will-move-its-div-tag-to-body

    Jquery_ui的dialog使用文档概述

    ### Jquery UI 的 Dialog 使用详解 #### 概述 Jquery UI 的 `Dialog` 是一个非常实用且功能丰富的用户界面组件,它可以帮助开发者快速创建一个浮动的窗口,该窗口包括标题和内容两个主要部分。此外,`Dialog` 组件...

    jqueryUI插件中Dialog的运用

    Dialog组件是jQuery UI中的一个核心功能,用于创建模态或非模态的对话框,能够帮助开发者构建更加交互友好的Web应用。在本文中,我们将深入探讨jQuery UI Dialog的运用。 **1. 安装与引入** 在使用jQuery UI ...

    AjaxForm_JqueryUI例子

    在这个例子中,它们被结合起来,创建了一个利用AJAX更新页面内容,并通过JqueryUI Dialog展示的交互体验。 首先,让我们详细了解每个组件: 1. **AjaxForm**:这是一个jQuery插件,它允许表单以AJAX方式提交,即在...

    实现组件可多拽功能:Vue + Element-ui Dialog

    在本文中,我们将深入探讨如何使用Vue.js框架与Element-ui库来实现一个具有拖放功能的Dialog组件。Element-ui是一个流行的UI组件库,为Vue.js提供了丰富的预设组件,包括Dialog对话框。Vue.js的自定义指令机制允许...

    AjaxForm_JqueryUI

    在Web开发领域,AjaxForm与JqueryUI Dialog的结合使用是一种常见的增强用户体验的技术。这个名为"AjaxForm_JqueryUI"的示例项目很显然是为了演示如何将这两种技术整合在一起,以便在不刷新整个页面的情况下,实现...

    jQuery easy-ui 富客户端AJAX框架

    1. **组件丰富**:Easy-UI 提供了多种用户界面组件,如对话框(dialog)、表单(form)、面板(panel)、菜单(menu)、下拉选择框(combobox)、树形控件(tree)、表格(datagrid)等,满足开发各种复杂页面的需求...

Global site tag (gtag.js) - Google Analytics