Develop Reference

how to add file data in ajax call without using FormData?

How can i add a file data along with some normal data i.e without form in ajax call?
current i have in my ajax script
$("body").on("click", "#next-step", function(event){
$("#loader").show();
event.preventDefault();
var file = $("#upload_logo")[0].files[0];
$.ajax({
type: 'POST',
url: 'step-two.php',
data:{
name : "my name",
},
file : {upload_logo : file},
contentType: false,
processData: false,
success: function(response)
{
$("#loader").hide();
alert(response);
}
})
});
i found out the solution but it's not the way i would like it to work
event.preventDefault();
var fdata = new FormData()
if($("#upload_logo")[0].files.length>0)
fdata.append("upload_logo",$("#upload_logo")[0].files[0])
$.ajax({
type: 'POST',
url: 'step-two.php',
data:{fdata},
And it works, but my question is what if i just want to add my file in data how can i do this? instead of using FormData() any alternative?

file upload is not possible through ajax. You can upload file, without refreshing page by using IFrame. you can check further detail here
With XHR2, File upload through AJAX is supported. E.g. through
FormData object, but unfortunately it is not supported by all/old
browsers.
FormData support starts from following desktop browsers versions. IE
10+, Firefox 4.0+, Chrome 7+, Safari 5+, Opera 12+
For more detail, see MDN link

Use Form data
var formData = new FormData('form id');
$.ajax({
type: 'post',
async: false,
cache: false,
url: '',
contentType: false,
processData: false,
data: formData,
dataType: 'json',
success: function (response) {
}
});

Add JavaScript to Geckofx 45

I would like to know how can I add JavaScript in the HEAD section of my webpage. I'm using Geckofx 45 to render the page in my Windows Forms App.
This is what I have done so far, but it seems not to work.
GeckoHtmlElement headElement = Navegador.Document.GetElementsByTagName("head")[0];
GeckoHtmlElement scriptElement = Navegador.Document.CreateHtmlElement("script");
scriptElement.TextContent = "('#test').on('submit',(function(e) { e.preventDefault(); $.ajax({ url: 'test.php', type: 'POST', data: new FormData(this), contentType: false, cache: false, processData: false, success: function(data){ $('#ajax_response').html(data); }, error: function() { } }); }));";
headElement.AppendChild(scriptElement);
Any idea what might been missing?.
The form with ID test is already in the webpage but I what to add the JavaScript in the DocumentCompleted event.
Thanks.

FormData not working in IE

I have to upload an image onto the ColdFusion server. I have used FormData for the AJAX request to pass image file. It works fine for FF and chrome but gives issues in IE and the form does not get posted.
Is there any alternative way to do so? So that it works fine for FF, Chrome, IE8+.
var formData = new FormData($(obj)[0]);
var actionPage = $(obj).attr('action');
if (validForm) {
$('.mainPage').html('<div style="padding-top:20px;" align="center"><img alt="loading" src="/rpnet/images/ajax-loader.gif" /></div>');
$.ajax({
url: actionPage,
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (returndata) {
$('.mainPage').html(returndata);
}
});
}
return false;
This is the code I have used for posting the form.

Not able to get result from data.responseText in IE but working in other browser

I am using the below code snippet to fetch data from a certain webAPI.
data.responseText works fine in FireFox but gives undefined in IE L
I have tried using data.responseJSON also but it doesn’t work in IE.
Please give me the solution to this.
Here is the code which I am using.
$.ajax({
type: "GET",
url: serviceUrl,
contentType: "application/json",
data: "{'slid':'" + slidname + "'}",
async: false,
crossDomain: true,
complete: function (data) {
alert("hii");
alert(data.responseText);
}
});

Which version of the IE? If IE9 or less, the issue could be your jQuery version - see http://jquery.com/browser-support/.
Otherwise, you could try if letting the browser do the formatting of the ajax request data helps:
$.ajax({
type: "GET",
url: serviceUrl,
contentType: "application/json",
data:JSON.stringify( {"slid": slidname} ),
async: false,
crossDomain: true,
complete: function (data) {
alert("hii");
alert(data.responseText);
}
});
If this also fails, you may want to try "jsonp" as dataType for the ajax call since you have a cross-domain request.
$.ajax({
type: "GET",
url: serviceUrl,
contentType: "application/json",
data: JSON.stringify( {"slid": slidname} ),
async: false,
crossDomain: true,
dataType: "jsonp",
complete: function (data) {
alert("hii");
alert(data.responseText);
}
});

how to get html2canvas working in ie8?

I am trying to run this simple html2canvas code. It work great in Chrome, IE9, Firefox. But is not working in IE8
Code:
html2canvas($(#section), {
onrendered: function (canvas) {
var img = canvas.toDataURL().replace(/^data[:]image\/(png|jpg|jpeg)[;]base64,/i, "");
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "/Home/SaveDiv",
data: "{'imageData': '" + img + "'}",
dataType: "json",
async: false,
cache: false,
success: function (msg) {
},
error: function (result) {
alert('error');
}
});
}
});
Is there a way I can get it working in IE8. I have heard about flashcanvas which I am not sure on how to use it.
Else, is there any other way I can capture <div> element in IE8.

This is probably because html2canvas requires IE9 or higher, as stated here.

I would recommend using a polyfill: heres a canvas one