add.jsp 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta name="renderer" content="webkit">
  7. <link href="lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
  8. <script src="js/jquery/jquery-2.1.1.min.js"></script>
  9. <script src="lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  10. <script src="lib/ligerUI/js/plugins/ligerComboBox.js"></script>
  11. <script src="js/ckeditor/ckeditor.js"></script>
  12. <title>文章管理列表</title>
  13. <style>
  14. .content{ margin:0 auto; width:100%; }
  15. .title{ margin:0 auto; width:500px; }
  16. input{ width:350px; }
  17. .ad-padd{ height: 100px; width: 95%; padding: 10px; margin:30px border: solid 1px #dcdcdc; border-radius: 2px; font-size: 12px; }
  18. .ad-padd::-webkit-input-placeholder{ color:#ccc; }
  19. .ad-padd::-moz-placeholder{ color:#ccc; }
  20. .ad-padd:-moz-placeholder{ color:#ccc; }
  21. .ad-padd:-ms-input-placeholder{ color:#ccc; }
  22. .hidden{ display: none; }
  23. table{ margin-top: 30px;}
  24. table tr{height: 40px; line-height: 40px;}
  25. .td-left{text-align: right;}
  26. .td-right{text-align: left;}
  27. .width350{width: 350px !important;}
  28. </style>
  29. </head>
  30. <body>
  31. <form id="article" onsubmit="return sub()">
  32. <div class="liger-form">
  33. <div class="content">
  34. <table style="width: 100%;" border="0" cellspacing="0" cellpadding="0">
  35. <tr>
  36. <td width="30%" class="td-left"><label>标&emsp;&emsp;题:</label></td>
  37. <td width="70%" class="td-right">
  38. <input class="liger-textbox width350" name="title" data-label="标题" required="required" />
  39. </td>
  40. </tr>
  41. <tr>
  42. <td width="30%" class="td-left"><label>文章类型:</label></td>
  43. <td width="70%" class="td-right">
  44. <input id="typeSelect"/>
  45. <input type="hidden" name="type" id="type"/>
  46. <input type="hidden" name="typeName" id="typeName"/>
  47. </td>
  48. </tr>
  49. <tr>
  50. <td width="30%" class="td-left"><label>文章来源:</label></td>
  51. <td width="70%" class="td-right">
  52. <input id="articleFrom" required="required" />
  53. </td>
  54. </tr>
  55. <tr class="fromUrl hidden">
  56. <td width="30%" class="td-left">
  57. URL:
  58. </td>
  59. <td width="70%" class="td-right">
  60. <input type="url" id="url" name="url" class="liger-textbox" class="width350"/>
  61. </td>
  62. </tr>
  63. <tr class="bySelf hidden">
  64. <td width="30%" class="td-left">
  65. 关&ensp;键&ensp;字:
  66. </td>
  67. <td width="70%" class="td-right">
  68. <input name="keyword" class="liger-textbox" class="width350"/>
  69. </td>
  70. </tr>
  71. <tr class="bySelf hidden">
  72. <td width="30%" class="td-left"><label class="bySelf hidden">简&emsp;&emsp;介:</label></td>
  73. <td width="70%" class="td-right">
  74. <div class="width350"><textarea class="ad-padd" name="contentFirst" placeholder="简介" ></textarea></div>
  75. </td>
  76. </tr>
  77. <tr class="bySelf hidden">
  78. <td colspan="2">
  79. <div style="width: 80%;margin:0 auto;"><textarea id="TextArea1" cols="20" rows="2" name="ckeditor" class="ckeditor"></textarea></div>
  80. <input type="hidden" name="content" id="content" />
  81. </td>
  82. </tr>
  83. <tr>
  84. <td colspan="2" style="text-align: center">
  85. <input type="reset" value="重置" style="width: 80px;">&emsp;&emsp;
  86. <input type="submit" value="保存" style="width: 80px;"/>
  87. </td>
  88. </tr>
  89. </table>
  90. </div>
  91. </div>
  92. </form>
  93. </body>
  94. <script>
  95. $("#typeSelect").ligerComboBox(
  96. {
  97. url:"getArticleType",
  98. valueField: 'code',
  99. textField: 'name',
  100. selectBoxWidth: 400,
  101. onSelected:function(value,text){
  102. $("#type").val(value);
  103. $("#typeName").val(text);
  104. }
  105. }
  106. );
  107. $("#articleFrom").ligerComboBox(
  108. {
  109. data: [
  110. {id: 1, name: '从url获取'},
  111. {id: 2, name: '录入'},
  112. ],
  113. valueField: 'id',
  114. textField: 'name',
  115. selectBoxWidth: 400,
  116. onSelected:function(value,text){
  117. if(value==1){
  118. $(".fromUrl").each(function(){
  119. $(this).removeClass("hidden");
  120. $(".bySelf").each(function(){
  121. $(this).addClass("hidden");
  122. })
  123. })
  124. $("#url").attr("required",true);//设置url必输
  125. }else if(value==2){
  126. $(".bySelf").each(function(){
  127. $(this).removeClass("hidden");
  128. $(".fromUrl").each(function(){
  129. $(this).addClass("hidden");
  130. })
  131. })
  132. if(typeof($("#url").attr("required"))!=="undefined"){
  133. $("#url").attr("required",false);//取消设置url必输
  134. }
  135. }
  136. }
  137. }
  138. );
  139. var editor = CKEDITOR.replace('ckeditor');
  140. function sub(){
  141. var articleFrom = $("#articleFrom").ligerComboBox().getValue();
  142. if(articleFrom==''){
  143. alert("请选择文章来源");
  144. return false;
  145. }
  146. var typeSelect = $("#typeSelect").ligerComboBox().getValue();
  147. if(typeSelect==''){
  148. alert("请选择文章类型");
  149. return false;
  150. }
  151. var data = editor.getData();
  152. if(articleFrom==2){
  153. if(data==undefined||data==''){
  154. alert("请输入文章内容")
  155. return false;
  156. }
  157. }
  158. $("#content").val(data);
  159. $.ajax({
  160. cache: true,
  161. type: "POST",
  162. url:"save",
  163. data:$('#article').serialize(),
  164. async: false,
  165. error: function(request) {
  166. alert("服务器忙");
  167. },
  168. success: function(data) {
  169. alert("保存成功");
  170. window.location.href="toList";
  171. }
  172. });
  173. return false;
  174. }
  175. </script>
  176. </html>