model_filed_input.html 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. <style>
  2. hr{
  3. margin-top: 3px!important;
  4. margin-bottom: 3px!important;
  5. }
  6. </style>
  7. <script>
  8. $(function() {
  9. $("#filedClass").change(function(){
  10. SelectChange();
  11. });
  12. function SelectChange() {
  13. var selectValue = $("#filedClass").val();
  14. appendFliedclassValue(selectValue);
  15. }
  16. function appendFliedclassValue(selectValue) {
  17. var content = $("#configContent");
  18. if(selectValue=='input'){
  19. content.html("<input type='text' class='form-control' name='filedValue' size='30' placeholder='默认值'>");
  20. }
  21. if(selectValue=='textarea'){
  22. content.html("<textarea type='text' class='form-control' name='filedValue' size='30' placeholder='默认值'></textarea>");
  23. }
  24. if(selectValue=='radio'){
  25. content.html("<textarea type='text' class='form-control' name='filedValue' size='30' placeholder='选项值用“#”隔开'></textarea>");
  26. }
  27. if(selectValue=='checkbox'){
  28. content.html("<textarea type='text' class='form-control' name='filedValue' size='30' placeholder='多个选项值用“#”隔开'></textarea>");
  29. }
  30. if(selectValue=='select'){
  31. content.html("<textarea type='text' class='form-control' name='filedValue' size='30' placeholder='多个子菜单用“#”隔开'></textarea>");
  32. }
  33. if(selectValue=='editor'){
  34. content.html("<textarea type='text' class='form-control' name='filedValue' size='30' placeholder='默认值'></textarea>");
  35. }
  36. if(selectValue=='file'){
  37. content.html("<input type='text' class='form-control' name='filedValue' size='30' placeholder='允许上传的文件类型,如:txt#zip'>");
  38. }
  39. if(selectValue=='image'){
  40. content.html("<input type='text' class='form-control' name='filedValue' size='30' placeholder='允许上传的文件类型,如:img#png'>");
  41. }
  42. if(selectValue=='dateInput'){
  43. content.html("<input type='text' class='form-control' data-toggle='datepicker' name='filedValue' size='30' placeholder='请输入日期格式:yyyy/MM/dd hh:mm:ss'>");
  44. }
  45. }
  46. $("#filedType").change(function(){
  47. SelectChangeType();
  48. });
  49. function SelectChangeType(){
  50. var selectValue = $("#filedType").val();
  51. appendFliedtype(selectValue);
  52. }
  53. function appendFliedtype(type){
  54. var content = $("#typeContent");
  55. if(type=='INT_TYPE'){
  56. content.html("<input type='text' class='form-control' name='filedLength' size='30' data-rule='required;range(1~11);integer[+]' value='11' placeholder='长度'>");
  57. }
  58. // if(type=='DECIMAL_TYPE'){
  59. //
  60. // content.html("<input type='text' class='form-control' name='filedLength' size='30' value='11' data-rule='required;range(1-11);integer[+]' placeholder='长度'>");
  61. // }
  62. if(type=='DATE_TYPE'){
  63. content.html("date");
  64. }
  65. if(type=='CHAR_TYPE'){
  66. content.html("<input type='text' class='form-control' name='filedLength' size='30' value='16' data-rule='required;range(1~16);integer[+]' placeholder='长度'>");
  67. }
  68. if(type=='VARCHAR_TYPE'){
  69. content.html("<input type='text' class='form-control' name='filedLength' size='30' value='50' data-rule='required;range(1~255);integer[+]' placeholder='长度'>");
  70. }
  71. if(type=='TEXT_TYPE'){
  72. content.html("text");
  73. }
  74. if(type=='MEDIUM_TEXT_TYPE'){
  75. content.html("medium_text");
  76. }
  77. if(type=='LONG_TEXT_TYPE'){
  78. content.html("long_text");
  79. }
  80. }
  81. });
  82. </script>
  83. <div class="bjui-pageContent">
  84. <form method="post" action="${ctxPath}/system/cms/model/filed/save" id="j_model_form" data-toggle="validate" data-autorefresh="true" data-alertmsg="false">
  85. <input TYPE="hidden" name="modelId" value="${modelId!}">
  86. <hr>
  87. <div class="form-group">
  88. <label for="j_username" class="control-label x85">字段名称:</label>
  89. <input type="text" name="filedName" id="j_username" placeholder="字段名称" size="24" data-rule="required;remote(${ctxPath}/system/cms/model/filed/checkFiledName)" >
  90. </div>
  91. <hr>
  92. <div class="form-group">
  93. <label for="filedClass" class="control-label x85">字段类别:</label>
  94. <select id="filedClass" data-toggle="selectpicker" data-rule="required" name="filedClass">
  95. <option value="" >请选择</option>
  96. <option value="input">单行文本</option>
  97. <option value="textarea">多行文本</option>
  98. <option value="dateInput">日期输入</option>
  99. <option value="editor">文本编辑器</option>
  100. <option value="radio">单选框</option>
  101. <option value="checkbox">多选框</option>
  102. <option value="select">菜单</option>
  103. <option value="image">图片上传</option>
  104. <option value="file">文件上传</option>
  105. </select>
  106. </div>
  107. <hr>
  108. <div class="form-group">
  109. <label for="configContent" class="control-label x85">类型参数:</label>
  110. <span id="configContent">
  111. 请选择
  112. </span>
  113. </div>
  114. <hr>
  115. <div class="form-group">
  116. <label for="filedType" class="control-label x85">字段类型:</label>
  117. <select id="filedType" data-toggle="selectpicker" name="filedType">
  118. <option value="">——</option>
  119. <option value="INT_TYPE">整型</option>
  120. <!--<option value="DECIMAL_TYPE">小数类型</option>-->
  121. <option value="DATE_TYPE">日期类型</option>
  122. <option value="CHAR_TYPE">字符类型</option>
  123. <option value="VARCHAR_TYPE">文字类型</option>
  124. <option value="TEXT_TYPE">小文本类型</option>
  125. <option value="MEDIUM_TEXT_TYPE">中文本类型</option>
  126. <option value="LONG_TEXT_TYPE">大长文本类型</option>
  127. </select>
  128. <span><font COLOR="#ff6347"> 可选 </font>请确保您对Mysql字段类型有初步了解,否则会导致字段创建失败!</span>
  129. </div>
  130. <hr>
  131. <div class="form-group">
  132. <label for="typeContent" class="control-label x85">字段长度:</label>
  133. <span id="typeContent">
  134. 字段类别参数长度不能越界,存储类型必须一致
  135. </span>
  136. </div>
  137. <hr>
  138. <div class="form-group">
  139. <label class="control-label x85">允许空:</label>
  140. <select data-toggle="selectpicker" data-rule="required" name="notNull">
  141. <option value="0">允许空</option>
  142. <option value="1">不允许空</option>
  143. </select>
  144. </div>
  145. <hr>
  146. <div class="form-group">
  147. <label for="j_desc" class="control-label x85">描述:</label>
  148. <textarea name="alias" id="j_desc" placeholder="描述" data-rule="required"></textarea>
  149. </div>
  150. </form>
  151. </div>
  152. <div class="bjui-pageFooter">
  153. <ul>
  154. <li><button type="button" class="btn-close" data-icon="close">关闭</button></li>
  155. <li><button type="submit" class="btn-default" data-icon="save">保存</button></li>
  156. </ul>
  157. </div>