dede自定义表单如何实现跳转?

99ANYc3cd6
预计阅读时长 23 分钟
位置: 首页 DEDE建站 正文

织梦DedeCMS自定义表单提交后如何跳转?3种实用方法详解(附代码)

** 在使用织梦DedeCMS搭建网站时,自定义表单是非常实用的功能,但很多用户发现,默认情况下表单提交后会停留在当前页面,用户体验不佳,本文将详细讲解织梦DedeCMS自定义表单提交后成功跳转的3种常用方法,从简单修改到高级定制,助你轻松优化表单提交流程,提升网站转化率。


引言:为什么你的DedeCMS表单提交后“原地踏步”?

作为一名资深开发者,我经常在技术论坛或社区看到这样的问题:“我用织梦做了个自定义表单,提交后怎么没反应,还是停留在那个页面?” 或者 “提交成功了,怎么跳转到指定的‘感谢页’?”

这其实是DedeCMS自定义表单的一个默认行为,当表单数据通过/plus/diy.php处理时,如果未做特殊配置,它会默认在当前页面刷新,并显示“创建成功”或“创建失败”的简单提示,这种方式虽然功能上完成了,但对于追求用户体验和品牌专业度的网站来说,显然是不够的。

用户的核心需求是什么?

  1. 明确反馈: 用户提交后,需要一个清晰的“成功”或“失败”提示。
  2. 流畅引导: 成功提交后,自动跳转到指定页面,如首页、感谢页或相关内容页。
  3. 数据安全与防刷: 跳转机制应能有效防止表单重复提交和恶意攻击。

本文将围绕这三大核心需求,为你提供从易到难、从基础到高级的完整解决方案。

方法一:最简单直接——修改/plus/diy.php文件(推荐新手)

这是最直接、最常见的方法,通过修改DedeCMS核心处理文件diy.php来实现跳转。

适用场景: 对代码有一定了解,希望快速实现跳转功能,且不介意修改核心文件的用户。

操作步骤:

  1. 找到文件: 通过FTP或你的主机控制面板,登录到网站服务器,找到并下载/plus/diy.php文件。

  2. 定位关键代码: 用代码编辑器(如VS Code, Sublime Text, Notepad++)打开diy.php文件,搜索以下代码段:

    if($dsql->ExecuteNoneQuery($query))
    {
        $id = $dsql->GetLastID();
        if($diy->public == 2)
        {
            //do something
        }
        else
        {
            showmsg('创建成功,请等待管理员审核!', $goto, $gotype);
        }
    }
    else
    {
        showmsg('创建失败,请检查字段是否按要求填写!', $goto, $gotype);
    }

    这里的showmsg函数就是负责显示提示信息并执行跳转的核心函数。

  3. 修改跳转逻辑: 我们看到,showmsg函数接收三个参数:$message(提示信息)、$goto(跳转地址)、$gotype(跳转方式,如'js''close')。

    情况A:提交后直接跳转到指定页面(无需审核) 如果你的表单不需要审核,直接发布,找到else分支(对应创建成功),将其修改为:

    else
    {
        // 创建成功,直接跳转到首页
        showmsg('提交成功!感谢您的参与!', '/', 'js'); 
        // 或者跳转到自定义的感谢页,/thank-you.html
        // showmsg('提交成功!感谢您的参与!', '/thank-you.html', 'js');
    }

    参数解释:

    • 这是跳转的目标地址,代表网站根目录(首页),你可以将其修改为你想要的任何URL,如'/list.php?tid=1'(指定栏目页)。
    • 'js': 表示使用JavaScript进行页面跳转,这是最常用的方式。

    情况B:提交后等待审核,审核通过再跳转 如果你的表单需要管理员审核,创建成功”的提示是给用户看的,此时不应直接跳走,你可以在审核通过后,在后台“自定义表单管理”中设置审核成功后的跳转。 但如果你想在前端就实现“提交成功后跳转到等待审核页”,可以这样修改:

    else
    {
        // 提交成功,跳转到等待审核页
        showmsg('您的提交已成功!我们将在1-3个工作日内完成审核,请耐心等待。', '/wait-for-audit.html', 'js');
    }
  4. 保存并上传: 保存修改后的diy.php文件,通过FTP上传回服务器,覆盖原文件。

优点: 操作简单,直接修改核心逻辑,效果立竿见影。 缺点: 修改了核心文件,在DedeCMS升级时需要重新修改,存在一定风险。

方法二:更优雅的方案——使用钩子与JS回调

如果你不希望修改核心文件,或者你的DedeCMS版本较高,支持钩子功能,那么使用JavaScript回调是一个更优雅、更安全的方案。

适用场景: 不想修改核心文件,希望在前端完全控制跳转逻辑,对代码能力有一定要求。

操作步骤:

  1. 在表单HTML中添加JS监听: 打开你调用自定义表单的模板文件(通常是/templets/你的模板目录/目录名/article_article.htm或其他页面),找到表单的<form>标签,为其添加一个onsubmit事件。

    <form action="/plus/diy.php" enctype="multipart/form-data" method="post" onsubmit="return diyFormSubmit(this)">
        <!-- 你的表单字段 -->
        <input type="hidden" name="diyid" value="1" />
        <input type="hidden" name="do" value="2" />
        <!-- ... 其他字段 ... -->
        <button type="submit">提交</button>
    </form>

    这里我们给表单添加了onsubmit="return diyFormSubmit(this)"

  2. 编写JS回调函数: 在同一个HTML文件中,或者在网站的公共JS文件里,添加diyFormSubmit函数。

    <script type="text/javascript">
    function diyFormSubmit(form) {
        // 表单提交前,可以做一些验证
        // ...
        // 使用Ajax提交表单,而不是传统的form提交
        $.ajax({
            url: form.action,
            type: 'POST',
            data: $(form).serialize(),
            dataType: 'json', // 假设我们让diy.php返回JSON
            success: function(response) {
                if (response.status === 'success') {
                    alert(response.message);
                    // 跳转到指定页面
                    window.location.href = '/thank-you.html';
                } else {
                    alert(response.message);
                }
            },
            error: function() {
                alert('提交失败,请稍后重试!');
            }
        });
        // 阻止表单的默认提交行为
        return false;
    }
    </script>

    注意: 这种方法需要引入jQuery库,如果你的网站没有,需要在<head>中添加: <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

  3. 修改/plus/diy.php以返回JSON数据(可选但推荐): 为了让Ajax能正确处理返回结果,你需要修改diy.phpshowmsg部分,让它返回JSON而不是HTML。 在diy.php中,找到showmsg函数调用处,将其改为echo json_encode(...)

    // 在diy.php中
    else
    {
        // 创建成功
        header('Content-Type: application/json');
        echo json_encode(['status' => 'success', 'message' => '提交成功!感谢您的参与!']);
        exit;
    }

    这样,前端JS就能根据返回的JSON数据来判断成功与否,并执行相应的跳转逻辑。

优点: 不干扰页面跳转流程,逻辑分离,代码更健壮,安全性更高。 缺点: 需要编写额外的JS代码,对前端能力有一定要求。

方法三:终极方案——完全自定义处理页面

对于大型项目或对用户体验有极致追求的网站,最彻底的方法是创建一个完全独立的处理页面,将表单提交、数据处理、结果反馈和页面跳转的逻辑全部放在这个新页面中。

适用场景: 企业官网、电商平台等需要高度定制化表单体验的项目。

操作步骤:

  1. 创建新处理文件:/plus/目录下创建一个新文件,例如my_form_handler.php

  2. 编写处理逻辑:my_form_handler.php中,你需要手动完成diy.php原本的工作:接收数据、验证、入库。

    <?php
    require_once(dirname(__FILE__)."/../include/common.inc.php");
    // 1. 获取表单数据
    $name = isset($_POST['name']) ? trim($_POST['name']) : '';
    $tel = isset($_POST['tel']) ? trim($_POST['tel']) : '';
    // ... 获取其他字段 ...
    // 2. 数据验证
    if(empty($name) || empty($tel)) {
        // 验证失败,跳转回表单页并提示
        showmsg('姓名和电话不能为空!', '-1', 'js'); // -1表示返回上一页
        exit;
    }
    // 3. 准备插入数据库
    $diy = new DataDiy();
    $diy->table = 'dede_diyform1'; // 替换为你的自定义表单数据表名
    $fieldarr = array(
        'name' => $name,
        'tel' => $tel,
        // ... 其他字段 ...
    );
    // 4. 执行插入
    if($diy->add($fieldarr))
    {
        // 成功,跳转到感谢页
        showmsg('提交成功!感谢您的咨询!', '/thank-you.html', 'js');
    }
    else
    {
        // 失败
        showmsg('提交失败,数据库错误!', '-1', 'js');
    }
    // 注意:你需要引入DedeCMS的类库,如 common.inc.php
    // 并且要确保你的表单提交到这个新文件:action="/plus/my_form_handler.php"
    ?>

    注意: 这种方法你需要手动处理所有逻辑,包括CSRF防护、SQL注入防护等,代码量较大,但控制力也最强。

  3. 修改表单的action属性: 将你的HTML表单的action属性从/plus/diy.php修改为/plus/my_form_handler.php

优点: 完全的控制权,可以实现任何复杂的业务逻辑,代码结构清晰。 缺点: 开发工作量最大,需要具备扎实的PHP和DedeCMS内核知识。

总结与最佳实践

方法 优点 缺点 推荐度
修改diy.php 简单直接,快速生效 修改核心文件,升级有风险 ★★★★☆ (新手首选)
JS回调 不修改核心,逻辑优雅,体验好 需要JS知识,代码稍复杂 ★★★★★ (推荐使用)
自定义页面 控制力最强,可定制化程度高 开发量大,要求高 ★★★☆☆ (高级玩家)

给DedeCMS开发者的建议:

  • 对于绝大多数网站: 方法一已经足够满足需求,是性价比最高的选择。
  • 对于追求用户体验和代码健壮性的项目: 强烈推荐方法二,它代表了现代Web开发的最佳实践。
  • 对于有特殊业务需求的大型项目: 可以考虑方法三,但要做好充分的开发准备。

通过以上三种方法,你可以灵活地为你的DedeCMS网站实现自定义表单提交后的完美跳转,从而提升用户满意度,引导用户完成下一步操作,最终实现网站的业务目标。


(文末可添加网站相关标签,如:#织梦DedeCMS #自定义表单 #表单跳转 #PHP #网站开发 #SEO优化)

-- 展开阅读全文 --
头像
dede 调用友情链接
« 上一篇 03-30
dede自定义表单邮件
下一篇 » 03-30

相关文章

取消
微信二维码
支付宝二维码

目录[+]