mvc自定义控件
2024-10-01 04:46:05
//自定义一个DatePicker.cshtml文件
@helper Init()
{
<link href="~/Content/mobiscroll.custom-2.5.0.min.css" rel="stylesheet" />
<script src="~/Scripts/mobiscroll.custom-2.5.0.min.js"></script>
//日期字体颜色
<style>
.dw-i {
color: #fff;
}
</style>
} @helper Render(params string[] controlIds)
{
if (controlIds != null)
{
<script type="text/javascript">
$(function () {
@foreach (var item in controlIds)
{
@:$("#@item").mobiscroll().date();
} var currYear = (new Date()).getFullYear(); //初始化日期控件
var opt = {
preset: 'date', //日期,可选:date\datetime\time\tree_list\image_text\select
theme: 'default', //皮肤样式,可选:default\android\android-ics light\android-ics\ios\jqm\sense-ui\wp light\wp
display: 'modal', //显示方式 ,可选:modal\inline\bubble\top\bottom
mode: 'scroller', //日期选择模式,可选:scroller\clickpick\mixed
lang: 'zh',
dateFormat: 'yyyy-mm-dd', // 日期格式
setText: '确定', //确认按钮名称
cancelText: '取消',//取消按钮名籍我
dateOrder: 'yyyymmdd', //面板中日期排列格式
dayText: '日', monthText: '月', yearText: '年', //面板中年月日文字
showNow: false,
nowText: "今",
startYear: currYear - 5, //开始年份
endYear: currYear //结束年份
}; @foreach (var item in controlIds)
{
@:$("#@item").mobiscroll(opt);
}
});
</script>
}
}
使用
//view页面中
@DatePicker.Init()
@DatePicker.Render("date1", "date2")
<div>
<input type="text" placeholder="发布开始时间" id="date1" value="@ViewBag.SDate" />
<input type="text" placeholder="发布结束时间" id="date2" value="@ViewBag.EDate" />
</div>
最新文章
- iOS纯代码适配masonry中mas_的问题
- 用FLASH,安智和IOS打电话方法
- Wordpress 标题设置
- Android 5.0 Uicc框架分析
- 【jQuery基础学习】08 编写自定义jQuery插件
- C# Lambda Expressions 简介
- Python元组、列表--笔记
- Python开发环境的搭建(win7)
- iOS开发技术分享(1)— iOS本地数据存储
- iOS中级篇 - dispatch_semaphore(信号量)的理解及使用
- Alamofire源码解读系列(十一)之多表单(MultipartFormData)
- spark streaming(2) DAG静态定义及DStream,DStreamGraph
- MySQL索引语法+使用场景
- docker 镜像备份magento 2.2.3
- day48 前端高级选择器优先级
- echarts简单的折线图
- MySQL常用内置函数
- Air Jordan 1 Los Primeros Will be unveiled
- PHP:第一章——php中的变量001 /普通赋值/引用赋值/php变量的检查与销毁
- ECCV 2018 | 旷视科技提出GridFace:通过学习局部单应变换实现人脸校正