您好,欢迎来到搜123网站分类目录!
当前位置:搜123网站分类目录 » 站长资讯 » 网站运营 » 文章详细 订阅RssFeed

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

来源:互联网 浏览:158次 时间:2019-09-25
自定义表单通过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="提 交" οnclick="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);


推荐站点

  • 十二星座生肖网十二星座生肖网

    十二星座生肖网,提供星座、生肖、个性、开运方法、运势、配对、解梦以及命理分析、血型、算命、风水等星相生肖命理信息。

    www.12xzsx.com
  • 汇吃的汇吃的

    汇吃的是一个美食分享平台,是一个分享美食制作方法的地方,也有美食故事的分享,提供图文菜谱大全,享受美食的乐趣,找美食菜谱,就上汇吃的。

    www.huichide.com
  • 中国天气网中国天气网

    中国天气网官方权威发布天气预报,逐三小时天气预报,提供天气预报查询一周,天气预报15天查询,空气质量,生活指数,旅游出行,交通天气等查询服务

    www.weather.com.cn
  • 520设计网520设计网

    520设计-中国网页平面设计师交流平台,专为酷爱网页设计、界面设计的你而倾力打造。拥有设计视频教程、网页模板、设计素材、CSS3+HTML5、网页平面设计视频教程、设计师网址导航等相关内容,它将成为你设计路上的一位好伙伴!

    www.sj520.cn
  • 天极网天极网

    天极网,全球最大的中文IT门户,专注IT产品采购及应用指南,每天为广大用户提供电脑硬件,软件,数码,商情,手机,笔记本,游戏,互联网,数字家庭,教育,下载等内容,解决网友工作学习中的技术疑难,指导数字科技消费,领引时尚生活潮流.

    www.yesky.com