web建站教程
  1. 首页
  2. vuejs
  3. js
  4. 好玩
  5. seo教程
  6. 前端知识
  7. 百度echarts
  8. 更多
    php入门
    nodejs
    mockjs
    reactjs
    mysql
    wordpress
    织梦cms
    帝国cms
    git教程
    IT知识
    模板大全
    休息站

织梦自定义表单通过ajax提交的实现方法

662 ℃
           

自定义表单通过ajax判断,提交不用跳转页面,提高用户体验。具体方法如下:

html表单代码部分,就提交按钮改成botton,,添加onclick事件

表单代码:

<form action="javascript:;" enctype="multipart/form-data" method="post">

<input type="hidden" name="action" value="post" />

<input type="hidden" name="diyid" value="1" />

<input type="hidden" name="do" value="2" />

<label>姓名:<input type="text" id="name" name="name" value="" /></label>

<label>电话:<input type="text" id="tel" name="tel" value="" /></label>

<label>手机:<input type="text" id="iphone" name="iphone" value="" /></label>

<label>邮箱:<input type="text" id="email" name="email" value="" /></label>

<table>

<tr>

<td valign="top">留言:</td>

<td><textarea id="liuyan" name="liuyan"></textarea></td>

</tr>

</table>

<input type="hidden" name="dede_fields" value="name,textchar;tel,textchar;iphone,textchar;email,textchar;liuyan,multitext" />

<input type="button" class="submit fr" value="提 交" onclick="add_ajaxmessage()"/>

</form>

js代码(这个代码之前一定要引入jQuery库):

function add_ajaxmessage(){

var name=document.getElementById("name");

var tel =document.getElementById("tel");

var iphone=document.getElementById("iphone");

var email=document.getElementById("email");

var liuyan=document.getElementById("liuyan");

//定义变量接收上面表单每项的值和几个dede隐藏的input的值

var dataString = 'name='+ name.value + '&tel=' + tel.value + '&iphone=' + iphone.value + '&email=' + email.value + '&liuyan='+ liuyan.value +'&action=post'+ '&diyid=1&do=2&dede_fields=name,textchar;tel,textchar;iphone,textchar;email,textchar;liuyan,multitext';

$.ajax({

type: "POST",

url: "/plus/diy.php", //提交到后台文件

data: dataString, //传值

success: function(data) {

alert(data);//成功打印PHP返回的值

}

});

return false;

}

php代码:

找到:if(!empty($dede_fields))

{

//在里面加入判断语句,不判断也可以

if($name==""){

echo "请填写您的姓名!";//注意:输出用echo输出,不要用showMsg();

exit();

}

}

找到:$goto = !empty($cfg_cmspath) ? $cfg_cmspath : '/';

$bkmsg = '发布成功,请等待管理员处理…';

这两句,改成:echo "提交成功!";

删掉下面这一句:showmsg($bkmsg, $goto);

jQuery如何做一个简单ajax交互功能

简单介绍前端开发清除页面缓存的几种方法

jQuery利用reset函数清空(重置)form表单数据

layui表单如何实现单行和多行(自动换行)

dedecms文章评论功能用法分析

标签: action, ajax清除缓存, form, 自定义, 表单

上面是“织梦自定义表单通过ajax提交的实现方法”的全面内容,想了解更多关于 织梦cms 内容,请继续关注web建站教程。

当前网址:https://ipkd.cn/webs_420.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

当前位置: 网站首页 > 织梦cms
本文共计1820个字,预计阅读时长13分钟
生活小工具,收录了80多款小工具
上一篇: 介绍几款带有中国风古韵的免费可商用中文字体
下一篇: 推荐9款支持 Vue3 免费开源的前端 UI 组件库
x 打工人ai神器