I have an AJAX request (through a GET method) using the following code:
<script>
$(document).ready(function(){
$('.attachmentDetailsButton').click(function(){
var $a = $(this);
$.ajax({
type:'GET',
url: '/shipments/attachmentDetails',
dataType:'json',
data: {
'attachmentID': $a.data('id'),
'_token': $('input[name=_token]').val(),
},
success: function(data) {
$('.errorTitle').addClass('hidden');
$('.errorContent').addClass('hidden');
if ((data.errors)) {
setTimeout(function () {
$('#createOrigin').modal('show');
toastr.error('Check your inputs!', 'Error Alert', {timeOut: 5000});
}, 500);
if (data.errors.title) {
$('.errorTitle').removeClass('hidden');
$('.errorTitle').text(data.errors.title);
}
if (data.errors.content) {
$('.errorContent').removeClass('hidden');
$('.errorContent').text(data.errors.content);
}
} else {
//toastr.success('Changed Bill To '+data.customer_name, 'Success Alert', {timeOut: 5000});
$('#attachmentIDdetails').html(
'<div id="viewer"><object data="http://www.pdf995.com/samples/pdf.pdf" type="application/pdf" width="100%" height="100%"><iframe src="http://www.pdf995.com/samples/pdf.pdf" style="border: none;" width="100%" height="100%">This browser does not support PDFs. Please download the PDF to view it: <a href="http://www.pdf995.com/samples/pdf.pdf">Download PDF</a></iframe></object></div><div id="details"><h3><strong>'+data.attachmentTitle+'</strong></h3><br>Description: '+data.attachmentBody+'<br>Date '+data.attachmentDate +'<br>Type: '+data.attachmentType +'<br>Visibility: '+data.attachmentVisibility + '<br>Uploaded by: '+data.user_id+'<br><a href="{{Storage::url('+data.attachmentPath+')}}">Download Attachment</a><br><img width="100%" src="https://maps.googleapis.com/maps/api/staticmap?center='+data.attachmentLat+',+'+data.attachmentLong+'&zoom=13&scale=1&size=600x300&maptype=roadmap&key=AIzaSyCPeq-OWJciDjoY8nSMsZeRu9IG9MDMwBM&format=png&visual_refresh=true&markers=size:mid%7Ccolor:0xff0000%7Clabel:%7C'+data.attachmentLat+',+'+data.attachmentLong+'" alt="Google Map of '+data.attachmentLat+',+'+data.attachmentLong+'"></div><div id="clear" style="clear: both;"></div>');
$('.modal-footer').html(
'<button type="button" class="btn btn-default" data-dismiss="modal">Close</button><a href="/files/i/'+data.url_string+'" target="_blank"><button type="button" class="btn btn-success"><span id="" class="glyphicon glyphicon-check"></span> View More Details</button></a>'
);
}
},
error: function (jqXHR, textStatus, errorThrown) {
if (jqXHR.status == 500) {
alert('Internal error: ' + jqXHR.responseText);
} else {
alert('Unexpected error.');
}
}
});
});
});
</script>
As you can see a little lower down in my script, you can see where the returned data is placed in a div called "attachmentIDdetails" - well one specific field it returns "data.attachmentPath" I need to have a word on the beginning removed. Every single time it returns "/public/storage/etc.etc.", and I need it to only remove the "/public" portion. This data is coming from a MySQL database, and there is a reason to add the "/public" in there in the beginning, so that can't change, so I'm hoping I can remove the data outright in the response.
