Custom mvc control and mvc Control

Custom mvc control and mvc Control

// Customize a DatePicker. cshtml File
@ Helper Init () {<link href = "~ /Content/mobiscroll.custom-2.5.0.min.css "rel =" stylesheet "/> <script src = "~ /Scripts/mobiscroll. custom-2.5.0.min.js & gt; </script & gt; // Date font color & lt; style & gt. 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 (); // initialization date control var opt = {preset: 'date', // date, optional: date \ datetime \ time \ tree_list \ image_text \ select theme: 'default', // skin style, optional: default \ android-ics light \ android-ics \ ios \ jqm \ sense-ui \ wp light \ wp display: 'modal', // display mode. Optional values: modal \ inline \ bubble \ top \ bottom mode: 'scroler', // Date selection mode. Optional values: scroller \ clickpick \ mixed lang: 'zh ', dateFormat: 'yyyy-mm-dd', // Date Format setText:' OK ', // confirm the button name cancelText: 'cancel', // The cancel button name is dateOrder: 'yyyymmdd', // The date format in the panel is dayText: 'day', monthText: 'month', yearText: 'Year', // The year, month, and day text in the panel showNow: false, nowText: "Today", startYear: currYear-5, // start year endYear: currYear // End Year }; @ foreach (var item in controlIds) {@: $ ("# @ item "). mobiscroll (opt) ;}}); </script> }}

Use

// @ DatePicker. Init () @ DatePicker. Render ("date1", "date2") on the view page ")

<Div> <input type = "text" placeholder = "Release Start Time" id = "date1" value = "@ ViewBag. SDate "/> <input type =" text "placeholder =" Release End Time "id =" date2 "value =" @ ViewBag. EDate "/> </div>