Is it possible to incorporate an image upload to this ajax form? This form is working already, just this file:file.val();
section that is new.
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="inputGroupFileAddon01">Upload</span>
</div>
<div class="custom-file">
<input name="file" type="file" class="custom-file-input" name="file" id="file"
aria-describedby="inputGroupFileAddon01">
<label class="custom-file-label" for="file">Choose Thumbnail</label>
</div>
</div>
Here is the function I use for the form right now. Again, this works. Just not sure how to incorporate the file upload. I can figure that PHP that is required on the action.php page. I just don't know how to get it past this ajax query.
function manageData(key) {
var client_id = $("#client_id");
var listing_number = $("#listing_number");
var price = $("#price");
var address = $("#address");
var address_2 = $("#address_2");
var city = $("#city");
var state = $("#state");
var zip = $("#zip");
var bd = $("#bd");
var ba = $("#ba");
var lot_sq = $("#lot_sq");
var abvgrd = $("#abvgrd");
var yr = $("#yr");
var type = $("#type");
var status = $("#status");
var link = $("#link");
var remarks = $("#remarks");
var file = $("#file");
var editRowID = $("#editRowID");
$.ajax({
url: 'action.php',
method: 'POST',
dataType: 'text',
data: {
key: key,
client_id: client_id.val(),
listing_number: listing_number.val(),
price: price.val(),
address: address.val(),
address_2: address_2.val(),
city: city.val(),
state: state.val(),
zip: zip.val(),
bd: bd.val(),
ba: ba.val(),
lot_sq: lot_sq.val(),
abvgrd: abvgrd.val(),
yr: yr.val(),
type: type.val(),
status: status.val(),
link: link.val(),
remarks: remarks.val(),
file: file.val(),
rowID: editRowID.val()
}, success: function (response) {
if (response != "success")
alert(response);
else {
client_id.val(' ');
listing_number.val(' ');
price.val(' ');
address.val(' ');
address_2.val(' ');
city.val(' ');
state.val(' ');
zip.val(' ');
bd.val(' ');
ba.val(' ');
lot_sq.val(' ');
abvgrd.val(' ');
yr.val(' ');
type.val(' ');
status.val(' ');
link.val(' ');
remarks.val(' ');
//file.val(' ');
$("#tableManager").modal('hide');
$("#manageBtn").attr('value', 'Add').attr('onclick', "manageData('addNew')");
}
}
});
}