[英]get input text through ajax
我將如何更改此腳本,將其設置為文件上傳,我可以將所有內容從輸入文字以外的文件中導入數據庫,我也希望它也獲取輸入文字,然后可以通過php將輸入文字插入數據庫。
誰能幫忙?
<script>
function _(el){
return document.getElementById(el);
}
function uploadFile(){
var file = _("file1").files[0]; //alert(file.name+" | "+file.size+" | "+file.type);
var formdata = new FormData(); formdata.append("file1", file);
var ajax = new XMLHttpRequest();
ajax.upload.addEventListener("progress", progressHandler, false);
ajax.addEventListener("load", completeHandler, false);
ajax.addEventListener("error", errorHandler, false);
ajax.addEventListener("abort", abortHandler, false);
ajax.open("POST", "file_upload_parser.php");
ajax.send(formdata);
}
function progressHandler(event){
_("loaded_n_total").innerHTML = "Uploaded "+event.loaded+" bytes of "+event.total;
var percent = (event.loaded / event.total) * 100;
_("progressBar").value = Math.round(percent);
_("status").innerHTML = Math.round(percent)+"% uploaded... please wait while file is saved!";
}
function completeHandler(event){
_("status").innerHTML = event.target.responseText;
_("progressBar").value = 0;
}
function errorHandler(event){
_("status").innerHTML = "Upload Failed";
}
function abortHandler(event){
_("status").innerHTML = "Upload Aborted";
}
</script>
<form id="upload_form" enctype="multipart/form-data" method="post">
<input type="text" id="Eid" name="name1" />
File:<input type="file" name="file1" id="file1"><br>
<progress id="progressBar" value="0" max="100" style="width:300px;"></progress><br />
<input type="button" value="Upload File" onclick="uploadFile()"><br />
<h3 id="status"></h3> <p id="loaded_n_total"></p>
</form>
嘗試使用此:
formdata.append("name1", $('#Eid').val());
我認為應該可以。
我猜您將不得不將輸入文本值附加到用於ajax請求的formdata參數上。 嘗試添加以下內容:
formdata.append("name1", _("Eid").value);
后
var formdata = new FormData(); formdata.append("file1", file);
我沒有測試此代碼,但是通過_("Eid")
您將獲得輸入文本元素,並通過.value
其值。 在php腳本(file_upload_parser.php)中,您應該能夠從formdata參數讀取輸入字段的值。
您已經在使用附加函數將文件添加到表單數據中。 因此,您可能需要做的就是使用相同的函數來追加輸入。 就像是:
var formdata = new FormData();
formdata.append("file1", file);
// Add input field value
formdata.append("name1", _('Eid').value);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.