加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

SSM3坏境下ajax和html disabled 引发的问题和总结

发布时间:2020-12-16 00:59:09 所属栏目:百科 来源:网络整理
导读:在 SSM3环境下做一个修改和增加的功能用ajax异步完成,如果没有就增加有就修改。。。 界面 rule. jsp htmlhead%@ include file="/common/jquery-ui-inc.jsp" %scriptvar objName = "商品物流规则";var add_do="${ctx}/admin/prod/pro-rule"; $(document).rea

在 SSM3环境下做一个修改和增加的功能用ajax异步完成,如果没有就增加有就修改。。。 界面

rule. jsp

<html>
<head>
<%@ include file="/common/jquery-ui-inc.jsp" %>
<script>
var objName = "商品物流规则";
var add_do="${ctx}/admin/prod/pro-rule";
   
$(document).ready(function() {
	  
 //  设定input 只能输入数字和小数点              
$("#oneprod").keydown(function(event) {
                 var keyCode = event.which;
                 if (keyCode == 46 || keyCode == 8 || keyCode == 190 || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105) || keyCode == 110) {
                     return true;
                 } else { return false }
             }).focus(function() {
                 this.style.imeMode = 'disabled';
             }) ;
             $("#oneprods").keydown(function(event) {
                 var keyCode = event.which;
                 if (keyCode == 46 || keyCode == 8 || keyCode == 190 || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105) || keyCode == 110) {
                     return true;
                 } else { return false }
             }).focus(function() {
                 this.style.imeMode = 'disabled';
             });
             $("#oneprodsmoney").keydown(function(event) {
                 var keyCode = event.which;
                 if (keyCode == 46 || keyCode == 8 || keyCode == 190 || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105) || keyCode == 110) {
                     return true;
                 } else { return false }
             }).focus(function() {
                 this.style.imeMode = 'disabled';
             });
         });


function save(){
   if($("#oneprodsmoney").val()=='' ||  $("#oneprods").val()=='' ||  $("#oneprod").val()=='' ) {
	    alert('请将价格信息填写完整!');
	    return false;
   }
	
	
	$.ajax({
		url: add_do,type: 'POST',cache: false,
 		// 将from表单的所有元素的value值进行拼接成形如:name=value&name=value..的字符串给后台传值  这里千万注意 元素的disabled属性如                    果为true那么这个元素的值是不进行拼接的也就是不传递
                data: $("#myForm").serializeArray(),
                        success: function(data){
			var oTxt = data;
			var mess = oTxt.message;	
			var flag = oTxt.flag;
			window.confirm(mess);
			//2  再次刷新
                       window.location.href="${ctx}/admin/proadmin-rule?prodid=${product.prodid}";
			
		}
	});
	
}	
</script>
</head>
<body>

<div id="O_add"  class="easyui-pannel" icon="icon-edit" >
<form id="myForm">
 
<input type="hidden" id="prodid" name="prodid" value="${product.prodid}">
// 后台通过这个值来判断是保存还是修改
  但ajax方式的提交导致该值并不会改变除非再次刷新
<input type="hidden" id="oneprod1" name="oneprod1" value="${product.oneprod}">


<table class="openwin" cellspacing="1" cellpadding="0" align="center" width="100%">
<tr><th>商品名称</th><td><input type="text" id="prodname" name="proname"  value="${product.proname}"  onfocus=this.blur()></td></tr>
<tr><th>商品编号</th><td><input type="text" id="prodcode" name="prodno"   value="${product.prodno}"  onfocus=this.blur()></td></tr>
<tr><th>商品单位</th><td><input type="text" id="produnit" name="produnit"  value="${product.produnit}"  onfocus=this.blur()></td></tr>

<tr>
	<th>一${product.produnit}价格</th>
	<td><input type="text" id="oneprod" name="oneprod"   min="0"  maxlength="15" value="${product.oneprod}" />
		元
	</td>
</tr>

<tr><th>一件</th><td><input type="text" id="oneprods" name="oneprods"  value="${product.oneprods}" min="0" maxlength="15">${product.produnit}</td></tr>	
<tr><th>一件</th><td><input type="text" id="oneprodsmoney" name="oneprodsmoney"  value="${product.oneprodsmoney}" min="0" maxlength="15">元</td></tr>	
<tr>
 <th>备注</th>
 <td>
  <textarea rows="10" cols="38" name="bak" id="bak" >${product.bak}</textarea>
 </td>
</tr>
<tr><td colspan="2">
        <center>
		<a href="javascript:void(0);" onclick="save();" class="easyui-linkbutton" iconCls="icon-save">提交</a>
	    </center>
	</td>
</tr>
</table>
</form>
</div>

</body></html>

后台action

点击菜单物流规则设置 第一次执行下面方法到达上面页面

/**
	 * 商品物流规则
	 */
	
	@RequestMapping("proadmin-rule")
	public ModelAndView proWuliuRule(@RequestParam(value="prodid",required=false) String prodid){
	   ChProductWuliuRule product =prorule.getProductRuleById(prodid);
	   if(product==null){
		   ChProduct product1=productManager.getProduct(prodid); 
		   product=new ChProductWuliuRule();
		   product.setProname(product1.getProdname());
		   product.setProdno(product1.getProdcode());
		   product.setProdunit(product1.getProdunit());
		   product.setProdid(product1.getProdid());
		   //product.setOneprods(-1);  
	   }
	   return new ModelAndView("admin/prodadmin/rule","product",product);
	   
	}

点击提交

/**
	 * 增加或者修改商品物流规则
	 */
	
	@RequestMapping(value="pro-rule",method=RequestMethod.POST)
	public @ResponseBody Map<String,String> proSaveRule(ChProductWuliuRule product,String oneprod1,HttpServletRequest request) {

		String oneprod=oneprod1;
	
		
		
		Map<String,String> map = new HashMap<String,String>();
        // 当oneprod为'' 或者为null的时候添加
		if (oneprod.equals("") || oneprod.equals(null)) {
            try {
            	prorule.saveProductRule(product);
				map.put("flag","true");
				map.put("message","添加商品物流规则成功");

			} catch (Exception e) {
				map.put("flag","false");
				map.put("message","添加商品物流规则失败");
				logger.error("异常信息:" + e.getMessage());
			}
        // 否则修改方法
		} else {
			try {
			String createtime=DateUtils.format (DateUtils.getDate(),"yyyy-MM-dd HH:mm:ss");
		    product.setUpdatedate(DateUtils.parse(createtime,"yyyy-MM-dd HH:mm:ss"));
				
			prorule.updateProductRule(product);
				map.put("flag","修改商品物流规则成功");
			} catch (Exception e) {
				map.put("flag","修改商品物流规则失败");
				logger.error("异常信息:" + e.getMessage());
			}
		}
		return map;
	}

问题出现了 第一次显示页面的时候String oneprod1为空 我会进行添加 但因为是ajax方式的提交所以页面并没有进行刷新也就是说我再次点击提交他依旧会去添加而不是修改

但数据库要求数据唯一所以我在页面//2 处添加了刷新。

问题二 因为元素为了让他只读我把他设置成了disabled 所以导致值没被传过去而引发了一些错误。。

注意 :1 ajax为异步无刷新提交 从请求到响应页面还是请求钱的那个页面值还是那些值并没有改变如果以后用此方式提交 又用到了该页面的值来做其他业务 是会有问题的

你可以根据需要动态改变页面的值或者重新刷新。

2. 可以用其他方式来进行设置元素只读 参见

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读