2

ユーザーが自分の名前を入力してプロフィール写真を選択するフォームがあります。これらの情報とアバターは、ajax と php を介して mysql db に追加する必要があります。

HTML :

<form id="addWorkerForm" action="addWorker.php" method="post">
  Prename:<input type="text" name="prename" id="prename">
  Lastname:<input type="text" name="lastname" id="lastname">
  Image:<input type="file" id="file_input" name="file_input" >
</form>

Javascript:

var prename = $('#prename').val();    
var lastname = $('#lastname').val();    
var workerAvatar = $('#file_input').val();

var url = 'xyz/addWorker.php?prename=' + prename + '&lastname=' + lastname + '&avatar=' + workerAvatar;

$.ajax({
    url: url,
    dataType: 'json',
    async: false,
    success: function(data) {

    }
});

これは、javascript でコンテンツを取得するためにファイルにアクセスする適切な方法ですか? さらに、phpファイル内のファイルにアクセスするにはどうすればよいですか?

4

3 に答える 3

1

残念ながら、ファイルの値を php に渡してファイルをアップロードすることはできません。ファイルを自分でアップロードするか、AJAX アプローチを使用したい場合は、Pluploadなどを使用する必要があります。

期待できるのは、アップロードされたファイルの名前への参照であり、それを に保存して<input type="hidden" value="XXXXXXXX.jpg"/>、workerAvatar. 次に、ページをロードするときに、<img src="XXXXX.jpg"/>

于 2013-03-28T22:33:11.510 に答える
1

このAjaxFileUploadプラグインを試すことができます

于 2013-03-28T23:26:44.953 に答える
1

最近、非常によく似た問題があり、質問に答えてもらいました（JQuery1.8.0: Sending files from forms via AJAX）。

簡単に言えば、AJAX 経由でファイルを送信できますが、XmlHttpRequest が最近できるようになったばかりの "multipart/form-data" にファイルをエンコードする必要があるため、FormData() を使用して送信する必要があります ( https:/ /developer.mozilla.org/en-US/docs/DOM/XMLHttpRequest/FormData )。

次のようになります。

<button id="ajaxUploadSubmit"> Submit </button>
<script>
var data    = new FormData(document.forms.namedItem("workerAddForm"));

$( "#ajaxUploadSubmit" ).click(function() {
    var oReq    = new XMLHttpRequest();
    oReq.open("POST", "xyz/addwrker.php", true);
    oReq.setRequestHeader("X-Requested-With", "XMLHttpRequest"); //necessary for my application, might not be for you, I'm using CakePHP

    oReq.onload = function(oEvent) {   
        //whatever you want with oReq.responseText
        }
    oReq.send(data);
    };
</script>
于 2013-03-28T23:14:04.317 に答える