Прежде чем начать, позвольте мне сказать, что я сослался на многие другие посты, чтобы решить мою проблему, но я не мог исправить это или найти решение, специфичное для моей проблемы. Вот причина моего вопроса здесь.
Позвольте мне начать, я сейчас использую некоторые элементы формы в модале. Все элементы формы отправляются через мой подарок ajax и сохраняются в mysql db.
Но когда я добавляю элемент загрузки файла в форму, Мой ajax не отправляет форму и не отражается в mysql дБ.
HTML:
<div class="col-md-12 col-sm-12 col-xs-12 form-group has-feedback">
<label style="color:#333D79FF; font-size:15px;">Upload Files </label>
<input type="file" name="srfile" id="srfile" class="form-control has-feedback-left" accept=".jpg,.jpeg,.png,.pdf,.doc,.docx,.xls,.xlsx"/>
<span class="fas fa-upload form-control-feedback left text-info" aria-hidden="true"></span>
<span id="info">Only</span> .jpg, .jpeg, .png, .pdf, .doc, .docx, .xls, .xlsx files allowed. Max File Size 2 MB
</div>
Я использую bootstrap валидатор для проверки моих элементов формы, после проверки он отправляет php и, соответственно, mysql дБ.
JQUERY:
$(document).ready(function() {
.on('success.form.bv', function(e) {
// Prevent submit form from page loading or refreshing
e.preventDefault();
// get the form data
// there are many ways to get this data using jQuery (you can use the class or id also)
var formData = {
'firstname' : $('input[name=firstname]').val(),
'lastname' : $('input[name=lastname]').val(),
'gender' : $('input[name=gender]').val(),
'address' : $('input[name=address]').val(),
'city' : $('select[name=city]').val(),
'state' : $('select[name=state]').val(),
'country' : $('select[id=country').val(),
'aboutyourself' : $('textarea[name=aboutyourself]').val(),
'uploadfile' : $('input[type=file]').val(),
'send' : $('button[name=send]').val()
};
// process the form
$.ajax({
type : 'POST', // define the type of HTTP verb we want to use POST
enctype : 'multipart/form-data',
url : 'pages/insert.php', // the url where we want to POST
data : formData, // our data object
dataType : 'json', // what type of data do we expect back from the server
encode : true
})
// using the done promise callback
.done(function(data) {
//log to the console form data in object form
//console.log(JSON.stringify(formData));
// log responce data to the console so we can see
console.log(data);
// ALL GOOD! just show the success message!
$(".status").html(data.status);
$(".msg").html(data.msg);
if (data.status_code===200) {
$('#status').html(data.status);
$('#msg').html(data.msg);
} else {
$('#statuserror').html(data.status);
$('#msgerror').html(data.msg);
}
});
});
});
Моя вставка. php
if(isset($_POST['send'])){
$firstname=$_POST['firstname'];
......
.....
.....
etc..,
//File Upload
if(isset($_FILES['uploadfile'])){
$errors= array();
$file_name = $_FILES['uploadfile']['name'];
$file_size = $_FILES['uploadfile']['size'];
$file_tmp = $_FILES['uploadfile']['tmp_name'];
$file_type = $_FILES['uploadfile']['type'];
$file_ext=strtolower(end(explode('.',$_FILES['uploadfile']['name'])));
$extensions= array("jpeg","jpg","png","pdf","doc","docx","xls","xlsx");
if(in_array($file_ext,$extensions)=== false){
$errors[]="extension not allowed, please choose a JPEG or PNG file.";
}
if($file_size > 2097152) {
$errors[]='File size must be excately 2 MB';
}
if(empty($errors)==true) {
move_uploaded_file($file_tmp,"images/".$file_name);
echo "Success";
}else{
print_r($errors);
}
}
$adduser=$link->prepare("INSERT INTO `users` (`firstname`,`lastname`,`gender`,`address` ,`city` ,`state` ,`country` ,`aboutyourself` ,`file`) VALUES (?,?,?,?,?,?,?,?,?)");
$adduser->bind_param('sssssssss', $firstname, $lastname, $gender, $address, $city, $state, $country, $aboutyourself, $file_name);
$adduser->execute();
if($adduser) {
$success = array(
'status' => 'Success!',
'status_code' => 200,
'msg' => 'User has been added.');
echo json_encode($success);
}else {
$error = array(
'status' => 'Error!',
'status_code' => 404,
'msg' => 'Error occurred in adding user. Please modify and try again.');
echo json_encode($error);
}
}
Моя проблема, когда я добавляю $file_name в запросе вставки не вставляйте значения, ни файл загружен. В противном случае, когда я не использую значение $file_name, все другие значения добавляются в БД.
Примечание: пожалуйста, поймите, что я использовал различные поля ввода, такие как имя, фамилия, адрес и т. Д. c. хотя я не показал код этих в моем HTML коде выше, просто чтобы уменьшить код. Надеюсь, вы поймете
Где я go ошибся. Пожалуйста помоги. Ценю ваш положительный ответ.
ОБНОВЛЕНИЕ: В моей переменной ajax выше, я внес изменения, как показано ниже
var formData = {
'firstname' : $('input[name=firstname]').val(),
'lastname' : $('input[name=lastname]').val(),
'gender' : $('input[name=gender]').val(),
'address' : $('input[name=address]').val(),
'city' : $('select[name=city]').val(),
'state' : $('select[name=state]').val(),
'country' : $('select[id=country').val(),
'aboutyourself' : $('textarea[name=aboutyourself]').val(),
'send' : $('button[name=send]').val()
};
formData.append("uploadfile",$('input[type=file]')[0].files[0]);
Я не нахожу успеха загрузить файл