member-add.html 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <!--_meta 作为公共模版分离出去-->
  2. <!DOCTYPE HTML>
  3. <html>
  4. <head>
  5. <meta charset="utf-8">
  6. <meta name="renderer" content="webkit|ie-comp|ie-stand">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  9. <meta http-equiv="Cache-Control" content="no-siteapp" />
  10. <link rel="Bookmark" href="/favicon.ico" >
  11. <link rel="Shortcut Icon" href="/favicon.ico" />
  12. <!--[if lt IE 9]>
  13. <script type="text/javascript" src="lib/html5shiv.js"></script>
  14. <script type="text/javascript" src="lib/respond.min.js"></script>
  15. <![endif]-->
  16. <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
  17. <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
  18. <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
  19. <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
  20. <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
  21. <!--[if IE 6]>
  22. <script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
  23. <script>DD_belatedPNG.fix('*');</script>
  24. <![endif]-->
  25. <!--/meta 作为公共模版分离出去-->
  26. <title>添加用户 - H-ui.admin v3.1</title>
  27. <meta name="keywords" content="H-ui.admin v3.1,H-ui网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
  28. <meta name="description" content="H-ui.admin v3.1,是一款由国人开发的轻量级扁平化网站后台模板,完全免费开源的网站后台管理系统模版,适合中小型CMS后台系统。">
  29. </head>
  30. <body>
  31. <article class="page-container">
  32. <form action="" method="post" class="form form-horizontal" id="form-member-add">
  33. <div class="row cl">
  34. <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>用户名:</label>
  35. <div class="formControls col-xs-8 col-sm-9">
  36. <input type="text" class="input-text" value="" placeholder="" id="username" name="username">
  37. </div>
  38. </div>
  39. <div class="row cl">
  40. <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>性别:</label>
  41. <div class="formControls col-xs-8 col-sm-9 skin-minimal">
  42. <div class="radio-box">
  43. <input name="sex" type="radio" id="sex-1" checked>
  44. <label for="sex-1">男</label>
  45. </div>
  46. <div class="radio-box">
  47. <input type="radio" id="sex-2" name="sex">
  48. <label for="sex-2">女</label>
  49. </div>
  50. <div class="radio-box">
  51. <input type="radio" id="sex-3" name="sex">
  52. <label for="sex-3">保密</label>
  53. </div>
  54. </div>
  55. </div>
  56. <div class="row cl">
  57. <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>手机:</label>
  58. <div class="formControls col-xs-8 col-sm-9">
  59. <input type="text" class="input-text" value="" placeholder="" id="mobile" name="mobile">
  60. </div>
  61. </div>
  62. <div class="row cl">
  63. <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>邮箱:</label>
  64. <div class="formControls col-xs-8 col-sm-9">
  65. <input type="text" class="input-text" placeholder="@" name="email" id="email">
  66. </div>
  67. </div>
  68. <div class="row cl">
  69. <label class="form-label col-xs-4 col-sm-3">附件:</label>
  70. <div class="formControls col-xs-8 col-sm-9"> <span class="btn-upload form-group">
  71. <input class="input-text upload-url" type="text" name="uploadfile" id="uploadfile" readonly nullmsg="请添加附件!" style="width:200px">
  72. <a href="javascript:void();" class="btn btn-primary radius upload-btn"><i class="Hui-iconfont">&#xe642;</i> 浏览文件</a>
  73. <input type="file" multiple name="file-2" class="input-file">
  74. </span> </div>
  75. </div>
  76. <div class="row cl">
  77. <label class="form-label col-xs-4 col-sm-3">所在城市:</label>
  78. <div class="formControls col-xs-8 col-sm-9"> <span class="select-box">
  79. <select class="select" size="1" name="city">
  80. <option value="" selected>请选择城市</option>
  81. <option value="1">北京</option>
  82. <option value="2">上海</option>
  83. <option value="3">广州</option>
  84. </select>
  85. </span> </div>
  86. </div>
  87. <div class="row cl">
  88. <label class="form-label col-xs-4 col-sm-3">备注:</label>
  89. <div class="formControls col-xs-8 col-sm-9">
  90. <textarea name="beizhu" cols="" rows="" class="textarea" placeholder="说点什么...最少输入10个字符" onKeyUp="$.Huitextarealength(this,100)"></textarea>
  91. <p class="textarea-numberbar"><em class="textarea-length">0</em>/100</p>
  92. </div>
  93. </div>
  94. <div class="row cl">
  95. <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
  96. <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
  97. </div>
  98. </div>
  99. </form>
  100. </article>
  101. <!--_footer 作为公共模版分离出去-->
  102. <script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
  103. <script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
  104. <script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
  105. <script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->
  106. <!--请在下方写此页面业务相关的脚本-->
  107. <script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script>
  108. <script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script>
  109. <script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script>
  110. <script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script>
  111. <script type="text/javascript">
  112. $(function(){
  113. $('.skin-minimal input').iCheck({
  114. checkboxClass: 'icheckbox-blue',
  115. radioClass: 'iradio-blue',
  116. increaseArea: '20%'
  117. });
  118. $("#form-member-add").validate({
  119. rules:{
  120. username:{
  121. required:true,
  122. minlength:2,
  123. maxlength:16
  124. },
  125. sex:{
  126. required:true,
  127. },
  128. mobile:{
  129. required:true,
  130. isMobile:true,
  131. },
  132. email:{
  133. required:true,
  134. email:true,
  135. },
  136. uploadfile:{
  137. required:true,
  138. },
  139. },
  140. onkeyup:false,
  141. focusCleanup:true,
  142. success:"valid",
  143. submitHandler:function(form){
  144. //$(form).ajaxSubmit();
  145. var index = parent.layer.getFrameIndex(window.name);
  146. //parent.$('.btn-refresh').click();
  147. parent.layer.close(index);
  148. }
  149. });
  150. });
  151. </script>
  152. <!--/请在上方写此页面业务相关的脚本-->
  153. </body>
  154. </html>