我正在为我的公司编写一个客户端数据库系统。没什么花哨的东西,但是它确实应该做。现在所有基本的“文本”内容都已完成,我想在其中添加一些文件管理。
我有几种形式,这些形式通过ajax发送到后端,然后写入模型中的db中。
这些表格中的某些计划有一个文档文件上载。
有没有办法使用AJAX处理正常值提交和文件提交?
让我给您一个FORM示例:
<form action="SOMEPATH/LOGIC_FILE.php" action="POST" enctype= multipart/form-data> <label for="name"> <input type="text" id="name" name="name" /> </label> <label for="somethingElse"> <input type="text" id="somethingElse" name="somethingElse" /> </label> <label for="fileUpload"> <input type="file" /> </label> </form>
AJAX示例:
var name = $('#name').val(); var somethingElse = $('#somethingElse').val(); var dataArr = { 'name':name, 'somethingElse':somethingElse}; MYELEMENT.click(function(e){ e.preventEventDefault(); $.ajax({ url: "PATH/logic/logic_update_client_allg.php", type: "POST", data: allgArray, success: function(dataArr){ // works }, error: function(){ // doesnt work } }); }
那就是我如何处理输入值提交
如何继续使用此表单上传文件
谢谢
对于ajax上传,您需要使用方法中xmlHttpRequest已经可用的jQuery.ajax(),但要使用FormData。
xmlHttpRequest
jQuery.ajax()
FormData
如果您的目标不是IE旧版(例如7,8),则可以使用FormData。必须注意的一件事是您必须设置contentType, processData为false。
contentType, processData
false
请参阅以下示例:
var name = $('#name').val(); var somethingElse = $('#somethingElse').val(); var fd = new FormData(); var dataArr = { name: name, somethingElse: somethingElse, file : fd.append('file', $('#fileUpload').get(0).files[0]) // put the file here }; MYELEMENT.click(function(e) { e.preventDefault(); $.ajax({ url: "PATH/logic/logic_update_client_allg.php", type: "POST", data: dataArr, //<----post here the files and other values processData: false, // tell jQuery not to process the data contentType: false // tell jQuery not to set contentType success: function(dataArr) { // works }, error: function() { // doesnt work } }); });