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 相关文章推荐
PHP执行速率优化技巧小结
Mar 15 PHP
PHP 引用是个坏习惯
Mar 12 PHP
php中json_encode中文编码问题分析
Sep 13 PHP
PHP代码网站如何防范SQL注入漏洞攻击建议分享
Mar 01 PHP
php版淘宝网查询商品接口代码示例
Jun 17 PHP
标准PHP的AES加密算法类
Mar 12 PHP
PHP的Yii框架入门使用教程
Feb 15 PHP
PHP实现163邮箱自动发送邮件
Mar 29 PHP
php获得文件夹下所有文件的递归算法的简单实例
Nov 01 PHP
php将print_r处理后的数据还原为原始数组的解决方法
Nov 02 PHP
PHP实现微信图片上传到服务器的方法示例
Jun 29 PHP
Laravel 简单实现Ajax滚动加载示例
Oct 22 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
smarty 原来也不过如此~~呵呵
2006/11/25 PHP
在任意字符集下正常显示网页的方法一
2007/04/01 PHP
php 什么是PEAR?(第二篇)
2009/03/19 PHP
三个类概括PHP的五种设计模式
2012/09/05 PHP
php颜色转换函数hex-rgb(将十六进制格式转成十进制格式)
2013/09/23 PHP
学习php开源项目的源码指南
2014/12/21 PHP
php检查字符串中是否包含7位GSM字符的方法
2015/03/17 PHP
大家须知简单的php性能优化注意点
2016/01/04 PHP
php爬取天猫和淘宝商品数据
2018/02/23 PHP
php 的多进程操作实践案例分析
2020/02/28 PHP
[原创]提供复制本站内容时出现,该文章转自脚本之家等字样的js代码
2007/03/27 Javascript
js为鼠标添加右击事件防止默认的右击菜单弹出
2013/07/29 Javascript
写得不错的jquery table鼠标经过变色代码
2013/09/27 Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
2013/11/22 Javascript
使用GruntJS构建Web程序之构建篇
2014/06/04 Javascript
JavaScript中关联原型链属性特性
2016/02/13 Javascript
jquery checkbox的相关操作总结
2016/10/17 Javascript
jquery仿苹果的时间/日期选择效果
2017/03/08 Javascript
js实现关闭网页出现是否离开提示
2017/12/07 Javascript
javascript的惯性运动实现代码实例
2019/09/07 Javascript
vue 单页应用和多页应用的优劣
2020/10/22 Javascript
Python将图片批量从png格式转换至WebP格式
2020/08/22 Python
解决vscode python print 输出窗口中文乱码的问题
2018/12/03 Python
python线程定时器Timer实现原理解析
2019/11/30 Python
Python使用configparser库读取配置文件
2020/02/22 Python
python 基于opencv 实现一个鼠标绘图小程序
2020/12/11 Python
HTML5 微格式和相关的属性名称
2010/02/10 HTML / CSS
用html5的canvas画布绘制贝塞尔曲线完整代码
2013/08/14 HTML / CSS
医院学雷锋活动策划方案
2014/02/15 职场文书
离婚协议书范文2014(夫妻感情破裂)
2014/12/14 职场文书
前台接待岗位职责
2015/02/03 职场文书
2015年收银工作总结范文
2015/04/01 职场文书
汶川大地震感悟
2015/08/10 职场文书
python实现大文本文件分割成多个小文件
2021/04/20 Python
postgresql无序uuid性能测试及对数据库的影响
2021/06/11 PostgreSQL
Java实现给Word文件添加文字水印
2022/02/15 Java/Android