各类知识收集,PHP技术分享与解决方案各类知识收集,PHP技术分享与解决方案各类知识收集,PHP技术分享与解决方案

Str Tom,为分享PHP技术和解决方案,贡献一份自己的力量!
收藏本站(不迷路),每天更新好文章!
当前位置:首页 > CMS教程 > eyoucms

form 表单标签

管理员 2023-04-08
eyoucms
311
【基础用法】
标签:form
描述:表单提交
用法:
{eyou:form type='default' formid='表单ID' id='field'}
<form method="POST" action="{$field.action}{$field.formhidden} onsubmit="{$field.submit}" >
    <input id="attr_1" type="text" value="" name="{$field.attr_1}" placeholder="{$field.itemname_1}">
    <input id="attr_2" type="text" value="" name="{$field.attr_2}" placeholder="{$field.itemname_2}">
    <textarea id="attr_3" cols="40" rows="3" name="{$field.attr_3}" placeholder="{$field.itemname_3}"></textarea>
    <input type="submit" value="提交">
    {$field.hidden}
</form>
{/eyou:form}


属性:

{$field.formhidden} 为表单支持图片上传属性
{$field.submit} 为表单使用内置的JS验证用户输入内容的格式
{$field.attr_1} 为表单属性字段名称 (示例见图一)
{$field.itemname_1} 为表单属性提示文字
formid='' 指定文档ID,如果没有指定则获取当前留言模型的栏目ID

type='default' 默认类型,表单属性标签一个个添加,后台新增属性,也手工复制到模板form表单里。优点是方便调整和美化表单结构页面。

----type='auto' 表单属性自动循环显示,后台新增属性也自动显示。缺点是表单结构和美化不够灵活,需要一定的css前端技术

empty='' 当前留言版块的表单被删完时,显示的文案内容
id='' 可以任意指定循环里的变量名替代field,假设id='field1',模板调用如:{$field.title} 变成 {$field1.title}
涉及表字段:
请查阅易优cms官方提供的数据字典,找到表名 ey_form、ey_guestbook、ey_guestbook_attr、ey_guestbook_attribute

 

(图一,如按示例里,{$field.attr_1}应改为{$field.attr_45}

-------------------------------效果展示--------------------------------
1,留言表单调用
模板调用代码
{eyou:form type='default' formid='表单ID' id='field'}
<form action="{$field.action}" {$field.formhidden}  method="post" onsubmit="{$field.submit}">
        <li>
          <input class="login_input" name="{$field.attr_1}" type="text" id="attr_1" placeholder="{$field.itemname_1}"/>
        </li>
        <li>
          <input class="login_input" name="{$field.attr_2}" type="text" id="attr_2" placeholder="{$field.itemname_2}"/>
        </li>
        <li>
          <textarea class="login_textarea" name="{$field.attr_3}" id="attr_3" cols="30" rows="10" placeholder="{$field.itemname_3}"></textarea>
        </li>
        <li>
          <input class="login_btn common_bg" id="baidu-book" type="submit" value="提   交"/>
        </li>
        {$field.hidden}
</form>
{/eyou:form}
网站前端显示效果(css样式请自行填充)


 
【更多示例】
-------------------------------示例1--------------------------------
描述:完全的留言表单(单行文本框、多行文本框、下拉列表框、JS表单验证)
{eyou:form type='default' formid='表单ID' id='field'}
<form method="POST" {$field.formhidden} action="{$field.action}" onsubmit="return checkForm();">
    <input id="attr_5" type="text" value="" name="{$field.attr_5}" placeholder="{$field.itemname_5}">
    <textarea id="attr_6" cols="40" rows="3" name="{$field.attr_6}" placeholder="{$field.itemname_6}"></textarea>
    <select name="{$field.attr_7}" id="attr_7">
        <option value="无">无</option>
        {eyou:volist name='$field.options' id='vo'} <!-- 下拉列表循环 start -->
            <option value="{$vo.value}">{$vo.value}</option>
        {/eyou:volist} <!-- 下拉列表循环 end -->
    </select>
    <input type="submit" value="提交">
    {$field.hidden} <!-- 不可缺少的隐藏令牌验证 -->
</form>
<script type="text/javascript">
    function checkForm() {
        if (document.getElementById('attr_5').value.length == 0) {
            alert('{$field.itemname_5}');
            return false;
        }
        return true;
    }
</script>
{/eyou:form}
-------------------------------示例2--------------------------------
描述:表单属性自动循环输出,后台添加属性,前台表单属性自动显示

{eyou:form type="auto" formid="表单ID" id="field"}

<form method="POST" {$field.formhidden} action="{$field.action}" onsubmit="{$field.submit}">

    <!-- 自动表单属性 -->

    {eyou:volist name="$field.attrlist" id="attr"}

        {$attr.attr_name}:{$attr.attr_html}

    {/eyou:volist}

    <!-- 提交 -->

    <input class="button bg-yellow button-large button-block border-none radius-none text-white" type="submit" value="提交"/>

    <!-- 不可缺少的隐藏令牌验证 -->

    {$field.hidden}

</form>

{/eyou:form}


相关推荐

扫码关注

qrcode

QQ交谈

回顶部