thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例


Posted in PHP onMarch 02, 2020

本文实例讲述了thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json。分享给大家供大家参考,具体如下:

知识点总结

1.json格式标准

{

'key':"value"

}

{"state":"1","msg":"\u7b80\u5386\u6295\u9012\u6210\u529f\uff01"}

thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例

thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例

前端jquery ajax提交formdata 

$.ajax({

})

thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例

 formdata 获取表单数据 包括文件上传

thinkphp5 + ajax 使用formdata提交数据(包括文件上传) 后台返回json完整实例

 HTML

<form class="am-form" id="recruitinfo">

        <div class="col-lg6 col-md-6 col-xs-12 m1rem">
          <label>姓名</label>
          <input type="text" name="post[name]" id="name" required >
        </div>

        <div class="col-lg6 col-md-6 col-xs-12 m1rem">
          <label>手机号</label>
          <input type="text" name="post[iphone]" id="iphone" required>
        </div>

        <div class="col-lg10 col-md-10 col-xs-12 m2rem">

          <label>附件简历:(您的详细信息请都写在简历上,只接受word文档)</label>

          <div class="am-form-group am-form-file">
            <button type="button" class="am-btn am-btn-danger am-btn-sm">
              <i class="am-icon-cloud-upload"></i> 选择要上传的简历</button>
            <input id="doc-form-file" type="file"  name="doc" >
          </div>
          <div id="file-list"></div>
          <script>
            $(function() {
              $('#doc-form-file').on('change', function() {
                var fileNames = '';
                $.each(this.files, function() {
                  fileNames += '<span class="am-badge">' + this.name + '</span> ';
                });
                $('#file-list').html(fileNames);
              });
            });
          </script>

          <input type="hidden"  name="post[jobname]" id="jobname"  value="{$data.job}">
          <input type="hidden"  name="post[jobnameid]" id="jobnameid" value="{$data.id}">


        </div>

        <div class="col-lg-6 col-md-6 col-xs-12">
          <button type="submit" class="am-btn am-btn-primary" onclick="submitform()">提交</button>
          <a href="javascript:window.history.back(-1);" rel="external nofollow" class="am-btn am-btn-default">返回</a>
        </div>

      </form>

 JS

<script type="text/javascript">
        function submitform() {

          event.preventDefault();
          var form =document.getElementById('recruitinfo'),
            formdata = new FormData(form);


          var url = '{:url("recruitinfo/postfrom")}';


          $.ajax({
            url:url,
            type:'post',
            data:formdata,
            dataType:'json',
            processData:false,
            contentType:false,
            success:function (res) {
              console.log('请求成功!')
              console.log(res)
            },
            error:function (XMLHttpRequest, textStatus, errorThrown) {
              console.log('出错啦!')
              console.log(XMLHttpRequest);
              console.log(textStatus);
              console.log(errorThrown);
            }
          })

        }
      </script>

php json_encode()函数转成json

$callbackinfo = array(
          'state' => '1',
          'msg'  => '简历投递成功!',
        );
        

        $jsondata =json_encode($callbackinfo);

       
        echo $jsondata;

问题

1.前端SyntaxError: Unexpected token < in JSON at position 0 报错

报错原因

使用的thinkphp5

没想到是因为使用了dump()函数 var_dump 这些最后echo出来的不正确导致的,还要要按标准格式来啊

解决方法

去掉dump相似的函数

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。

PHP 相关文章推荐
人大复印资料处理程序_输入篇
Oct 09 PHP
require(),include(),require_once()和include_once()的异同
Jan 02 PHP
PHP和Mysqlweb应用开发核心技术 第1部分 Php基础-1 开始了解php
Jul 03 PHP
PHP调用MsSQL Server 2012存储过程获取多结果集(包含output参数)的详解
Jul 03 PHP
php将url地址转化为完整的a标签链接代码(php为url地址添加a标签)
Jan 17 PHP
PHP 用session与gd库实现简单验证码生成与验证的类方法
Nov 15 PHP
php如何实现不借助IDE快速定位行数或者方法定义的文件和位置
Jan 17 PHP
PHP/HTML混写的四种方式总结
Feb 27 PHP
PHP解决中文乱码
Apr 28 PHP
PHP7使用ODBC连接SQL Server2008 R2数据库示例【基于thinkPHP5.1框架】
May 06 PHP
在laravel中实现将查询的对象转换为多维数组的函数
Oct 21 PHP
PHP使用PDO实现mysql防注入功能详解
Dec 20 PHP
php加速缓存器opcache,apc,xcache,eAccelerator原理与配置方法实例分析
Mar 02 #PHP
让whoops帮我们告别ThinkPHP6的异常页面
Mar 02 #PHP
php高性能日志系统 seaslog 的安装与使用方法分析
Feb 29 #PHP
PHP中关于php.ini参数优化详解
Feb 28 #PHP
php多进程并发编程防止出现僵尸进程的方法分析
Feb 28 #PHP
php 的多进程操作实践案例分析
Feb 28 #PHP
php 下 html5 XHR2 + FormData + File API 上传文件操作实例分析
Feb 28 #PHP
You might like
PHP中mysql_field_type()函数用法
2014/11/24 PHP
PHP浮点数的一个常见问题
2016/03/10 PHP
PHP通过引用传递参数用法分析
2016/12/01 PHP
Laravel框架Eloquent ORM删除数据操作示例
2019/12/03 PHP
XML+XSL 与 HTML 两种方案的结合
2007/04/22 Javascript
jquery 图片 上一张 下一张 链接效果(续篇)
2010/04/20 Javascript
js对象的构造和继承实现代码
2010/12/05 Javascript
jQuery最佳实践完整篇
2011/08/20 Javascript
contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
2011/09/13 Javascript
js获取触发事件元素在整个网页中的绝对坐标(示例代码)
2013/12/13 Javascript
jQuery focus和blur事件的应用详解
2014/01/26 Javascript
JavaScript仿商城实现图片广告轮播实例代码
2016/02/06 Javascript
在 Angular 中实现搜索关键字高亮示例
2017/03/21 Javascript
Vue resource中的GET与POST请求的实例代码
2017/07/21 Javascript
javascript 缓冲运动框架的实现
2017/09/29 Javascript
Angular4 反向代理Details实践
2018/05/30 Javascript
JavaScript文本特效实例小结【3个示例】
2018/12/22 Javascript
layui实现数据表格隐藏列的示例
2019/10/25 Javascript
详解JavaScript修改注册表的方法
2020/01/05 Javascript
浅谈JavaScript中this的指向问题
2020/07/28 Javascript
Python爬虫番外篇之Cookie和Session详解
2017/12/27 Python
解决Python requests库编码 socks5代理的问题
2018/05/07 Python
使用Django搭建一个基金模拟交易系统教程
2019/11/18 Python
python3 pathlib库Path类方法总结
2019/12/26 Python
python 追踪except信息方式
2020/04/25 Python
django中嵌套的try-except实例
2020/05/21 Python
药学专业毕业生求职信
2013/10/20 职场文书
大学生职业生涯规划书模版
2013/12/30 职场文书
大学辅导员事迹材料
2014/02/05 职场文书
2014全国两会学习心得体会1000字
2014/03/10 职场文书
2014年五一活动策划方案
2014/03/15 职场文书
学校课外活动总结
2014/05/08 职场文书
大学生党员自我剖析材料
2014/10/06 职场文书
2015年药店店长工作总结
2015/04/29 职场文书
Java实现斗地主之洗牌发牌
2021/06/14 Java/Android
SpringDataJPA在Entity中常用的注解介绍
2021/12/06 Java/Android