add drag & drop to traditional file input? [closed] - javascript

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I have a traditional upload form (no upload plugins or AJAX submission). I'm hoping to add a drop target that will cover the whole page, like you see on sites like http://imgur.com, but I don't want to redesign the entire user flow.
Is there a simple plugin to display a modal overlay when a file is dragged over the screen, and then populate the input element when it's dropped, and fire the change event? If not, how would I go about writing such a thing?

After a LOT of research, I've found that this is an impossibility, as the FILE input type is read-only to javascript, in modern browsers, for security reasons. Because of this limitation, AJAX-style requests are the ONLY way to perform drag-and-drop uploads.

Related

PDF annotation in browser and save to database [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed last month.
Improve this question
I would like direction on how to display the content of a PDF in the web browser and allow the user to annotate the content and save the position(coordinates) of the annotation in a database so it can be re-used when the page is reloaded.
Display the PDF is not an issue. However how do I go about drawing a circle or any other shape and save these annotations into a database?
I found some licensed products such as PDFTron but its very expensive.
I've been doing some research on this topic but it doesn't seems to be a very straight forward thing to do. Maybe I am missing something here.
Not concerned about the tech-stack here, javascript, node, ruby or python it doesn't matter. Even if the pdf will have to be converted to HTML or something else that is fine too. The end goal is to allow the user to annotate the content and save.
Can someone point me on the right direction to achieve this?
Thanks

Rails rearrange links and change the resultant order in database [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I have one task. My app will have links of different websites. Their order is defined in database. I want to rearrange then by drag and drop. The resultant order should be reflected in database. I am a rails newbie. Kindly tell me which gems and scripts and how I can use. Kindly give me code reference or example as well.
Use any GUI library for drag and drop. Assign a position to each element. Display by order on position. After drag-n-drop, call ajax to a method/function which will swap the positions in database.

Moving button in screen [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
We have a feature on our website to prove us that the user is an actual human.
Here is how it's working.
After registering a button is shown and told to users to click on it ro prove that you are a human.
Once being mouseovered it start to move randomly all over the screen.
We use jquery to do this.
The main problem is that users are stopping javascript on their browser or edit the js with browser developer.
Some have created html forms to bypass this (yes we have csrf protection on all our forms they simply edit their form to the new csrf values)
This cheat is causing us to loose money.
We would appreciate help..
Best regards
P.S: We are familiar with captcha(google, solvemdia etc etc) but our proving system has to be this
The button will have the same ID therefor it's simple for someone to programmatically click it even if it does move on the screen.
The best way you could prove that the user is human would be to use a proven method such as a CAPTCHA(http://www.captcha.net/)
You can use the freely available reCAPTCHA(https://www.google.com/recaptcha/intro/index.html) from Google as suggested by #A.Wolff.

How to make form elements look consistent across all browsers and operating systems [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
All form elements look different in different browsers. I want to make it look same.
That's not really possible. Toolkits like Bootstrap are the closest we have to a balance between native controls and consistent controls. Solutions that offer consistent controls will basically use heavy styling to hide the original controls (selects, checkboxes, etc.) and JavaScript to simulate the interaction.
You basically just have to manually check from browser to browser to see what's not looking correct and make changes accordingly. CSS hacks help, but are kind of ugly
http://css-tricks.com/snippets/css/browser-specific-hacks/

How to check which javascript loads and preforms quicker [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I have written in javascript two different ways to hover over links and have the background of the window change color, one using event delegation and one not.
How do check which option is best performance wise (probably checking something in the browser developer tools)?
From reading about conventions I have learned that event delegation is the way to go but the code seems less clear and readable so I want to check if does actually perform better.
In Chrome Developer Tools you can use the Timeline section and create a recording of these events and time how long they take.

Categories

Resources