FormData is not defined - Firefox 3.6.28 alternative - javascript

I have the great job of having to finish off a job originally given to a contractor but was never completed. Not a problem however I've now been told that the system must support Firefox 3.6! Not great but not something I would lose sleep over until now! The system has a Ajax function that uses the FormData object and then uploads a document (usually a PDF). I've ran this through Firefox 3.6 and I get the following
"FormData is not defined"
var formData = new FormData($('form')[0]);
That's fine as I can see that this object isn't supported, I just need to use a different method or means of collection... I used this:
var formData = Components.classes["#mozilla.org/files/formdata;1"]
.createInstance(Components.interfaces.nsIDOMFormData);
However this gave me the following error!
Permission denied for http://10.29.100.23:8080 to get property
XPCComponents.classes
I was unsure why this was... is the path "#mozilla.org/files/formdata;1" incorrect? I did more research and was getting nowhere! So I then thought about serializing the form changed the following to...
var formData = {};
$.each($('form')[0].serializeArray(), function(_, kv) {
if (formData.hasOwnProperty(kv.name)) {
formData[kv.name] = $.makeArray(formData[kv.name]);
formData[kv.name].push(kv.value);
}else {
formData[kv.name] = kv.value;
}
});
although this didn#t error the Ajax function wasn't uploading (I presume it wasn't recognizing or finding the file or it was just collecting a string for the file value). Does anyone have any recommendations on an alternative for FormData in older browsers, especially Firefox 3.6 - that's the only old browser I have to support.
** update ****
this is the content of the form on the HTML page
<form action="" method="post" enctype="multipart/form-data" name="uploadForm" id="uploadForm" target="#">
<label for="fileField">Rechnung hochladen</label>
<input type="file" name="fileField" id="fileField">
<progress id="progressbar" class="progressbar_margin hidden"></progress>
</form>

FormData is an XMLHttpRequest Level 2 interface that makes it easy to submit a form (including file uploads) using XHR / Ajax. As you've discovered, it's only available in Firefox from version 4 onwards. (The MDN documentation has a browser compatibility table.)
I suggest trying the jQuery Form Plugin. It supports an iframe fallback for uploading files in older browsers.

I think you should use this before your code:
netscape.security.PrivilegeManager.enablePrivilege(
'UniversalXPConnect'
);
To be sure also do this:
type "about:config" in your address bar;
search for "signed.applets.codebase_principal_support" ;
Set the value to true;
Hope it works , good luck.

Related

How to create ActiveX object in asp.net

How can i create ActiveX Object in java script using asp.net.what i need requirements to create that ActiveX object if i use any DLL to create that object and how can i create can anyone provide description of to create ActiveX object
My Tried code is:
<script lang="javascript" type="text/javascript">
function getSize()
{
var oas = new ActiveXObject("Scripting.FileSystemObject");
var d = document.getElementById('b').value;
var e = oas.getFile(d);
var f = e.size;
return(f);
}
function checkFileType()
{
var path = document.getElementById('file1').value;
var Index = path.lastIndexOf(".");
var length = path.length;
var filetype = path.substring(Index,length)
if ((filetype == ".doc") ||(filetype == ".pdf") ||(filetype == ".jpg") ||(filetype == ".gif") ||(filetype == ".xls")||(filetype==".odt"))
{
var x = getSize(); if (x > 5242880)
{
alert('only upto 5 MB file is allowed');
return false;
}
}
else
{
alert('Only .doc, .pdf, .jpg, .gif, .xls is allowed');return false;
}
}
</script>
<form id="form1" runat="server">
<input type="file" name="b" id="file1" onchange="return checkFileType();" />
<div>
</div>
</form>
In the above code i am getting this line in code
" var oas = new ActiveXObject("Scripting.FileSystemObject");" getting Exception is "0x800a01ad - JavaScript runtime error: Automation server can't create object".
Can anyone tell me to how can i create ActiveX object properly and what i need setting and which DLL's i use and all can anyone help me out.
Thank You
This validation is not a supported method in all the browsers.
Anyway, for IE9 or below (where .files is not supported) you can use this. To use this method, you will need to enable activex object in IE.
Go to Internet Options->Security Tab. Select trusted website, and click Sites button. It will give you an option to add the url. Add the url of your site, and save. Then click on the button saying "custom levels". It will open a list of options. Find the one saying "Initialize and script activex controls not marked as safe" and enable it.
Save and close the dialog boxes, and refresh your webpage.
Edit:
Few notes:
This is extremely unsecure method, so I would suggest improving compatibility and saying no to anything below IE9.
Secondly, this is something you have to enable on every single user's machine. Otherwise, that line will always throw an exception.
So, if you have to stick to IE8 or lower, and have control over your userbase, then only use this. Otherwise, just use flash upload method for IE browsers. Your users might hate installing flash, but there is nothing you can do.
P.S. I was doing this same thing about an hour ago. Lucky for you, I did all the research. :)
Edit: On a secondary note, can someone help me figure out how to get rid of XML dataislands without major rewrite? That is the only thing stopping me from saying goodbye to IE6.

ActiveXObject Support in jQuery? How is it Possible

This is for Non-IE browsers-
I was working on a requirement which needed a XML file to be parsed. After looking at some options, i ended up finding $.parseXML in jQuery.
It worked fine and i can now read the content of the XML from there. But what surprised me was this-
Definition of $.parseXML is-
$.parseXML = function (n){
var r,i;if(!n||"string"!=typeof n)return null;
try{
e.DOMParser
? (i=new DOMParser,r=i.parseFromString(n,"text/xml"))
: (r=new ActiveXObject("Microsoft.XMLDOM"),r.async="false",r.loadXML(n))
}catch(o){
r=t
}
return r&&r.documentElement&&!r.getElementsByTagName("parsererror").length||b.error("Invalid XML: "+n),r}
Now, if you look at the code, the part 'r=new ActiveXObject("Microsoft.XMLDOM")' is what confuses me the most.
Normally, if we try the same thing independently, then the following error is thrown-
ReferenceError: ActiveXObject is not defined
Can someone explain me how is this made possible in jQuery?
The code inside the function definition is meant for IE only.
The ActiveX code is present as a fallback mechanism in case the browser is IE and doesn't support DOMParser(IE9 Supports DOMParser). My guess it that it's still there in case of executing the jquery code in IE8 and below.

SCRIPT5 : Access is denied on IE-10 after Security Update : jquery-1.4.4.min.js

There was an IE-10 security update on Sept-10. After that, in my application there seems to be an issue accessing a standard div using jquery.
Here is the quick scenario :
I have a jsp layout template where there is a div defined :
<div id="abc"></div>
In that I include a js file k1.js, the following function in that is triggered upon a click of a button
function sample() {
jQuery.get("/fetchmedata.do?a=true", function(data) {
jQuery("#abc").html(data);
});
This was totally functioning across all browsers including ie-10 till Sept -10. After 10th, it still works fine on IE-9 and old IE-10 builds, but on new IE-10 build throws the error in console :
SCRIPT5 : Access is denied
The call stack pointed to internals of Jquery code which I couldn't decipher/understand the context.
The quick fix was to replace the jquery with Javascript, and it worked :
function sample() {
jQuery.get("/fetchmedata.do?a=true", function(data) {
document.getElementById('abc').innerHTML = data;
});
The jquery version was jquery-1.4.4.min.js.
Please advice on what could have been the issue, is it again probably related to not using XDomainRequest instead of XHR, so that we could take precautions in the code to avoid future issues.
Also what is the best practices around it ?
Please advice.

JQuery File Upload plugin issue with IE for CSV and XML

I have checked online including this web site and have been unable to find a solution to my problem.
I am trying to us the JQuery File Upload plugin and have made some amendments to restrict the files types to CSV and XML, as well as restricting to 1 file only and up to 5MB per file. These new properties work fine and it also works fine in all browsers except IE.
I have bound an event on the fileupload event that will render the CSV as a HTML table. This works fine in all browsers except IE. In IE, it either throws an error or freezes with the green progress bar at the top right displaying the following information:
7.123775601068567 bit/s | 00:00:00 | 100.00 % | 0.00 KB / 0.00 KB
It actually looks like it is hanging as it does not seem to complete the upload. And when I reload the same page it shows the correct display! without the progress bar!
UPDATE: The code is fine when I simply upload the CSV file. Now the problem appears when I attempt to include a callback option. It seems related to the 'fileuploadcompleted' event, which I updated from 'fileuploaddone', which has improved the result but still not right and does not execute and render the HTML table at all (See link above for example)
// Load existing files:
$('#fileupload').each(function () {
var that = this;
$.getJSON(this.action, function (result) {
if (result && result.length) {
$(that).fileupload('option', 'done')
.call(that, null, {result: result});
}
});
}).bind('fileuploadcompleted', function (e, data) {
//console.log('fileuploaddone:start');
var $filename = $('#fileupload td.name').text().trim();
//console.log('filename is ' + $filename);
$.get('../jQuery-File-Upload/server/php/files/' + $filename, function(data) {
$('#CSVSource').html('<pre>' + data + '</pre>');
});
$('#CSVTable').CSVToTable('../jQuery-File-Upload/server/php/files/' + $filename,{
loadingImage: 'img/loading-table.gif',
startLine: 0 }).bind("loadComplete",function() {//for future use});
}).bind('fileuploaddestroy', function (e, data) {
//console.log('fileuploaddestroy');
$('div#CSVTable').fadeOut(1000);
});
Any ideas how to get this working in IE?
Many thanks.
ok the issue is resolved after much digging, though solution was quite simple and has been covered here:
How to deal with ie8 jquery object doesn't support this property or method Error?
So basically in the code above I should have been using the JQuery version of trim, which was updated as follows:
var $filename = $.trim($('#fileupload td.name').text());
posting the question in some strange way helped me resolve this issue :)
As a side note: I've also noticed that if you have htaccess restrictions on the folder where your 'upload' web page is, you can also have different behaviour in IE. For example, with access restrictions set, the upload works though it does not display the actual file uploaded, despite uploading. And when you delete the file, it asks you to log in.

Is there a way to have browsers ignore or override xml-stylesheet processing instructions?

I'm trying to write a bookmarklet to help some QA testers submit useful debugging information when they come across issues. Currently I can set window.location to a URL that provides this debugging information, but this resource is an XML document with an xml-stylesheet processing directive.
It would actually be more convenient if the testers were able to see either the raw XML data as plain text, or the default XML rendering for IE and Firefox.
Does anyone know a way to disable or override xml-stylesheet directives provided inside an XML document, using Internet Explorer or Firefox?
Edit: I've opened a bounty on this question. Requirements:
Client-side code only, no user intervention allowed
Solutions for both IE and Firefox needed (they can be different solutions)
Disabling stylesheet processing and rendering it as text is acceptable
Overriding stylesheet processing with a custom XSL is acceptable
Rendering the XML with the browser default XML stylesheet is acceptable
EDIT: too bad, though all seemed fine in the preview, the clickable examples seem to mess up things... Maybe the layout is fine in the history.
I've heard, but cannot validate for IE, that both IE and Firefox support the "view-source:" pseudo-protocol. Firefox on Mac indeed understands it, but Safari does not.
The following bookmarklet will not trigger the XSLT transformation specified in the XML. And though Firefox will render this using some colours, it does not execute the default transformation it would normally use for XML without any XSLT (so, the result of view-source does NOT yield a collapsable document tree that Firefox would normally show):
javascript:(function(){
var u = 'http://www.w3schools.com/xsl/cdcatalog_with_ex1.xml';
var w = window.open();
w.document.location.href = 'view-source:' + u;
})()
When fetching the document using Ajax then one is not limited to the alert oneporter used, but can display it in a new window as well. Again: this will not invoke the XSLT transformation that is specified:
javascript:(function(){
var u = 'http://www.w3schools.com/xsl/cdcatalog_with_ex1.xml';
var w = window.open(); /* open right away for popup blockers */
var x = new XMLHttpRequest();
x.open('GET', u, true);
x.onreadystatechange = function(){
if(x.readyState == 4){
w.document.open('text/html');
/* hack to encode HTML entities */
var d = document.createElement('div');
var t = document.createTextNode(x.responseText);
d.appendChild(t);
w.document.write('<html><body><pre>'
+ d.innerHTML + '</pre></body></html>');
w.document.close();
w.focus();
}
};
x.send(null);
})()
Can't you just do "View Source" in both browsers?
You can avoid a processing instruction by using an intermediary step to pre-process the XML before the content is output in the browser.
Client-side suggestion
Retrieve the relevant XML document via an AJAX request
Parse the XML into a DOM (note: a DOM not the DOM)
Traverse the DOM and render in the browser the required data
Server-side suggestion
Instead of directly requesting the pertinent XML document, make a request instead to a proxy script that removed from the XML content all processing instructions, or indeed all that you don't want.
Instead of:
window.location = 'http://example.com/document.xml';
use:
window.location = 'http://example.com/proxy/';
The script at http://example.com/proxy/ would:
Load document.xml
Use whatever is necessary to remove the processing instruction from the XML content
Output the XML content
As long as you wouldn't have to deal with cross domain permissions, a simple ajax request / alert box with the XML source would do the trick. You'll have to add a little bit to the xmlHttp declaration to make it compatible with IE.
<html>
<body>
<script language="JavaScript">
function ajaxFunction()
{
var xmlHttp=new XMLHttpRequest();;
xmlHttp.onreadystatechange=function()
{
if(xmlHttp.readyState==4)
{
alert(xmlHttp.responseText);
}
}
xmlHttp.open("GET","YOURFILE.xml",true);
xmlHttp.send(null);
}
</script>
Errors
</body>
</html>
As far as I know, there is no way of doing what you are trying to do. The issue is, javascript cannot read the dom of the xml from a client side xml/xsl transform. As far as the javascript is concerned, it is executing on a normal html dom.
However, there may be some hope depending on the type of webapp. You could use ajax to get the xml of the current url. As long as there is no post data, or any other randomness, this method should work fine.

Categories

Resources