FormData Ajax转PHP [英] FormData ajax to php

查看:91
本文介绍了FormData Ajax转PHP的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大家好,我目前正在使用的系统有问题.
我正在通过ajax发送数据.问题是当我试图回显我在 php 文件中发送的数据时,出现了 undefying 变量的错误,但是当我使用var_dumping时在 php 中,它向我显示了此 array .

hi guys i have a problem with the system that i'm currently work.
I'm sending data through ajax. and the problem is that when i'm trying to echo out the data that i'm send in php file there was an error of undefying variables but when i'm var_dumping in php it shows me this array.

array(20){["------ WebKitFormBoundaryaw2Fqe4TLPU8WGtMContent-Disposition:_form-data; name] => string(948)""pimage";filename ="C:\ fakepath \ 2772.png"内容类型:image/png?PNGIHDRæ$?sBIT ?? O?pHYsp#p#{?? tEXtSoftwarewww.inkscape.org ??字符串(0)" ['()* _,-_/0123456789:;<"] =>字符串(415)>?@ ABCDEFGHIJKLMNOPQRSTUVWXYZ [\] ^ _`abcdefghijklmnopqrstuvwxyz {|}〜????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????? 6?'??? IDATx ???{T ????DV!?ZT ?? *Ÿ???,[!PQQ?U?T?`??-$ @ ???????(?? @(QH ???> O ??? ibf?{?wy ????? = ??? {?5Z ?? v ??????H?'I =?w ??? $ ???#NfT?c?Q?gV ??????string(5)?)?%""[" M?b?C?ry ?? z?`???????#h?gVxA ?? 2 ???? $ ?? * ?? _ 6EfyA?a?eI` ?????"nz,n ??????????? ^^ LELEXh6_pbT?hJ?#rZ ?? VDN?)`"????k?y?_rZl?] =>字符串(161)"dN ??.???'?.??????.?k?9A`52'??? p ???Š?" tJ???:%Z ^ ??]?d"sR?9 ?? sR?]?dN ??? A7?B'ŽA?32'E?0 ?? o ?? B ????k?81ZZ?B $ N?^ ?? 6?!???? N?9A`4?"["G ?? _ ydtp ??" m?t9T?"H?" ?? *?1¦I ?? _ XD?_h?4 ?? i?01 ?? f ?? 3?]??Z`sk $ i5 |?JB ?? n?h ???? h?] =>字符串(0)""["?ˆ ??> t???? 9 ?????? Ws ????string(0)" ["????????; Dh?n?@t?4 @ ??? $ h?n?(???-?"] =>字符串(946)"7?,?V?FPh?MPHO ???? j?X^^#a ?? 4 @ M?,??? a ?? P?x?K?m5?(??? @ kh ???? D,?V ?? 2,?O ??

array(20) { ["------WebKitFormBoundaryaw2Fqe4TLPU8WGtM Content-Disposition:_form-data;name"]=> string(948) ""pimage"; filename="C:\fakepath\2772.png" Content-Type: image/png ?PNG IHDRæ$?sBIT??O? pHYsp#p#{??tEXtSoftwarewww.inkscape.org?? string(0) "" ["'()*_,-_/0123456789:;<"]=> string(415) ">?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~?????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????????6?'??IDATx???{T???? DV!?ZT??*Ÿ??,[!PQQ?U?T?`??-$@???? ???(??@(QH???>O???ibf?{?wy?????=???{?5Z??v?????? H?'I=?w???$???#NfT?c?Q?gV?????? string(5) "?)?%"" ["M?b?C?ry??z?`????#h?gVxA??2?? ??$??*??_6EfyA?a?eI`??"nz,n???????????^?LE??Xh6_pbT?hJ?#rZ??VDN?)`"???? ?k? ?y?_rZl?"]=> string(161) "dN??.???'?.?????.?k?9A`52'???p???Š?"tJ? ??:%Z^??]?d"sR?9?? sR?]?dN???A7?B'ŽA?32'E?0 ??o??B??? ?k?81ZZ?B$N?^??6?!????N?9A`4?" ["G??_ydtp??"m?t9T?"H?"??*?1¦I??_??XD?_h?4??i?01??f??3?]?) ?Z`sk$i5|?JB??n?h????h?"]=> string(0) "" ["?ˆ??>t? ???9?????Ws???? string(0) "" ["??????? ?;Dh?n?@t?4@???$h?n?(???-?"]=> string(946) " 7?,?V?FPh?MPHO????j?X ^^#a??4@M?,???a??P?x?K?m5?(???@k h????D,?V??2,?O??

?? @??DdX ???????-?b ???? a ???? a ?? 0?a ???%?a ???? a ??P ?? @ kh ?? @ [?? a ?? 0?a ????? c?9S?O ?? N?2,?VP {^%d ?????? a ?????? JHKT ??? j ??? 4Rh ?? 4 @ EhY-PQ?1?,???(14f ???? @ [x?a ?????? de?|| Gv ??? @ [8 ?? @ kHEdX ?? tDdX ??? D?XF ??/j> ?? k ???? u?J [?〜?] k}?85|-?"L?)?〜-mF ???? s?0q ??-?cH?8 ??-@@ o $ L-@ ??> ??? k?@h?r?(?@h?r?(?@ h?r?h?@h?r ?? f ????? @ h?rstring(193)?u ??"?SX?x?SIgz?Xh @ 8 ?? Id ??? P:??? CB9 ?????? {????; 5%???'?? $ ;? T $ ?????? 8 ??? Ch @?X ???/E?4`Gk5 ?? $ ?? i @?w ??? 5?'';?? 0 ???? 4`6 ?????? GpR ?????????? N ?? Ep?5`"[" ??????? n(?(?? N?tAp?5`4 ??? N ?? Ep?5 ??)?? N o_?3 ???? n ????ª] =>string(0)" ["???????????? 4?/??"] => string(0)" ["?? ^??c?\ ?? i?M?CX1?t`U] =>字符串(0)"[?7?_ ?? g#?/??〜_C ?? _ c ?? s?)yl ???"?s ???? s ?? qb _ ?? _ ????? ## 1ue?? 1 _ ??? 9?e?4?p9wLMJ4?M?C ?? 4E?_?Q?4?D!?^?〜4;?e?jY ??? n?U?6?]?a ?? a ??/?a ????'???〜???????? 6O9 ?? {?wb?,fj ????? 9?_ ?? 6 ?? vA???????,vPz ?? o?{fn?H ???,?? Cki?? f ?? 7?z ?????? y5Y?;?r ??] =>字符串(175)"?? c ??? 2 ???? 7?-j)?O ??? t〜?> j ?? n ??? k/??????'???[?????? U?S?〜UZ ?????? qn ??????? >>?a?0??s#?? w?=?Y?; :: R?W ?? v ??? Q ?????? a4 ????t ???} \ ??? b?u1 ??? x ?? \?z ?? ^?1?"["?q ???? f?<)'??; @? E3]] =>string(32)"I?>!???:c9 ????? )?gX?a?〜?"[?L ???? Dx%??? t ?? Dx ?? _ ???'????-?p ?? O?WL?T?K ??#^ ??'G" {] =>string(82)] G?ry?ifP?r ???; n ?? D?R ???? p ?? @ ?? m? ?? @ Sw ??? B ?? m?7?y ????? _?Zn?".[>?b ??> ??"] =>string(409)!?7:M?7?y ?????? $〜?0 ????;?e(??? 0?E ???? g.?P??t}?> ????? q] ??是吗?0RD?Bg ??? 0n/wh?w ?? D?;?m ?????〜G ?? g ?? 0DH?pG? IU ????)?F,????????? W [?,?y ## ???`?o8 ???!??? ?? ulg?\?{?? 1?[:9b?S'?????? w \?}?n ??????? q?z"[?q?"] =>字符串(0)"["U1:??? 4 ?????? {Y4?M ?? R] ?? J * ?????? m_?〜??] T ??????? J ??????? _ ???? I7 ???? 1n ?? q ?? $?0 ?? Ow?x¬x?? y?v?(x ?????]]>array(1){[" _z ??%?u05?:???? q ?????] =>字符串(452)""pname"测试------ WebKitFormBoundaryaw2Fqe4TLPU8WGtM内容处置:form-data;name ="psupplier" 1 ------ WebKitFormBoundaryaw2Fqe4TLPU8WGtM内容处置:表单数据;name ="pquant" 123------ WebKitFormBoundaryaw2Fqe4TLPU8WGtM内容处置:form-data;name ="pprice" 123 ------ WebKitFormBoundaryaw2Fqe4TLPU8WGtM内容处置:表单数据;name ="pdate" 2017-12-26------ WebKitFormBoundaryaw2Fqe4TLPU8WGtM--}}

??@??DdX???????-?b????a????a??0?a???%?a????a??P??@k h??@[ ??a??0 ?a?????c?9S?O??N?2,?V P{^%d????a?????JHKT???j???4Rh??4@EhY - PQ?1?,???(14f????@[ x?a?????de?||Gv???@[ 8??@k HEdX??tDdX???D?XF??/ j>??k????u?J[?~?]k}?85?? |-?"L?)?~-mF????s?0q??-?cH?8??-@o$L-@??>???k?@h?r?(?@h?r?(?@h?r?h?@h?r??f?????@h?r string(193) "?u??"?SX?x ?SIgz?Xh@8??Id???P:???CB9?? ????{????;5 %???'??$;?T$????8???Ch@?X??/ E?4`Gk5??$??i@?w???5?"'; ??0????4`6?????GpR??????????N??Ep?5`" ["????n (?(??N?tAp?5`4???N??Ep?5??)??N o_?3????n ????ª"]=> string(0) "" ["????a??4?/??"]=> string(0) "" [" ??^? ?c?\??i?M?CX1?t`U"]=> string(0) "" ["?7?_??g#?/??~_C??_c??s?)yl???"?s????s??qb_??_?????#??1ue??1_???9?e?4?p9wLMJ4?M?C??4E?_?Q?4??D!?^?~4;?e?jY???n?U ?6?]?a??a??/?a????'??~????????6O9??{?wb?,fj?????9?_??6??vA??????,vPz??o?{fn?H???,??Cki ??f??7?z??????y5Y?;?r?? "]=> string(175) "??c???2????7?-j)?O???t~?>j??n???k/?????'? ? ?[????U?S?~UZ?????qn???????>?a?0? ?s#??w?=?Y?;:?R?W??v???Q??????a4???? t???}\???b?u1???x??\?z??^?1?" ["?q????f?<)'??;@?E3]"]=> string(32) "I?>!???:c9?????)?gX?a?~?" ["?L????Dx%???t??Dx??_???'????-?p??O?WL?T?K??#^??'G"{"]=> string(82) "]G?ry?ifP?r???;n??D?R??? ?p??@??m???@Sw???B??m"?7?y?????_?Zn?." [">?b??>??"]=> string(409) "!? 7:M?7?y???????$~?0????;?e(???0?E????g.?P??t}"?>?????q]??Y? 0RD?Bg???0n/wh"?w??D?;?m?????~G??g?? 0DH?pG?<?c?:??.?? ??N??????i???I C???r?Ÿ?? r?%?#??}???????w??]G??wE9?BV???'??F??}???<@?,'?}#V?8???n?a????????? .;~??iq??)p?M?-?@??xN?G????H*??d ?j?????????1IU????)??F,????????W[?,?y##???`?o8???!?????ulg?\?{??1?[:9b?S'??????w\?}?n???????q?z" ["?q?"]=> string(0) "" ["U1:???4?????{Y4?M??R]??J*??????m_?~??]T???????J???????_????I7????1n??q??$?0??Ow?x¬x??y?v?(x?????"]=> array(1) { ["_z??%?u05?:????q?????"]=> string(452) ""pname" test ------WebKitFormBoundaryaw2Fqe4TLPU8WGtM Content-Disposition: form-data; name="psupplier" 1 ------WebKitFormBoundaryaw2Fqe4TLPU8WGtM Content-Disposition: form-data; name="pquant" 123 ------WebKitFormBoundaryaw2Fqe4TLPU8WGtM Content-Disposition: form-data; name="pprice" 123 ------WebKitFormBoundaryaw2Fqe4TLPU8WGtM Content-Disposition: form-data; name="pdate" 2017-12-26 ------WebKitFormBoundaryaw2Fqe4TLPU8WGtM-- " } }

这是我的ajax代码.

here's my ajax code.

function getName(key)
{
    key = document.getElementsByName(key)[0];
    return key;
}

function getId(key)
{
    key = document.getElementById(key);
    return key;
}

function message(id, message, color = 'black')
{
    getId(id).style.color = color;
    getId(id).innerHTML = message;
}

function loadImage(handler)
{
    if(handler.files && handler.files[0])
    {
        var reader = new FileReader();

        reader.onload = function(e)
        {
            getId('productImagepreview').src = e.target.result;
        }

        reader.readAsDataURL(handler.files[0]);
    }
}

function xhrCreateProduct()
{
    var url = getId('formcProduct').getAttribute('action');

    var image = getName('prodimage');
    var name = getName('prodname');
    var supplier = getName('prodsupplier');
    var quantity = getName('prodquant');
    var price = getName('prodprice');
    var date = getName('proddate');

    var imagevalue = image.value.trim();
    var namevalue = name.value.trim();
    var suppliervalue = supplier.value.trim();
    var quantityvalue = quantity.value.trim();
    var pricevalue = price.value.trim();
    var datevalue = date.value.trim();

    var valid_image = imagevalue.substring(imagevalue.lastIndexOf('.')+1).toLowerCase();


    if(imagevalue == null || imagevalue == '')
    {
        message('msg_pimage', '* Provide product image', 'red');
        image.focus();
        return false;
    }
    else
    {
        message('msg_pimage', '');
    }

    if(valid_image != 'jpg' && valid_image != 'png' && valid_image != 'gif')
    {
        message('msg_pimage', '* File is not an image type', 'red');
        image.focus();
        return false;
    }
    else
    {
        message('msg_pimage', '');
    }

    if(namevalue == null || namevalue == '')
    {
        message('msg_pname', '* Provide product name', 'red');
        name.focus();
        return false;
    }
    else
    {
        message('msg_pname', '');
    }

    if(suppliervalue == null || suppliervalue == '')
    {
        message('msg_psupplier', '* Provide product supplier', 'red');
        supplier.focus();
        return false;
    }
    else
    {
        message('msg_psupplier', '');
    }

    if(quantityvalue == null || quantityvalue == '')
    {
        message('msg_pquant', '* Provide product quantity', 'red');
        quantity.focus();
        return false;
    }
    else
    {
        message('msg_pquant', '');
    }

    if(pricevalue == null || pricevalue == '')
    {
        message('msg_price', '* Provide product price', 'red');
        price.focus();
        return false;
    }
    else
    {
        message('msg_price', '');
    }

    if(datevalue == null || datevalue == '')
    {
        message('msg_pdate', '* Provide the date product come', 'red');
        date.focus();
        return false;
    }
    else
    {
        message('msg_pdate', '');
    }

    var xhr = null;

    if(window.XMLHttpRequest)
    {
        xhr = new XMLHttpRequest();
    }
    else
    {
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    }

    var sendData = new FormData();

    sendData.append('pimage', image.files[0], imagevalue);
    sendData.append('pname', namevalue);
    sendData.append('psupplier', suppliervalue);
    sendData.append('pquant', quantityvalue);
    sendData.append('pprice', pricevalue);
    sendData.append('pdate', datevalue);


    xhr.open('POST', url, true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send(sendData);

    xhr.onreadystatechange = function()
    {
        var OK = 4;
        var DONE = 200;

        if(xhr.readyState == OK && xhr.status == DONE)
        {
            //var response = JSON.parse(xhr.responseText);
            document.write(xhr.responseText);
        }
    }
}

这是我的html代码

<form id="formcProduct" action="<?= URL; ?>product/create" method="post" enctype="multipart/form-data" onsubmit="return false;">
          <div class="form-group">
            <div class="form-row">
              <div class="col-md-6">
                <img id="productImagepreview" class="form-control customcss_image_size" src="<?= Setting::imageLocation('public/product_image/no_photo_1x.jpg'); ?>" />
                <label for="exampleInputImage">Select an image</label>
                <input class="form-control" id="exampleInputImage" name="prodimage" type="file" onchange="loadImage(this);" accept="image/*">
                <span id="msg_pimage"></span>
              </div>
              <div class="col-md-6">
                <label for="exampleInputPname">Product Name</label>
                <input class="form-control" id="exampleInputPname" name="prodname" type="text" aria-describedby="nameHelp" placeholder="Enter Product name">
                <span id="msg_pname"></span><br/>

                <label for="exampleInputSupplier">Select Supplier</label>
                <select class="form-control" id="exampleInputSupplier" name="prodsupplier">
                    <?php
                        if(sizeof($this->productSupplier) > 0)
                        {
                            foreach($this->productSupplier as $ps)
                            {
                                echo '<option value="'.$ps['col_id'].'">'.$ps['col_supplier_name'].'</option>';
                            }
                        }
                    ?>
                </select>
                <span id="msg_psupplier"></span><br/>

                <label for="exampleInputQuantity">Quantity</label>
                <input class="form-control" id="exampleInputQuantity" name="prodquant" type="number" aria-describedby="nameHelp" placeholder="0">
                <span id="msg_pquant"></span><br/>

                <label for="exampleInputPrice">Price</label>
                <input class="form-control" id="exampleInputPrice" name="prodprice" type="text" aria-describedby="nameHelp" placeholder="&#8369; 0.00">
                <span id="msg_price"></span><br/>

                <label for="exampleInputLastName">Date</label>
                <input class="form-control" id="exampleInputLastName" name="proddate" type="date">
                <span id="msg_pdate"></span>
              </div>
            </div>
          </div>
          <input type="submit" class="btn btn-primary btn-block" value="Create Product" onclick="xhrCreateProduct();" />
        </form>

这是我的php文件,用于提取我发送的所有数据

here's my php file where fetching all the datas that i'm sending

var_dump($_POST);
var_dump($_FILES);

顺便说一句,我在使用 var_dumping 时,图像文件没有任何问题.但它显示在 post var_dump 值中.

and by the way i have another problem the image file it gives me no result when i'm var_dumping it. but it shows in post var_dump value.

我们严格使用本机 javascript ,我们不建议使用jQuery .或其他第三方.

We strictly using native javascript, we don't recommend using jQuery. or other 3rd party.

推荐答案

,而不是将请求标头放在ajax中.为什么不删除它?

instead of putting a request header in ajax. why not to remove it?

这篇关于FormData Ajax转PHP的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆