jQWidgets jqxScheduler endAppointmentsUpdate()方法

以下是关于 jQWidgets jqxScheduler endAppointmentsUpdate() 方法的详细攻略。

jQWidgets jqxScheduler endAppointmentsUpdate() 方法

jQWidgets jqxScheduler 的 endAppointmentsUpdate() 方法用于对预约的更新操作。

语法

$('#scheduler').jqxScheduler('endAppointmentsUpdate');

示例

以下两个示例演示了如何使用 endAppointmentsUpdate() 方法。

示例 1

$('#scheduler').jqxScheduler('beginAppointmentsUpdate');
// 更新预约
$('#scheduler').jqxScheduler('endAppointmentsUpdate');

在示例 1 中,我们使用 beginAppointmentsUpdate() 方法开始对预约的更新操作,然后更新预约,最后使用 endAppointmentsUpdate() 方法结束对预约的更新操作。

示例 2

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>jQxScheduler End Appointments Update Method</title>
    <link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/jqx.scheduler.css" type="text/css" />
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jquery-3.5.1.min.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxcore.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxbuttons.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxscrollbar.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxmenu.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxcalendar.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxdatetimeinput.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxtooltip.js"></script>
    <script type="text/javascript" src="https://jqwidgets.com/public/jqwidgets/scripts/jqxscheduler.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var appointments = [
                {
                    id: 'id1',
                    description: 'Meeting with John',
                    location: 'Room 101',
                    subject: 'Meeting',
                    calendar: 'Room 101',
                    start: new Date(2023, 4, 15, 9, 0, 0),
                    end: new Date(2023, 4, 15, 10, 0, 0)
                },
                {
                    id: 'id2',
                    description: 'Lunch with Mary',
                    location: 'Cafeteria',
                    subject: 'Lunch',
                    calendar: 'Cafeteria',
                    start: new Date(2023, 4, 15, 12, 0, 0),
                    end: new Date(2023, 4, 15, 13, 0, 0)
                }
            ];

            $('#scheduler').jqxScheduler({
                date: new Date(2023, 4, 15),
                width: 800,
                height: 600,
                source: new $.jqx.dataAdapter({
                    datafields: [
                        { name: 'id', type: 'string' },
                        { name: 'description', type: 'string' },
                        { name: 'location', type: 'string' },
                        { name: 'subject', type: 'string' },
                        { name: 'calendar', type: 'string' },
                        { name: 'start', type: 'date' },
                        { name: 'end', type: 'date' }
                    ],
                    localdata: appointments
                }),
                view: 'weekView',
                appointmentDataFields: {
                    from: 'start',
                    to: 'end',
                    id: 'id',
                    description: 'description',
                    location: 'location',
                    subject: 'subject',
                    resourceId: 'calendar'
                },
                resources:
                {
                    colorScheme: 'scheme05',
                    dataField: 'calendar',
                    source: new $.jqx.dataAdapter({
                        datafields: [
                            { name: 'calendar', type: 'string' },
                            { name: 'calendarColor', type: 'string' }
                        ],
                        localdata: [
                            { calendar: 'Room 101', calendarColor: '#F6B26B' },
                            { calendar: 'Cafeteria', calendarColor: '#93C47D' }
                        ]
                    }),
                    view: 'weekView',
                    showDefaultItem: false
                }
            });

            $('#updateButton').click(function () {
                $('#scheduler').jqxScheduler('beginAppointmentsUpdate');
                // 更新预约
                $('#scheduler').jqxScheduler('endAppointmentsUpdate');
            });
        });
    </script>
</head>
<body>
    <div id="scheduler"></div>
    <button id="updateButton">Update Appointments</button>
</body>
</html>

在示例 2 中,我们创建了一个 jqxScheduler 组件,并在页面上添加了一个按钮。当用户单击按钮时,我们使用 beginAppointmentsUpdate() 方法开始对预的更新操作,然后更新预约,最后使用 endAppointmentsUpdate() 方法结束对预约的更新操作。

注意事项

  • endAppointmentsUpdate() 方法用于结束对预约的更新操作。
  • endAppointmentsUpdate() 方法必须与 beginointmentsUpdate() 方法一起使用。
  • endAppointmentsUpdate() 方法可以与 jqxScheduler 方法一起使用。

总之,endAppointmentsUpdate() 方法用于结束对预约的更新。以上两个示例演示了如何使用 endAppointmentsUpdate 方法。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:jQWidgets jqxScheduler endAppointmentsUpdate()方法 - Python技术站

(0)
上一篇 2023年5月12日
下一篇 2023年5月12日

相关文章

  • jQuery UI按钮类选项

    jQuery UI的按钮小部件提供了许多选项,可以自定义按钮的外观和行为。其中,buttonClasses选项用于指定按钮使用的CSS类。本文将详细介绍buttonClasses选项的语法用法,并提供两个示例说明。 语法 以下是buttonClasses选项的基本法: $(selector).button({ buttonClasses: { "c…

    jquery 2023年5月9日
    00
  • 如何使用jQuery Mobile创建一个数字输入

    当我们需要在移动端创建一个数字输入框时,使用jQuery Mobile是一个不错的选择。本文将带你了解如何使用jQuery Mobile创建数字输入框,并提供两个示例,向你展示如何在不同场景下应用这个功能。 创建数字输入框 要在jQuery Mobile中创建数字输入框,我们需要使用<input>元素,并把类型设置为number。接下来,我们需要…

    jquery 2023年5月12日
    00
  • 浅谈iOS 关于小数精确计算(NSDecimalNumber)

    浅谈iOS 关于小数精确计算(NSDecimalNumber) 在iOS开发中,对于小数精确计算,我们常常会使用NSDecimalNumber类进行处理。它能够避免在使用float和double等浮点数类型时出现精度丢失的情况,确保计算结果的准确性。 为什么需要小数精确计算 在计算机处理小数时,大多数情况下都采用了浮点计算(Floating-point ar…

    jquery 2023年5月27日
    00
  • jQuery实现的简单排序功能示例【冒泡排序】

    首先,需要明确的是,该攻略是针对“jQuery实现的简单排序功能示例【冒泡排序】”这个主题而言的。其内容需要包含如下几个方面的内容: 问题的引入:首先,需要引入“jQuery实现的简单排序功能示例【冒泡排序】”这个话题,给读者一个大致的了解。 具体实现过程:其次,需要详细地介绍冒泡排序的实现过程,包括具体的步骤,并且用代码演示效果。 jQuery代码实现:在…

    jquery 2023年5月28日
    00
  • jQuery源码分析之Event事件分析

    下面我将详细讲解“jQuery源码分析之Event事件分析”的完整攻略。 概述 jQuery是一个开源的JavaScript库,提供了大量的方法和函数,简化了JavaScript在网页中处理操作的难度。Event事件是jQuery中的一个重要的模块,提供了对DOM元素事件进行绑定和解绑的方法,使得页面交互更加丰富。本攻略将对jQuery中的Event事件模块…

    jquery 2023年5月18日
    00
  • jQWidgets jqxGrid pincolumn()方法

    jQWidgets jqxGrid pincolumn()方法详解 jQWidgets jqxGrid 是一种表格控件,用于在 Web 应用程序中创建表格。pincolumn() 方法是 jqxGrid 控件的一个方法,用于将指定列固定在表格的左侧或右侧。本文将详细解 pincolumn() 方法的使用方法,并提供两个示例。 方法 pincolumn() 方…

    jquery 2023年5月10日
    00
  • JQuery异步获取返回值中文乱码的解决方法

    关于“JQuery异步获取返回值中文乱码的解决方法”,我将为您提供以下完整攻略,充分介绍这个问题的出现原因以及解决方法: 问题描述 在使用JQuery实现异步Ajax请求时,可能会出现返回值中文乱码的情况。 出现原因 导致这种情况的主要原因是:“请求和返回的字符集不同”。 客户端浏览器通常使用UTF-8字符集,而服务器端的字符集由后端编程语言和Web服务器决…

    jquery 2023年5月27日
    00
  • JQueryUI对话框

    JQueryUI对话框完整攻略 JQueryUI对话框是一个强大的插件,用于创建可定制的对话框。本文将详细讲解何使用JQueryUI对话框,包括引入JQueryUI库、创建对话框、自定义对话框等内容。同时,本文将提两个示例,演示如何使用JQueryUI对话框。 引入JQueryUI 在使用JQueryUI对话框之前,需要先引入JQuery和JQueryUI库…

    jquery 2023年5月9日
    00
合作推广
合作推广
分享本页
返回顶部