解决ionic中运用mobiscroll插件输入框内容重置的实现--clear()
来源:互联网 发布:澳门mac专柜 编辑:程序博客网 时间:2024/06/05 10:54
有时在同一个页面会需要使用多个mobiscroll的控件,例如:
操作过程中,在进行选择之后,如图:
可能需要重置恢复到原本的页面:
常常需要添加一个“重置”的功能。
这个功能如何实现,其实很简单,只需一个clear()方法即可。
具体操作为:
在标签里面写上mobiscroll-instanc属性,在所需的按钮上添加点击事件
ng-click=”demoType.clear();”
需要注意的是mobiscroll-instanc的属性值要和clear()方法前面的保持一致。
完整代码为:
html:
<ul class="rzInfo"> <li class="row"> <span class="col-xs-5">产品类型</span> <select ng-model="myselectType" mobiscroll-select="settings" mobiscroll-instance="demoType"> <option value="0">请选择</option> <option value="1">化学类</option> <option value="2">针剂类</option> <option value="3">中药类</option> </select> </li> <li class="row"> <span class="col-xs-5">产品名称</span> <select class="" ng-model="myselectName" placeholder="请选择" mobiscroll-select="settings" mobiscroll-instance="demoName"> <option value="0">请选择</option> <option value="1">产品类型</option> <option value="2">产品名称</option> <option value="3">产品规格</option> </select> </li> <li class="row"> <span class="col-xs-5">规格</span> <select class="" ng-model="myselectGuige" placeholder="请选择" mobiscroll-select="settings" mobiscroll-instance="demoGuige"> <option value="0">请选择</option> <option value="1">10ml</option> <option value="2">20ml</option> <option value="3">30ml</option> </select> </li> <li class="row"> <span class="col-xs-5">批号</span> <!--<b class="" contenteditable="true" ng-model="dataclean" ></b>--> <input type="text" ng-model="search.searchPihao" name="" class="col-xs-7" value="" /> </li> <li class="row"> <span class="col-xs-5">密码</span> <input type="text" ng-model="search.searchMima" name="" class="col-xs-7" value="" /> </li> <li class="row"> <span class="col-xs-5">发货编号</span> <input type="text" ng-model="search.searchFahuo" name="" class="col-xs-7" value="" /> </li></ul><button style="position: relative;right: 0;bottom: 0;" ng-click="datacleaned();demostart.clear();demoend.clear();demoGuige.clear();demoName.clear();demoType.clear()">Clear</button>
0 0
- 解决ionic中运用mobiscroll插件输入框内容重置的实现--clear()
- 在ionic中使用mobiscroll插件的问题记录及取值
- 使用Mobiscroll插件 输入框初始化默认出错问题
- 解决Firefox中刷新页面, 不重置输入的值
- mobiscroll时间插件的用法
- 解决ionic输入input里的内容时会把底部tabs顶上来的情况(隐藏底部tabs)
- 一款不错的JS日期插件 Mobiscroll
- mobiscroll js日期插件的基本案例
- mobiscroll 一个很好用的前端插件
- 实现输入内容提示的功能(仿google_百度输入框提示)jquery.ui.autocomplete.js插件
- 实现输入内容提示的功能(仿google_百度输入框提示)jquery.ui.autocomplete.js插件 .
- 实现输入内容提示的功能(仿google_百度输入框提示)jquery.ui.autocomplete.js插件
- ionic 开发中常用的一些插件
- ionic中自定义插件的问题
- ionic中input框禁止输入问题
- 1,编写程序,当用户在文本框中输入内容之后,单机不同的按钮,能够把文半框中的内容粘贴到文本区中。“重置”按钮实现将文本框和文本区中的内容清空。界面上的文本区只能显示内容,不能让用户输入文本。运行结果
- 解决有 sql中 &XXX 插入数据的时候弹出提示框输入内容
- Ionic-Native 中media插件的使用,录音功能的实现
- cvvimage
- 167UVa八皇后——苏丹
- git常用命令:
- 2017.2.17日记
- Nginx 的安装
- 解决ionic中运用mobiscroll插件输入框内容重置的实现--clear()
- HDFS问题
- POJ 2983 Is the Information Reliable(差分约束系统 spfa判负环)
- Maven 配置filter导致Excel文件损坏的问题
- Crackme 3
- 开始编程之旅
- 【BZOJ 4299】 Codechef FRBSUM 主席树
- 『设计模式』之小试牛刀
- 21. Merge Two Sorted Lists