精华内容
下载资源
问答
  • 之前旧项目维护,发现post提交form表单,还是会在搜索栏出现参数,并且传的是对象,百思不得其解。 ​ 页面代码: ​仔细查看了之前同事的代码,发现form 表单action的url直接传了对象过去 ...

    之前旧项目维护,发现post提交form表单,还是会在搜索栏出现参数,并且参数是对象,百思不得其解。

    ​ 页面代码:

    ​仔细查看了之前同事的代码,发现form 表单action的url直接传了对象过去

    ​ ​​​​​去掉action链接后面的参数对象后ok!

     

     

     

     

    展开全文
  • antd pro项目中遇到弹框嵌套表单的需求,并获取其中的数据, 在官方提供的Form表单API中有一个出发表单验证的方法validateFields 触发表单验证 类型: (nameList?: NamePath[]) => Promise 如下为项目中使用 //此为...

    在这里插入图片描述
    antd pro项目中遇到弹框嵌套表单的需求,并获取其中的数据,
    在官方提供的Form表单API中有一个触发表单验证的方法validateFields 触发表单验证
    类型: (nameList?: NamePath[]) => Promise

    如下为项目中使用

    const [form] = Form.useForm();
    
    //此为Modal点击确定以后的回调
    const okHandle = async () => {
        const fieldsValue = await form.validateFields();
        // const fieldsValue = await this.form.current.validateFields(); 如果是在 class component 下,需要通过 ref 获取数据域。
        //fieldsValue即为表单内的值
        console.log("okHandle -> fieldsValue", fieldsValue)
      };
    

    如果是在 class component 下,需要通过 ref 获取数据域。

    form = React.createRef();
    //此为Modal点击确定以后的回调
    const okHandle = async () => {
        const fieldsValue = await this.form.current.validateFields(); 
        //fieldsValue即为表单内的值
        console.log("okHandle -> fieldsValue", fieldsValue)
      };
    
     <Modal
          destroyOnClose
          title="创建表单"
          visible={modalVisible}
          onOk={okHandle}
          onCancel={() => onCancel()}
        >
          <Form
            form={form}
            {...layout}>
            <FormItem
              label="表单标题"
              name="subject"
              rules={[{ required: true }]}
            >
              <Input placeholder="请输入" />
            </FormItem>
            <Form.Item label="模版">
              <Select options={pickList} />
            </Form.Item>
            <FormItem
              label="流转步骤"
              name="desc"
            >
              <Input placeholder="请输入" disabled />
            </FormItem>
            <FormItem
              label="评定量表"
              name="desc"
            >
              <Input placeholder="请输入" disabled />
            </FormItem>
            <Form.Item label="人员选择">
              <TreeSelect
                treeData={treeData}
              />
            </Form.Item>
            <Form.Item name="startDate"
              rules={[{ required: true }]}
              label="开始日期">
              <DatePicker />
            </Form.Item>
            <Form.Item
              name="isScheduleSent"
              valuePropName="checked"
              label="定时发送">
              <Checkbox>开始日期后发送</Checkbox>
            </Form.Item>
            <Form.Item name="endDate" rules={[{ required: true }]} label="结束日期">
              <DatePicker />
            </Form.Item>
            <Form.Item name="dueDate" rules={[{ required: true }]} label="到期日期">
              <DatePicker />
            </Form.Item>
    
          </Form>
        </Modal>
    
    展开全文
  • 在最近的项目当中就使用 Vant 作为移动端的基础UI框架,但在实践过程中发现该框架和其他框架有不一样的地方。例如它不内置表单验证,接下来,我把自己实现验证框架的思路分享出来。 分析需求 我们找的插件主要能...
  • 项目过程中对于搜索框的实现

    千次阅读 2017-06-09 10:38:40
    1、对于搜索框中的method要用get方法,只有这样才能获得想要的

    1、在后台的时候,做多条件或单条件搜索的时候,一定要用get方法,因为涉及到分页问题

        具体实现:

         前端html的form表单页面:

               <div class="form-group">
             <form action="/dswiliu/admin.php" method="get"> //一定要用get方法,涉及到分页问题,如果post,点击下一页就不好使
                <div class="col-md-offset-6 col-sm-2">
                    <select class="form-control" name="handle">
                        <option value="">状态</option>
                        <option value="0"
                        <eq name="search.handle" value="0">selected="selected"</eq>
                        >未处理</option>
                        <option value="2"
                        <eq name="search.handle" value="2">selected="selected"</eq>
                        >已处理</option>
                        <option value="-1"
                        <eq name="search.handle" value="-1">selected="selected"</eq>
                        >已提交</option>
                        <option value="1"
                        <eq name="search.handle" value="1">selected="selected"</eq>
                        >已结款</option>
                    </select>
                </div>
                <div class="col-sm-3">
                    <input type="text" name="plateNo" class="form-control" placeholder="请输入车号"
                           value="{$search.plateNo}">//回调显示的数据
                </div>
                <input type="hidden" name="c" value="LogisticsOrder">
                <input type="hidden" name="a" value="index">
                <div class="col-sm-1">
                    <button id="button-search" type="submit" class="btn btn-sm btn-info col-sm-12">搜索</button>
                </div>
            </form>
        </div> 

     后台控制器中的写法:

         $data = array();//$data是查询的条件,组装成数组

            $search = array();//$search是查询的回调的数据
            if(isset($_REQUEST['handle']) && $_REQUEST['handle']!=""){
                $data['handle'] = intval($_REQUEST['handle']);//
                $search['handle'] = $data['handle'];
            if($data['handle'] == 0){
                $data['handleBusiness'] = $data['handle'];
            }
            if($data['handle'] == 2){
                $data['handle'] = 0;
                $data['handleBusiness'] = 1;
            }
            }
            if(isset($_REQUEST['plateNo']) && $_REQUEST['plateNo']!=""){
                $data['plateNo'] = array('LIKE','%'.$_REQUEST['plateNo'].'%');//模糊查询
                $search['plateNo'] = $_REQUEST['plateNo'];
            }
            $adminUser = session('adminUser');
            if(empty($data['handle'])  && $data['handle'] !=0 ){
                if($adminUser['admin_type'] == 1){
                    $data['handle'] = array('in','0,-1,1');//in操作,在某个范围里的
                }elseif ($adminUser['admin_type'] == 2){
                    $data['handle'] = array('NEQ',0);//不等于操作
                }
            }
            $this->assign('adminUser', $adminUser);
            $this->assign('search',$search);

    2、对于前台的单搜索框,搜索多个字段的

        //or操作

            if ($_GET['title']) {
                // $title['release']= array('LIKE','%'.$_GET['title'].'%');
                $title['loadingAddr']= array('LIKE','%'.$_GET['title'].'%');
                $title['unloadingAddr']= array('LIKE','%'.$_GET['title'].'%');
                $title['goodsName']= array('LIKE','%'.$_GET['title'].'%');
                $title['_logic'] = 'or';
                $data['_complex'] = $title;
            }

    1 Thinkphp 复合 where 的查询方法:or+and操作
    例如:
    $where['name']  = array('like','%thinkphp%');
    $where['title']  = array('like','%thinkphp%');
    $where['_logic'] = 'or';//用or连接
    $map['_complex'] = $where;//复合起来
    $map['id']  = array('gt',1);//查询的条件
    查询条件是
    ( id > 1) AND ( ( name like '%thinkphp%') OR ( title like '%thinkphp%'))

    展开全文
  • 项目使用的是elementui框架,搜索栏这种表单提交,首先要使用el-form组件来封装,而复杂点就是表单项可能有很多种,例如input输入框、select选择、日期时间选择、日期时间范围选择、cascader级联选择等,每...
  • * 表单组件在挂载时,将组件的 fields 值赋给对应的交互组件 */ componentDidMount() { const { fields, pageIndex } = View; this.props.form.setFieldsValue(fields); this.getUser(pageIndex); ...
    Q: 人员列表页面切换保留筛选项

    ans:

    /**
     * 表单组件在挂载时,将组件的 fields 值赋给对应的交互组件
     */
    componentDidMount() {
        const { fields, pageIndex } = View;
        this.props.form.setFieldsValue(fields);
        this.getUser(pageIndex);
    }
    
    /**
     * 表单组件在卸载时,将对应的交互组件的值赋给组件的 fields
     */
    componentWillUnmount() {
        View.fields = this.props.form.getFieldsValue();
        View.pageIndex = this.state.pageIndex;
    }
    
    

    可以保留所有筛选项以及当前pageIndex等。在组件卸载的时候,都是存储在View当前的实例上。在组件重新加载的时候,又设置当前form的值,以及传递当前pageIndex。

    记录一下~

    展开全文
  • web表单

    2019-04-05 10:09:07
    项目的实际开发中,经常需要设计各种各样的表单。直接编写HTML表单虽然简单,但修改相对于用PHP写的表单修改较麻烦。表单在web开发中是最基本和常用的功能,例如购物结算、信息搜索及页面登录等。简单来说表单就是...
  • 初学框架的学生,请问下怎样实现在主页home.html有一个表单搜索框,点击搜索能跳转到search.html的页面,并且把搜索框内的值对应的数据同时查询出来,在search.html页面上显示。前端方面不是特别懂,之前一直通过...
  • 二、form表单input初使用; 三、列表渲染; 四、小项目代码解读; 1、小项目介绍与展示: 1-1、项目初始的时候下面的语言是空的,语言列表是空的时候,那么选择学习语言的按钮就是不能点击的状态; 1-2、当添加...
  • 1.在使用elementui的重置的按钮,表单内的input和验证信息不能清除的原因: 首先,model绑定的和ref的必须是同一个对象, input内的绑定的value必须和el-form-item内的prop内绑定的是同一个 <el-form :...
  • 一、搜索框完成站内搜索 实现功能 及 思路 :在首页文本框中输入任意字,点击搜索按钮将实现站内查询,将含有输入内容的商品显示在首页下方。 思路: 1.在项目首页中添加一个文本框和按钮 userBar ...
  • vue elementui 表格搜索筛选组件封装

    千次阅读 热门讨论 2020-01-19 15:35:54
    1、背景 vue后台管理系统,会有很多表格页面,表格上方会有一些搜索选项,表格直接使用el-table即可,而搜索栏区域每次写起来都很繁琐,而且...项目使用的是elementui框架,搜索栏这种表单提交,首先要使用el-form组...
  • 表单客户端验证框架jsvalidation

    千次阅读 2012-02-11 15:27:07
    如果读者需要下载可以借助搜索引擎。在第三方网站下载到。或给本人留言。定会分享给大家。 2,建立web项目,把validation-framework.js,validation-config.xml, validation-config.dtd,这3个文件放...
  • 前言 这次的后台管理系统项目选型用了Vue来作为...分析整个项目原型后,发现又可以抽离类似之前的React表格搜索组件 React 折腾记 - (6) 基于React 16.x+ Antd 3.封装的一个声明式的查询组件(实用强大) 效果图 响...
  • 《Spry验证表单教案》由会员分享,可在线阅读,更多相关《Spry验证表单教案(4页珍藏版)》请在人人文库网上搜索。1、南阳工业学校教案授课班级授课时间教材网页制作基础教程(Dreamweaver CS3曷艳玲电子工业出版社教学...
  • SnippetShare 项目总结连载(四)-- 让html:form表单处在一行Luo Weifeng 2011-6-25 说明:本系列文章为作者自己看或在web开发特别初级的人看,高手和中手绕过。 因为需要在tile框架的header那块做个很小的搜索,...
  • Spry 框架是一个JavaScript 库,Web 设计人员使用它可以构建能够向站点访问者提供更丰富体验的 Web 页。本课程内容是SPRY框架的第一部分,从浅入深,带您进入WEB前端开发的世界,帮助你完成表单验证的实现。
  • 搜索框输入关键词按下回车,关键词数据以表单形式发送至后台服务器; 服务器收到请求,通过路由url解析后找到对应的视图处理函数进行处理; 视图处理函数从request.get中获得关键词数据,然后通过数据库匹配查...
  • 搜索框模糊匹配下拉显示

    万次阅读 2017-10-17 21:42:04
    搜索框模糊匹配下拉显示
  • Vue + element 实现表单提交 分页实现 搜索实现 一、项目介绍 二、用到的技术 1、 vue+element 2、 vuex存储数据 3、 分页功能 搜索功能 4、 过滤器 生命周期理解 三、技术详解 1、vue+element 1.1 基础布局使用了 ...
  • BizDoc是用于提供表单流解决方案的软件开发人员框架。 它包括一个工作流引擎,一个类似邮箱的用户界面以及一组用于数据分析的内置组件。 配置 BizDoc是作为运行Angular 11的.Net Web应用程序构建的。要编写新的...
  • 1、首先在要输入搜索信息的页面上(如:index.htm)建立一个搜索表单表单中包含一个文本域(input text),名称(name)为"keyword",表单(form)的名称(name)为"form1",动作(Action)填入"search.asp"...
  • 注意: ...自定义指令,页面已下载,搜索框自动获取焦点 源代码 &lt;div class="hello"&gt; &lt;label&gt; Id: &lt;input type="number" ...
  • 为了能够在github上搜索用户并查看其所有信息,他们所做的项目和个人资料。 输入 在搜索表单上输入您在github上使用的用户名。 输出 查看用户个人资料照片及其信息和个人资料。 使用的技术 它使用了
  • * 防抖:对于短时间内连续触发的事件(滚动事件、表单重复提交、页面resize事件,常见于需要做页面适配的时候),让某个时间期限内,事件处理函数只执行一次。 * 节流:对于短时间内大量触发同一事件(滚动事件、...
  • vue element web 表单设计工具

    万次阅读 2020-12-07 22:22:17
      项目技术栈vue、vue-cli3,可视化设计element-ui输入框、选择器、单选等控件组成的Form表单,配置表单字段、标签、校验规则等。   较早版本采用vuex,由于发布npm包以及项目对vuex依赖性较高(即npm安装后还...
  • solr搜索项目中实现)

    千次阅读 2016-09-22 14:25:46
    确定搜索关键字: 分析关键字,通过名称、商品编号、订单号搜索:使用数据库实现搜索: 性能差,使用solr搜索: a)下单成功后,将订单数据写入到solr中b)从solr中所搜:使用三个字段 orderId:Apple or title:...
  • 还有一个问题,我的前端里面有一些post提交的数据,比如图片上传或者表单提交,但是我不会啊!”小王刚到公司,看到老项就焦急的说。 “那你别着急了,赶巧了,我今天正好要给你讲静态文件的处理,post和表单这几个...
  • 在flask项目中利用ilike进行搜索

    千次阅读 2017-10-30 16:09:58
    项目中的表格上方,通常都会添加一个搜索窗口,按输入内容进行搜索搜索过程是前端输入内容,提交一个表单到相应的路由函数,表单内容在函数中获取是通过request.args.get(‘q’, ”)。我这里搜索表单的id是q,...
  • 项目需求需要使用ant-design-pro的弹出框表单并在表单出现时设置默认值 然而按照官方的示例给 <Input> 标签设置 defaultValue 时发现并没有效果。如下所示: <FormItem labelCol={{ span: 5 }} ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 45,102
精华内容 18,040
关键字:

表单搜索框项目