ajax方式实现dedecms织梦表单提交不跳转

在使用dede表单的时候通常提交之后会导致页面跳转,因为php的post提交数据必须要进行页面的刷新才能实现,下面这个方法是之前自己研究过用ajax的方式来提交数据,目的是数据提交成功用对话框的方式提醒来替代原先跳转网页方式的提交成功提醒。

转为ajax提交需要对form做一些修改:

1、首先将form元素的原来属性action、enctype、method都去掉,添加id=”form”,form元素就变为<form id=”form”>

2、在页面的head区域引入jQuery文件<script src=”/jquery-1.8.2.min.js”></script>点击下载文件

3、提交按钮不再使用<button>标签,而是使用input来替代,type值为button,语法:<input type=”button” value=”提 交” onclick=”add_ajaxmessage()” />注意:必须带上onclick点击事件,执行函数 onclick=”add_ajaxmessage()

4、每个表单的id必须设置,而且要跟name值必须是一致的

5、将dede的原始表格去除,这些数据将填写在ajax代码里例如:

<input type=”hidden” name=”action” value=”post” />
<input type=”hidden” name=”diyid” value=”1″ />
<input type=”hidden” name=”do” value=”2″ />
<input type=”hidden” name=”dede_fields” value=”dh,text;xy,text;nr,multitext” />
<input type=”hidden” name=”dede_fieldshash” value=”Md5字符串” />

6、接下来,将以下代码复制并粘贴到页面的最底部</body>之前
<script type=“text/javascript”>
function add_ajaxmessage(){
var dataString =
‘dh=’+dh.value+ //表单的name和id值必须一致,注意:这一行最前面不能带有’&’符号
‘&yx=’+yx.value+ //表单的name和id值必须一致,多个input请自行复制此行代码
‘&nr=’+nr.value+ //表单的name和id值必须一致,多个input请自行复制此行代码
‘&action=post’+
‘&diyid=1&do=2&dede_fields=dh,text;yx,text;nr,multitext&dede_fieldshash=ad50c1ee216430a63d64780d3e5e7262;
//红色为<input type=”hidden” name=”dede_fields” value=”dh,text;xy,text;nr,multitext” />里面的内容
//蓝色为md5字符串

$.ajax({
type: “POST”,
url: “/plus/diy.php”,//提交到后台文件
data: dataString,//传值
success: function(data) {
//$(“#666”).html(data);//以html的形式显示在指定id的元素里,看下面注释01
alert(data);//显示PHP返回的值,如不需要显示,注释掉这行即可
$(‘#form’)[0].reset();//提交后清除id=”form”的值
}
});
return false;
}
</script>

ajax方式实现dedecms织梦表单提交不跳转
ajax方式实现dedecms织梦表单提交不跳转

可能描述得不够详细,如果不懂可以联系站长qq:87748556

未经允许不得转载:转载请注明出处-代码猫代码猫 » ajax方式实现dedecms织梦表单提交不跳转
分享到:
赞(0)

评论抢沙发

评论前必须登录!

日主题已更新到 V3.2版本

点我日她