html日期选择框_第十课 日期选择框(datepicker)的操作

    有客户问:datepicker是怎么操作的?

    我答:datepicker可以直接用"输入文本"组件。

    客户说:不是,现在我操作的这个网页上datepicker是不能直接输入的,否则就直接用“输入文本”组件搞定,很简单的。

    没错,datepicker也是我们在项目中经常用到的,处理方式不能一概而论,跟客户说的一样,需要具体问题具体分析,有些网页或者桌面程序的日期是支持直接输入,这种情况下我们就用“输入文本”组件,另外一种情况是不支持直接输入,必须得点击才能选择到。如果需要输入的年月日固定,也好点击操作,但是年月日不固定又该如何操作呢?

    接下来,我们一起看看具体操作。

准备工作

    1)准备开发流程的电脑,请打开云扩学院链接查看云扩RPA编辑器运行的硬件&软件要求(https://academy.encoo.com/zh-cn/wiki/Studio/HarewareAndSoftwareRequirements.md?uuid=1bb922bd-c25d-4921-9241-f13ee45d295f)

    2)打开云扩官网(https://www.encoo.com/)下载编辑器并安装。

本次课程介绍:

    1)流程名称:日期选择机器人,该机器人可以在不固定年月日的情况下从datepicker中正确选择到我们想要选择的日期。

我们以此网站为例:https://ant.design/components/date-picker-cn/

    2)流程开发设计如下:

1be8d388be2bfce7f9668def00801237.png

    3)流程开发步骤:

打开云扩编辑器,选择“项目”,并点击“新建项目”进行创建项目。

715da306e68f3d300e59bc22378f3e65.png

a)“获取系统年月日”部分

打开MainFlow窗口,拖入“流程图”组件,重命名为“获取年月日”:

8f41a9a18d0b51321a35d0140a0cc1dd.png

双击打开流程图,拖入“赋值”组件,设置变量“年”(String)与参数“年份增量”,获取当前系统年份并将该值赋给变量“年”,同时添加用户可自定义的当前年份前几年或后几年数据入口,代码为: 

年份:System.DateTime.Now.AddYears(年份增量).ToString("yyyy")

bc8239a68ab8804c0669e514829fe17a.png

同样方法拖入“赋值”组件并赋值当前系统月份及日期。注意:添加变量“月”、“日”及参数“月份增量”、“日期增量”,如下图所示,获取月份、日期代码为:

月份:System.DateTime.Now.AddMonths(月份增量).ToString("MM").TrimStart('0')

(用TrimStart()方法是为了删掉月份前面的“0”,比如“01”月,因为我们后续流程中只需要“1”,不需要“01”。如果流程中需要01,那么可以把TrimStart()方法去掉,可视具体情况而定)

日期:System.DateTime.Now.AddDays(日期增量).ToString("dd")

1945eda7ae6e91d09df3b134fe265fab.png

C#获取年月日方法很多,如果想要获取当前日期前一日,则用AddDays(-1),举例如下:

今天DateTime.Now.Date.ToShortDateString();昨天,就是今天的日期减一
DateTime.Now.AddDays(-1).ToShortDateString();明天,今天的日期加一
DateTime.Now.AddDays(1).ToShortDateString();

月份年份同理

b)“点击日期选择框”部分

拖入“点击”组件,指定日期输入框元素(点击日期选项框元素打开日期选项框):

63d163f705fe169333e05c5fc6ef1a41.png

c)“选择年份”部分

拖入“点击”组件,指定年份title元素(点击年份title打开年份选项框):

74390afcd371c7f28743d97329b32ac8.png

拖入“获取结构化数据”组件,指定年份table元素(获取该面板所有年份以查看用户预期年份是否包含在内,如果不存在,则点击上一页或者下一页按钮翻页):

7938bdb03e83e3ccb53985f9ec04a0a6.png

拖入“C#”组件,从上步获取的数据表中循环查找预期年份,如果有,则赋值isTrue为true,为下一步做准备:

9fd0512eeee1f9e1a8a758df351b767a.png

附上查找年份代码段:

 isTrue=false;for(int i=0;i    for(int j=0;j        if(dt.Rows[i][j].Equals(年)){
        i=i+1;
        j=j+1;
        isTrue=true;break;
    }else{continue;
        }    
    }
}

拖入“流程决策”组件,输入判断条件isTrue:

2788b274326917c67b577c5127ca5e23.png

如果isTrue为真(上步中查询到预期年份),则直接点击选中年份,如果未查到年份,则点击翻页。拖入“点击”组件,并分别指定对应元素与对应操作连接,如下图所示:

dc670684a7c9be8c492069de9b390ea8.png

注意:如果需求中选择的年份并不会超越年份面板,那么判断年份是否存在部分完全可以省略,以此来节省流程开发与运行时间,那么,这种情况下,年份部分的流程如下图所示:

f4f5db0bf2d76300964f34099461960c.png

d)“选择月份”部分

拖入“赋值”组件,拼接月份,如下图所示:

8785f440ce2f67e5747b5bcc32f3c09f.png

拖入“点击”组件,并指定月份title元素(打开月份面板):

538fe9b669103ff1b61b3fce49b792bb.png

拖入“点击”组件,指定预期月份元素(点击指定预期月份):

07f59bedae42c711cbaeb6e495df7e1b.png

e)“选择日期”部分

拖入“点击”组件,指定预期日期元素(点击选择日期):

041a4688d7c296c4171191723ae8fcd7.png

至此,所有操作步骤已开发完毕,保存流程,并进行运行查看,但在实际项目中,请别忘记第四课讲到的“错误捕获(Try catch)”组件的使用,以此来保证流程的稳定性。以下为流程运行视频:

    好啦,小伙伴们,今天的课就到此结束,流程开发过程中若遇到问题,请留言;若有其他开发思路,也请留言,祝各位开发顺利~

(本节课开发的流程可从流程市场中下载)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/410302.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

E-triples II_2019牛客暑期多校训练营(第四场)

求用n个3的倍数的数按位或出数字a的方案数有多少种(0也算3的倍数) 题解 若数b的每个二进制位上的1,在a中也为1,则称b为a的子集容易知道任意个a的子集按位或出来的结果还是a的子集若问题改为按位或出来的结果是a的子集的方案数&…

[html] 网页打印与标准纸张换算时,cm和px是如何换算的?

[html] 网页打印与标准纸张换算时,cm和px是如何换算的? (function(){// 创建一个1cm宽的元素插入到页面,然后坐等出结果let div document.createElement("div");div.id "cm";div.style.width "1cm";docume…

杭电 1233 最小生成树 kruskal()算法

一道最小生成树的水题,用kruskal()可以轻松解决。。。。。。题目: 还是畅通工程 Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submission(s): 10378 Accepted Submission(s):…

SRTE测试

网络拓扑: XRV1 hostname XRV1explicit-path name SRTE index 10 next-address strict ipv4 unicast 10.10.2.2 index 20 next-address strict ipv4 unicast 10.10.3.2 index 30 next-address strict ipv4 unicast 10.10.4.1 index 40 next-address strict ipv4 un…

java笔记:自己动手写javaEE框架(七)--使用JSON和Ajax技术

今天我要将json和ajax引入到我所写的框架,不过今天用到的技术有部分不是我框架最终使用到的技术,比如ajax技术,我用到的是最为原始的ajax技术,这次算是对老技术的回顾,不过不管技术如何演进,对技术的本质的…

[html] pre与xmp标签有什么区别?

[html] pre与xmp标签有什么区别&#xff1f; xmp的标签&#xff0c;会复把抱在内部的html片段当作字符串输出&#xff08;此标签已废弃&#xff09; <pre></pre> 标签&#xff0c;可以在保留原来文本格式的基础制上让文本在页面上显示出来 <pre> 标签中的特…

系统分析师成长之路

去年拿到软件设计师证书后&#xff0c;查了下高级认证中系统分析师&#xff0c;原来发现自己目前工作内容更像系统分析师&#xff08;与用户调研、明确需求内容、熟悉企业数据模型、安排开发人员设计程序、牵头日常维护工作、团队人员管理&#xff09;。去年底马上下决定趁热打…

python 收发邮件_python发送各类邮件的主要基本方法

利用python实现基本的邮件发送。 感谢以下博客的整理&#xff0c;本人在学习的同时也做了一些整理 一、相关模块介绍 发送邮件主要用到了smtplib和email两个模块&#xff0c;这里首先就两个模块进行一下简单的介绍&#xff1a; 1、smtplib模块 smtplib.SMTP([host[, port[, loc…

[html] websocket握手阶段是通过什么协议传输的?

[html] websocket握手阶段是通过什么协议传输的&#xff1f; HTTP个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后端知识。放弃很容易&#xff0c; 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关前端面试题

区分Activity的四种加载模式

在多Activity开发中&#xff0c;有可能是自己应用之间的Activity跳转&#xff0c;或者夹带其他应用的可复用Activity。可能会希望跳转到原来某个Activity实例&#xff0c;而不是产生大量重复的Activity。 这需要为Activity配置特定的加载模式&#xff0c;而不是使用默认的加载模…

laravel常用响应操作

转载于:https://www.cnblogs.com/saintdingspage/p/11298246.html

[html] 说说你对Media Source Extensions(MSE)的理解,它解决了什么问题呢?

[html] 说说你对Media Source Extensions(MSE)的理解&#xff0c;它解决了什么问题呢&#xff1f; Media Source Extensions 允许JavaScript动态地为<audio>和<video>创建媒体流&#xff0c;而不再只能是引用一个视频文件的url。这样就极大地丰富了前端对音视频的…

教学思路SQL之入门习题《学生成绩》 二、基础单表查询

根据查询要求&#xff0c;写出SQL脚本&#xff1a; 1、 查询学生信息表&#xff0c;查找学生的姓名&#xff0c;性别&#xff0c;并将查询结果按姓名进行排序。 2、查询学生信息表&#xff0c;查找地区在大连的学生&#xff0c;显示其姓名&#xff0c;联系电话&#xff0c;地…

python中mat函数_python matplotlib中的subplot函数使用详解

python里面的matplotlib.pylot是大家比较常用的&#xff0c;功能也还不错的一个包。基本框架比较简单&#xff0c;但是做一个功能完善且比较好看整洁的图&#xff0c;免不了要网上查找一些函数。于是&#xff0c;为了节省时间&#xff0c;可以一劳永逸。我把常用函数作了一个总…

pytorch资料

torchvision是独立于pytorch的关于图像操作的一些方便工具库。 torchvision的详细介绍在&#xff1a;https://pypi.org/project/torchvision/ torchvision主要包括一下几个包&#xff1a; vision.datasets : 几个常用视觉数据集&#xff0c;可以下载和加载&#xff0c;这里主要…

[html] 浏览器是怎么对HTML5的离线储存资源进行管理和加载的

[html] 浏览器是怎么对HTML5的离线储存资源进行管理和加载的 在线的情况下&#xff0c;浏览器发现html头部有manifest属性&#xff0c;它会请求manifest文件&#xff0c;如果是第一次访问app&#xff0c;那么浏览器就会根据manifest文件的内容下载相应的资源并且进行离线存储。…

常用技术面试题

java面试题 http://blog.csdn.net/uiop_7890_7890转载于:https://www.cnblogs.com/ajian005/archive/2011/11/02/2753780.html

if else if else语句格式_你还在用if/else吗?

你还在用if/else吗&#xff1f;前提我们在日常开发当中经常会遇到复杂的条件判断&#xff0c;一般的做法是用if/else&#xff0c;或者优雅一点的写法是用switch语句来实现多个条件的判断&#xff0c;这样的话会有很多问题&#xff0c;随着判断条件的增加&#xff0c;代码中if/e…

魔术球问题

题目大意&#xff1a; 有 \(n\) 个柱子&#xff0c;依次将若干个球放上去&#xff0c;要满足&#xff1a; 1.每次只能放在柱子的顶端 2.相邻两个球的编号之和必须为完全平方数。 问最多能放几个球&#xff1f; \((1 \leq n \leq 55)\) 思路&#xff1a; 首先&#xff0c;答案一…

[html] svg如何转为字体图标?

[html] svg如何转为字体图标&#xff1f; 选择一个支持在线转换的网站 如IconFont或icomoon上传svg文件的图标在相应的地方进行下载好处字体图标直接用color自由控制颜色&#xff1b;整合在一起&#xff0c;减少http请求等个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后…