I need to make new own file upload field using HTML and Javascript since Built-In file upload not showing full path of the file
I need to make it similar to file upload by using button and textbox
please help to solve this problem
You can't.
There are security considerations browsers must adhere to and there is now way around that.
FYI this is also why Firefox doesn't allow drag and drop into a file field.
Just fyi, I think the path display depends on your browser.
If you're willing to/can do so, java (not javascript) might be able to help you with your original problem. Java brings it's own problems, though.
The file upload is a specific input type, which you can't easily replace, but in some browsers you may be able to style it.
You should be able to access the filename from javascript, and display this in a different part of the page (possibly hiding the file input at the same time) so the user can see what will be selected.
Another option is to use Flash for a fancier front-end (see http://www.flickr.com/photos/upload/ (assuming you have a flickr account) as an example), but I've never used one of these as a developer
Related
I am looking for ways to present a PDF file in the browser but make it not downloadable or printable.
If someone really goes through all the trouble to disable the JavaScript library or anything like that, that is fine. This is more for the reason that the content within the PDF will be updated regularly so if you download it it will be out of date by the next day.
I also cannot rely on marking the pdf as protected or encryption as a reasonable way to accomplish this.
If you have any library recommendations or anything else it would be appreciated. I am currently exploring if it is feasible using PDF.js and ViewerJS
I was able to find a solution using ViewerJS and this CSS. The CSS shows a blank page when you try to print (ViewerJS already distorts it to a non-printable state) and ViewerJS prevents you from downloading as a PDF file and instead tries to save as an HTML file.
This meets the requirements of making it just inconvenient enough to discourage users from trying to download the file since the file is always easily accessible on almost any page of the site.
https://gist.github.com/ActuallyConnor/2a80403c7827dd1f78077fb2b5b7e785
I am working on a web application and there is a need to preview PDF in Firefox.
Obviously I have embedded the PDF in the HTML code. The problem is that these PDFs contain forms and I know that the built-in Firefox viewer cannot display forms. Except the forms (which contain digital signatures) the rest of the document is displayed properly and in Chrome everything works fine (displaying the signatures too).
I want to ask which is the best approach to support the view of the whole document in Firefox. The current version I am working on is 52.7.3 but I want to do the system scalable for future versions.
I was thinking of transforming the PDF into a Base64 String and embed like that but trying this with some online demos did not work either (maybe the document is quite big?).
The other posibility I was thinking of, is transforming the PDF in JPEG (or similar format) and preview like that. What do you think about that?
Is there any library to handle PDF files from Java/Javascript code that does not use embedded viewers? I tried PDF.js but I realised that it is using the built in viewers. Correct me on this If I am wrong.
You could do something that is called "flattening". This involves taking the form field appearance (graphics) and moving them directly into the page, and then removing the form fields themselves. Is also often done on annotations too.
This ensures that the fields are visible (rendered) by every PDF reader, but also that users cannot possibly edit the fields (since the field is removed).
This would of course invalidate any e-signature, since you are modifying the PDF, but if you kept the original PDF, that should not be an issue.
Once the fields are flattened, then Firefox/Pdf.js will show everything fine.
Is mandatory to open file specifically with Firefox? If not, you can use Desktop.open(File) to open a file with the default application for PDF files. (https://docs.oracle.com/javase/7/docs/api/java/awt/Desktop.html)
Desktop.open(File)
You can use this to open the PDF file if the file does not have to be opened with Firefox.
I have a text file i want to read in my html page,both are in the same directory and i am not running a server. I intend that my users use the script offline(basically text manipulation based on expressions and preserving new line characters) .
I tried ajax call but mostly cross domain origin problem occured and i know most of the users will have this security tighened up in many browsers , so its not of use to circumvent this in only in my browser.
I want to support many browsers including old browsers as in IE7,8 etc which do not support HTML5 filereader.for the same reason reading using filesystemobject or activex is not good.
Reading the file after user select it as input , is this possible?Otherwise i would have no option then using other technologies like php,java etc which may expect my user to setup these.
Please excuse me if i am repeating this but i am a beginner web developer. I know that reading local files via javascript is not possible but is there any other way?
If you can't support FileReader, then the answer is pretty much no (at least, if you want to support a large range of browsers rather than rely on convenient feature x of browser y). Unless : you indeed increase the requirements for running the application and get some sort of local server going (for instance node.js, Apache, TomCat, etc. but like you said this will greatly increase the requirements and become cumbersome for users).
You could also rethink what it is you're trying to achieve. What are the contents of the file you want to read ? Can't these contents be part of the HTML file you're serving to your users (i.e. a large JSON Object inside a script-tag ?)
On possibility of using node.js:
Node.js is quite easy to install and assuming you are requiring from your users to install it, you can use it as a local server, which is a nodejs script of about two lines in size :). Running it locally would also omit the need to upload anything anywhere as you can directly read from the file system using the fs-object (see sitepoint.com/accessing-the-file-system-in-node-js).
STILL: from both a design and ease-of-use-point of view you might want to resort to using either another technology, or include the text file content inside the HMTL file
I have a script already for uploading pictures, but I want the ability to select more pictures at once on upload,by holding down ctrl,I know I can use uploadify but I don't want to start over, mabe you guys know a script or something for jquery, that will work without to remove the current code, or you guys could give me a snippet.
The ability to slect multiple files in entirely the browsers features. Which cannot be changed by using a Javascript or css or html. Using uploadify or similar as you mentioned in your question is the right way to go.
You know uploadify also uses the swfobject.js, to overcome this limitation by using an actionscript instead.
You could write your own upload system in javascript with ajax. See http://www.html5rocks.com/en/tutorials/file/dndfiles/
Basic workflow
get local file contents
push to server via ajax
With this you could do a multi-file select and/or drag and drop upload system. Best and maybe only solution if you want to stay in javascript.
I was trying to do something like this: http://www.element-it.com/Examples/MultiPowUpload/AdvancedHTMLinterface.html
But in my search for information I found that is not possible to perform multiple file selection with simple HTML and JavaScript (and JSP in the server side). There is a way to do this without using Flash? A third party component you could recommend?
Thanks.
Actually according to the specification, normal HTML file upload fields are supposed to be multiple-file-upload fields. Opera supported it for a bit, allowing you to ctrl-click to select multiple files from a file picker. But it almost always broke the webapp since many web frameworks didn't know about it and would fall over.
In the meantime, it usually suffices to use JavaScript to add an extra file upload field to the form when the previous one has been filled in. This can be made gracefully-degrading for non-JS UAs, whilst sprucing up the management of multiple files with script and pretty icons.
If you go with a Flash uploader, it's a good idea to back it up with a simple HTML file upload field for compatibility there too.
It is still works via flash, but the YUI Uploader component allows you to add multiple file selection with minimal knowledge of flash - the API to interact with it is purely javascript.
HTML 5 will support multiple file upload, but that is not currently well supported in a large number of browsers