pbootcms独立手机端自定义表单

去年给一个做机械配件的独立端自定义客户改站，对方突然提了个要求：手机端打开的手机产品详情页，要单独挂一个“获取图纸”的表单按钮，点进去填表单，独立端自定义字段和PC端完全不同——不要公司名，手机只要姓名、表单微信号、独立端自定义产品型号。手机默认的表单PbootCMS表单模型根本做不到，因为它是独立端自定义全站统一配置的。

问题就卡在PbootCMS的手机“表单”是全局的，你建一个表单，表单PC和手机共用同一套字段。独立端自定义手机屏幕小，手机字段一多，表单用户填到一半就跑了。客户要的是极简，PC端可以详细，手机端必须短平快。这需求其实很常见，但网上搜PbootCMS手机端独立表单，教程全是让你做两个站或者用JS判断跳转，绕远路。

后来我直接在模板层解决了，不碰后台核心代码。思路很简单：PbootCMS允许在模板里直接用{ pboot:if}判断终端，再配合自定义的HTML表单提交到同一个地址。关键是，你得给这个独立表单单独写一个接收处理的逻辑。

具体操作分两步。第一步，在手机端模板的详情页里，加一段判断代码：

{ pboot:if(IS_MOBILE)} <form action="/index.php?c=message&a=add" method="post"> <input type="hidden" name="typeid" value="5"> <input type="text" name="username" placeholder="您的称呼"> <input type="text" name="wechat" placeholder="微信号"> <input type="text" name="model" value="{ content:title}" readonly> <button>申请图纸</button> </form> { else} 正常的PC端表单代码 { /pboot:if}

这里有个坑：PbootCMS默认的表单提交会校验字段，如果你在后台建的“表单模型”里没有定义“wechat”这个字段，提交会报错。所以第二步，得去后台——内容中心——表单模型——新建一个专门给手机端的表单，字段就填姓名、微信号、产品型号，然后记下这个表单的typeid值（比如5）。

但你以为这样就完了？不行。因为PbootCMS的表单提交地址是同一个，它会把数据写进同一个表。手机端提交的“产品型号”字段，在PC端表单里可能叫“产品编号”，后台看数据时字段对不上。我的处理办法很粗暴——在接收页面用PHP脚本做一次字段映射，把手机端的“model”值，写到PC端表单对应的“cpbh”字段里去。虽然土，但管用。

还有一种更干净的做法，直接改模板的提交地址，给手机端单独写一个控制器。但PbootCMS的二次开发文档写得不全，非程序员容易卡在路由规则上。我建议普通用户就用上面的方法，改模板加字段映射，半小时能搞定。

最后说个细节。手机端的表单按钮，别用默认的样式，不然和主题不搭。我习惯在模板里直接写内联CSS，比如给按钮加个圆角、背景色用主题的主色，用户看着才像原生的。还有，提交后的跳转页，最好单独做一个手机版的提示页，别直接跳回PC的“提交成功”页面，那个页面在手机上排版是乱的。

这么弄下来，客户那边手机端转化率明显涨了，原来表单填写完整率不到三成，现在简化后能到六成。其实PbootCMS没那么死板，只是默认设置偏向PC思维。你只要愿意在模板层动刀，它也能适应移动端的脾气。