I created a PDF in Adobe Acrobat DC. It is a registration form for our event. So it has text fields that the user fills out. I have attempted to embed this file and it works with this while on a computer.
<embed src="Registration2017OP.pdf" width="800" height="1000"></embed>
But my problem or one of them is, when I attempt to open this on a mobile device the text fields are no longer editable. Any clues why?
I tried using ViewrJS and the same thing, except whether I am using a computer or mobile the fields are never editable.
link to registration where fields are not editable
I have also tried google docs with the same results. Maybe I am going about this whole registration form wrong, but why are the fields not editable?
The majority of the browsers and PDF viewers on mobile devices are too dumb to properly deal with fields. In your situation, you have a web browser, which most likely can not link in any way to a smart enough PDF viewer.
Related
I have created a html page with bootstrap control and my own css. I am running the page through visual studio in chrome. I want this page to get converted into pdf with colours as it is displayed in chrome. I have not connected any printer to my system. If i give ctrl+P, my page is getting displayed without colours.
I have used 'save as pdf' extension of chrome for conversion.
It is saying 'cant access your local url'. Is there a way to print the page in the same way as it is seen in browser as a pdf
Bootstrap controls like progress bar not getting appeared in print.
Chrome “Save As PDF” works fine. You need to tick the “print background graphics” checkbox otherwise by default backgrounds are ignored.
However, the problem is that Bootstrap has included a reset for print media. What it does is to overwrite all background to white and foreground color to black, with !important.
What kills is the !important
I would recommend you to use one of the free online HTML-to-PDF conversion solutions.
Here's one for example: http://www.htmlpdf.com/
Keep in mind that some solutions may not give you the expected results. In this case just try another.
After you have found a working solution, just print the converted-HTML-to-PDF file that you downloaded.
Chrome itself acts as a pdf writer and reader, as we already know. I'm not sure why the colours are missing in the preview for printing, still, give this a try:
After Ctrl+P, you'll see the Print - Cancel options, below which there is a Destination for you to choose.
It has Recent, Local and Cloud destinations with a choice from the local ones being displayed. Go ahead and change it to Save as pdf.
Now you can save the whole webpage with the colours too.
Take a look at this
I had the same issue but found an easy solution.
Simply get the google chrome extension called : FireShot
Get it here: https://chrome.google.com/webstore/detail/take-webpage-screenshots/mcbpblocgmgfnpjjppndjkmgjaogfceg?hl=en
It will take full page screenshot of your HTML page and even local Html pages.
Then capture the full page.
After it will lead you to a new page with saving option.
Beside “Email” I suggest you to click on “PDF”. Then it will lead you to Gmail so you can send yourself the PDF.
I don’t suggest to click on print, because in my case when I saved it, there was an issue with the pixels.
Very easy.
GoFullPage - Full Page Screen Capture — works great for this case.
So here's the story. At my company, you can access previous pay statements online via a payroll website. When you go to look at a statement, it will open the statement in-browser via a pdf viewer. When working properly, it will usually ask if you want to blank out all the data or not (which... why would you want to? the point is to look at your statement). Now, this worked fine when checking it out in Adobe Reader; you'd just click "yes, show data" and everything displays fine, it can be printed, etc. But the company decided that instead of getting Acrobat for editing pdf files, that the better (cheaper) option is to get a cheap/free alternative called "Nuance" something or other. Two users installed this program, and now the browsers open pdfs in-browser with Nuance instead of Adobe Reader. This is a problem, because Nuance doesn't show the option of hiding or showing data like Reader did; rather, it just chooses the "no" option, which results in a blank template pdf coming up.
Now, this whole problem could be solved if we could just get the browsers to use Reader to open pdf files in-browser... obviously it's not a problem if you could download the pdf, but the site doesn't seem to allow you to download the pdf files. We've tried just about everything we could think of, short of uninstalling Nuance altogether, to get IE or Chrome to open pdf files with Reader, but even with a full IE reset, it uses Nuance to open pdfs inside the browser. Changing the default program for pdfs has yielded no results, IE still uses Nuance in-browser.
Anyone have any thoughts on how to change IE or Chrome to default to using Reader to show pdf files instead of Nuance?
Thanks!
just change the default programs or applications that opens pdf files, make it the adobe reader. You'll have to configure it in Windows, the Default Programs in Control Panel. You'll have to do this in each computer.
I wrote a chrome extension - english dictionary. You select word, the definition appears.
It works well, but I counter a problem. It seems there is no api of chrome pdf viewer supplied by google.
How can I get the word when i select a word in pdf using chrome pdf viewer?
I will be appreciate if you could help me.
You can get selected text using the context menu. In your background script, adding these lines will allow the user to right-click and do something with the selectionText.
chrome.contextMenus.create({id:"lookup",title:"Lookup %s",contexts:["selection"]});
chrome.contextMenus.onClicked.addListener(function(sel){
console.log(sel.selectionText);
});
Grabbing this text works fine with PDFs, whether part of the extension, or not.
However, you cannot inject a script into a page starting with "chrome-extension://". If this is how your extension works, that will not be (directly) possible. But getting the selected text, and doing something with it still very doable.
As an alternative to requiring script injection, see the notification api, which allows a small message to popup, which could contain the definition of the word.
I'm a Web Designer, and I have this client who runs a paid subscription blog site that has sensative content that he does not want copied and shared (hence the paid subscription).
I've recently been able to successfully disable all ability to copy the content from the actual webpages (using a wordpress plugin, and also targeting some elements using css -webkit-user-select set to none)
But more recently I've become aware that you are still able to copy and paste all of the content if the user views the webpage using Safari's Reader. Is there anyway at all to diable the user's ability to copy text from inside Reader?
I appreciate any feedback and help you can send my way!
Thanks!
You may try to implement various "tricks" to disabling copying. They have basically to do with preventing default actions when click-dragging to select text (google for jQuery preventDefault). You bind an action an then preventDefault on the event when the action is triggered.
You may also attemp to prevent-defaut some keystokes like cmd-c and cmd-a
But... as the page is delivered to the browser the text is on the user's machine. So all the techniques above can be circumvented.
In some browsers the tricks above may not work. Or, a smart user, may open the page source and extract the text.
You may go further, rendering the text to image server-side.
But a motivated user may rewrite by hand the text...
Conclusion: you can make more difficult for the average user to copy text. It's impossible to avoid it completely.
Hope this helps...
I have a web application with a simple file upload requirement (max 1 mb).
The web application is an externally exposed web site that must be (as much as possible) compatible with all browsers and versions.
We are using C# .net 3.5 ASP .Net (IIS 7) technology.
We are having trouble implementing the file upload control:
<input type="file" ... />
The buttons are not clicking correctly and different input methods (eg clicking on the text box in some browsers will open the input field).
We need to avoid 3rd party file upload tools.
What is the best way to make this compatible with all browsers?
Can we use frameworks (eg we could use JQuery) to do this?
Any help is really appreciated.
Edit:
Here are some more specific behaviour details:
Intended/Expected:
Consistent use of textbox field (for filename):
displays filename of selected file
no events fire launch of browse dialog
Consistent use of browse button:
same css standards as standard HTML button for look and feel
opens browse dialog
dialog cancel - clears textbox field
dialog ok - (re)populates textbox field
We would like to have the look and feel of the textbox and button to use the same css as the rest of our web site.
Current:
textbox click events opens dialog
generic display of textbox and button field
browse button not working with some browsers (not firing browse dialog event, but being displayed)
As much as possible the behaviour (events/actions as above) should be consistent between all browser types.
What is the best way to make this compatible with all browsers?
It's already compatible with all browsers. Just don't try too hard to script it or overhaul the style. You have minimal customisation possibilities with the file upload field, partly for obvious security reasons and partly because the multiple-part rendering of the text+button arrangement in many browsers is simply not amenable to styling primitives that operate on single boxes.
(eg clicking on the text box in some browsers will open the input field).
Luckily people whose browsers do that will already be used to file upload fields doing that; indeed, they will expect the browser to do that, and be confused if you manage to stop it.
(And it's a sensible measure: allowing typing in the filename field is seldom useful, but it has caused security holes in the past.)
Consistent use of browse button:
Nothing about the file upload field even mandates a browse button or file-finder dialogue box. You might have eg. drap and drop instead. The browser decides this; as the site author you don't get a look in.
We would like to have the look and feel of the textbox and button to use the same css as the rest of our web site.
This isn't really possible within the realms of HTML. Hence the “third party uploaders”, typically Flash with HTML fallback.
There is one approach that you can sort-of use to make a file upload look like you want, but it's not very nice. You style a text field and button however you like, listen for changes to the file upload field and copy the value to the text field to display. The text field must be read-only because it won't be possible to allow the user to pick a file from there.
You then put the real file upload control on top of the fake one with CSS positioning, and give it CSS opacity (alpha filter in IE) so it's so faint you can't see it. You then have to hope that the browser decides to put a clickable part of the file upload field over the top of where you have rendered your button. Though you can fiddle and check it to work in many popular browsers, it's really very brittle and almost certainly a complete waste of time.
You will not get a consistent UI. Each browser does it's own implementation. A Safari user will expect the Safari method, same for IE and so on.
You might have some success with CSS control of the box but be aware that modern browsers have a lot of security on this field. You will have limited control of this field compared to fields
If you follow instruction here: http://www.15seconds.com/issue/010504.htm
you should be able to have consistent behaviour. Having just
As for styling - this is a task for you. Make sure your HTML and CSS are compatible (work as expected) in all browsers that you support.