I am using ajax to upload data including an image to my server side. When the image is below 1.35MB it works fine. However, for images larger then 1.35MB the other data is over written (e.g., when I
System.out.println("Level: " + request.getParameter("ssAccountLevel"));
It shows as null.
This is my code:
$.ajax({
type: "POST",
url: "ResourceAddView",
cache: false,
data : {
ssAccountLevel : sessionStorage.getItem('ssAccountLevel'),
ssAccountID : sessionStorage.getItem('ssAccountID'),
image : img2,
imageType : imageType,
resourceType: $("#resourceTypeAdd").val(),
resourceName: $("#resourceNameAdd").val(),
resourceDescription: $("#resourceDescriptionAdd").val(),
},
})
.fail (function(jqXHR, textStatus, errorThrown) {
//alert(jqXHR.responseText);
$('#ajaxGetUserServletResponse13').text('Error adding Resource.');
})
.done(function(responseJson){
$('#ajaxGetUserServletResponse13').text('Resource added.');
showResourceDataTable();
})
I resolved this issue by changing my ajax POST to json.
From:
$.ajax({
type: "POST",
url: "StoresAddView",
cache: false,
data : {
ssAccountLevel : sessionStorage.getItem('ssAccountLevel'),
ssAccountID : sessionStorage.getItem('ssAccountID'),
ssGroupID : sessionStorage.getItem('ssGroupID'),
itemNameAdd: $("#itemNameAdd").val(),
itemDescriptionAdd : $("#itemDescriptionAdd").val(),
...
To:
var data = {"ssAccountLevel" : sessionStorage.getItem('ssAccountLevel'),
"ssAccountID" : sessionStorage.getItem('ssAccountID'),
"ssGroupID" : sessionStorage.getItem('ssGroupID'),
"itemNameAdd" : $("#itemNameAdd").val(),
"itemDescriptionAdd" : $("#itemDescriptionAdd").val(),
...}
$.ajax({
type: "POST",
url: "StoresAddView",
cache: false,
contentType: "application/json",
processData: false,
data: JSON.stringify(data),
})
I do not know why this worked. Any explanation would be greatly received as to why the original code worked for smaller uploads only.
Kind regards,
Glyn
Related
i use laravel 5.8 and i have a a problem if i insert or update a page than i go not back to the page list.
postcontroller :
i use : return response()->json('Post Created');
and i use a ajax file whit this code :
$.ajax({
type: 'POST',
url: this.action,
data: new FormData(this),
dataType: 'json',
contentType: false,
cache: false,
processData:false,
success: function(response){
Sweet('success',response)
success(response)
},
error: function(xhr, status, error)
{
$('.errorarea').show();
$.each(xhr.responseJSON.errors, function (key, item)
{
Sweet('error',item)
$("#errors").html("<li class='text-danger'>"+item+"</li>")
});
errosresponse(xhr, status, error);
}
})
});
i get a nice message if it is insert or updated but it not go back to my list, hope you understand what i mean.
if you want to redirect after success do something like this:
$.ajax({
type: 'POST',
url: this.action,
data: new FormData(this),
dataType: 'json',
contentType: false,
cache: false,
processData:false,
success: function(response){
Sweet('success',response)
success(response)
window.location.href = "url you want to redirect to";
},
error: function(xhr, status, error)
{
$('.errorarea').show();
$.each(xhr.responseJSON.errors, function (key, item)
{
Sweet('error',item)
$("#errors").html("<li class='text-danger'>"+item+"</li>")
});
errosresponse(xhr, status, error);
}
})
});
To apply a command to an issue i'm using this code:
$.ajax({
async: false,
type: 'post',
url: "https://golaservices.myjetbrains.com/youtrack/rest/issue/"+e.target.id+"/execute"+"?command="+target.val(),
cache: "true",
dataType: "html"
});
but that brings up this error
You have no access to this resource. Try to log in.
that's why i tried putting that first bit of code like this:
$.ajax({
async: false,
type: 'post',
url: "https://golaservices.myjetbrains.com/youtrack/rest/user/login?login=xxx&password=123",
cache: "true",
dataType: "html",
success: function(output, status, xhr) {
alert(xhr.getResponseHeader('Set-Cookie'));
}
}).done(function (data) {
console.log("in done");
$.ajax({
async: false,
type: 'post',
url: "https://golaservices.myjetbrains.com/youtrack/rest/issue/"+e.target.id+"/execute"+"?command="+target.val(),
cache: "true",
dataType: "html"
});
console.log("after done");
});
but i still get the same error, any idea how to do this ?
/rest/user/login endpoint has been deprecated for a while already and is not recommended for further use. Try permanent tokens instead, they don't require any preflight login requests to be executed.
$.ajax({
type: "post",
url: "https://golaservices.myjetbrains.com/youtrack/rest/issue/" + e.target.id + "/execute" + "?command=" + target.val(),
dataType: "json"
beforeSend: function(xhr) { xhr.setRequestHeader("Authorization", "Bearer " + permanentToken); },
});
I have developed an app using cordova(version 6.3.1). I have checked it on nexus 5 and nexus 6P and everything looks fine, but i tested it on genymotion emulator and galaxy S6, but they didn't send any request(I checked server logs).
Does it anything to do with security problems? Or there is another problem?
The ajax POST method is the code below.
$("#login").click(function() {
$.ajax(serverUrl + "/login", {
data: {
email: userEmail,
password: userPassword
},
dataType: "json",
method: "POST",
statusCode: {
200: function(data) {
//OK, Welcome!
$("body").pagecontainer("change", "#welcomePage");
},
}
});
});
Can you show us your part of source code where you have this problem ?
Did you check you have this plugin in your project ?
cordova-plugin-whitelist
Also, can you throw us your HTTP response when you're sending your AJAX request to your server
It may be, something like this :
$.ajax
({
contentType: "application/json; charset=utf-8",
dataType: "json",
data: ...,
url: ...,
type: 'POST',
timeout: 5000,
success: function (data)
{
},
error: function(msg)
{
alert("Error:"+msg.status + msg.responseText);
}
});
var formData = new FormData();
formData.append('name', name.val());
formData.append('email', email.val());
formData.append('contact_number', contact_number.val());
formData.append('barangay', barangay.val());
formData.append('landmark', landmark.val());
formData.append('password', password.val());
formData.append('confirm_password', confirm_password.val());
//Problem start here it came from attributes but I can alert the data and it was fine.
formData.append('image_pin', img_top);
formData.append('img_left', img_left);
formData.append('img_z_index', img_z_index);
formData.append('input_value', input_value);
formData.append('input_top', input_top);
formData.append('input_left', input_left);
$.ajax({
url: 'register',
headers: {'X-CSRF-TOKEN': token.val() },
method: 'post',
processData: false,
contentType: false,
cache: false,
dataType: 'json',
data: formData,
success: function(data){
console.log(data);
},
error: function(){
}
});
//The input works fine but the attributes data is undefined
$request->input('img_top');
$request->input('img_left');
I have the below that uploads an image using JQuery's AJAX function
var id = <?php echo $id; ?>;
var img_data = new FormData($("form")[0]);
$.ajax({
url: 'add.php',
data: img_data,
contentType: false,
processData: false,
type: 'POST',
success: function(data){
alert(data);
}
});
I'd like to include a string with the FormData sent. I tried the following, but no luck
data: img_data {id: id},
What's the correct syntax here?
Use append
var img_data = new FormData($("form")[0]);
img_data.append('id', id);
You could create a JSON data object and pass that as application/json and process the data within add.php:
var data = {
id : <?php echo !empty($id) ? $id : "''",
img_data : new FormData($("form")[0])
};
$.ajax({
url: 'add.php',
data: data,
contentType: "application/json",
type: 'POST',
success: function(data){
alert(data);
}
});
Although unconventional, you could also append the data as a query string to the URL with the POST. You'd also need to edit add.php to get this parameter.
$.ajax({
url: 'add.php?id=' + id,
data: img_data,
processData: false,
type: 'POST',
success: function(data){
alert(data);
}
});