JQuery使用$.ajax和checkbox实现下次不在通知功能


Posted in Javascript onApril 16, 2015

XXX平台要实现一个功能,公告弹出页面上使用复选框设置不再通知此类公告。
 
原理:<input type="checkbox" id="isSelect" name="isSelect" value="10" onclick="javascript:noTips();"/>,checkbox选中后提交表单,那么struts2的Action中isSelect就为'10',不选中提交表单isSelect为null。
 
1.jsp页面

<form id="form1"> 
<div class="jf_tanchu"> 
  <div class="jf_tanchutit">${ bussinessNotice.noticeTitle}</div> 
  <div class="jf_tanchubox"> 
    <div class="jf_tanchubox_right"> 
    公告类型:<v:dcolor code="${ bussinessNotice.noticeType}"/>     
    发布时间:<fmt:formatDate value="${ bussinessNotice.createDate}" pattern="yyyy-MM-dd"/> 
    </div> 
    ${bussinessNotice.noticeInfo} 
  </div> 
</div> 
<s:if test="bussinessNotice.noticeType=='25'||bussinessNotice.noticeType=='63'||bussinessNotice.noticeType=='64'"> 
<div> 
  <input type="hidden" name="noticeType" value="${bussinessNotice.noticeType}"/> 
  <input type="checkbox" id="isSelect" name="isSelect" value="${bussinessNotice.noticeType}" onclick="javascript:noTips();"/> 
  <label for="isSelect">不再通知此类公告</label> 
</div> 
</s:if> 
</form>

 2.js代码

function noTips(){ 
  var formParam = $("#form1").serialize();//序列化表格内容为字符串 
  $.ajax({ 
    type:'post',   
    url:'Notice_noTipsNotice', 
    data:formParam, 
    cache:false, 
    dataType:'json', 
    success:function(data){ 
    } 
  }); 
}

 3.NoticeAction代码

/** 
 * checkbox不提示公告,需要修改TBussinessSet中的屏蔽状态,ajax异步请求 
 */ 
public void noTipsNotice(){ 
  try { 
    PrintWriter out = this.getResponse().getWriter(); 
     
    bussinessSet = BussinessSetService.queryById(getUserId()); 
    String state = ""; 
    if(isSelect==null){//noticeType==null没有选中checkbox 
      state = "11"; 
    } 
    else{ 
      state = "10"; 
    } 
    if("25".equals(noticeType)){ 
      bussinessSet.setSaleBack(state); 
    } 
    else if("63".equals(noticeType)){ 
      bussinessSet.setRemittanceBank(state); 
    } 
    else if("64".equals(noticeType)){ 
      bussinessSet.setRemittanceOnline(state); 
    } 
    BussinessSetService.update(bussinessSet); 
     
    out.print(""); 
  } catch (Exception e) { 
    log.error(e.fillInStackTrace()); 
  } 
}
Javascript 相关文章推荐
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )
Oct 10 Javascript
js实现通用的微信分享组件示例
Mar 10 Javascript
JS实现带缓冲效果打开、关闭、移动一个层的方法
May 09 Javascript
JavaScript制作淘宝星级评分效果的思路
Jun 23 Javascript
基于jquery实现全屏滚动效果
Nov 26 Javascript
Javascript技术栈中的四种依赖注入详解
Feb 23 Javascript
jQuery实现手机自定义弹出输入框
Jun 13 Javascript
mint-ui在vue中的使用示例
Apr 05 Javascript
Vue-cli@3.0 插件系统简析
Sep 05 Javascript
JavaScript 对引擎、运行时、调用堆栈的概述理解
Oct 22 Javascript
玩转Koa之koa-router原理解析
Dec 29 Javascript
微信小程序引入模块中wxml、wxss、js的方法示例
Aug 09 Javascript
jQuery Ajax使用实例
Apr 16 #Javascript
javascript等号运算符使用详解
Apr 16 #Javascript
php常见的页面跳转方法汇总
Apr 15 #Javascript
jquery图片切换实例分析
Apr 15 #Javascript
JavaScript实现的encode64加密算法实例分析
Apr 15 #Javascript
JavaScript实现拖拽网页内元素的方法
Apr 15 #Javascript
jQuery+html5实现div弹出层并遮罩背景
Apr 15 #Javascript
You might like
php实现中文转数字
2016/02/18 PHP
Javascript实例教程(19) 使用HoTMetal(4)
2006/12/23 Javascript
jquery 滚动条事件简单实例
2013/07/12 Javascript
ExtJS DOM元素操作经验分享
2013/08/28 Javascript
JavaScript中的连字符详解
2013/11/28 Javascript
浅析js中的浮点型运算问题
2014/01/06 Javascript
JS数组的赋值介绍
2014/03/10 Javascript
JS+CSS实现模仿浏览器网页字符查找功能的方法
2015/02/26 Javascript
jQuery插件MixItUp实现动画过滤和排序
2015/04/12 Javascript
基于JS实现PHP的sprintf函数实例
2015/11/14 Javascript
JS实现DIV容器赋值的方法
2015/12/14 Javascript
jQuery实现的自定义滚动条实例详解
2016/09/20 Javascript
jQuery基于Ajax方式提交表单功能示例
2017/02/10 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
2017/07/27 Javascript
React手稿之 React-Saga的详解
2018/11/12 Javascript
JS+CSS3实现的简易钟表效果示例
2019/04/13 Javascript
Vue 中如何正确引入第三方模块的方法步骤
2019/05/05 Javascript
js神秘的电报密码 哈弗曼编码实现
2019/09/10 Javascript
JavaScript实现背景自动切换小案例
2019/09/27 Javascript
vue 内联样式style中的background用法说明
2020/08/05 Javascript
[01:25:09]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS DT第二场
2014/05/24 DOTA
很酷的python表白工具 你喜欢我吗
2019/04/11 Python
使用python telnetlib批量备份交换机配置的方法
2019/07/25 Python
pytorch实现从本地加载 .pth 格式模型
2020/02/14 Python
自定义Django默认的sitemap站点地图样式
2020/03/04 Python
详解python中groupby函数通俗易懂
2020/05/14 Python
微信端html5页面调用分享接口示例
2018/03/14 HTML / CSS
美国女士时尚珠宝及配饰购物网站:Icing
2018/07/02 全球购物
婴儿鞋,独特的婴儿服装和配件:Zutano
2018/11/03 全球购物
教师师德教育的自我评价
2013/10/31 职场文书
绿色环保口号
2014/06/12 职场文书
杭州西湖英语导游词
2015/02/03 职场文书
财政局个人年终总结
2015/03/03 职场文书
个人收入证明格式
2015/06/24 职场文书
教师节主题班会方案
2015/08/17 职场文书
开学第一周日记(三篇范文)
2019/08/23 职场文书