I have an existing form which I would like to make a bit more informative.
I.e. a user can upload an image from their desktop, or associate an item that has already been uploaded.
So, if the user clicks on the “choose file”, the normal response occurs, but if the user clicks on a button that says “choose from library” they then get prompted with a facebox screen, where they choose an item by means of radio or checkbox inputs, when they are then done or submits from the facebox screen, the first form gets updated with the data.
Any ideas or pointers?
Look at using jQuery’s .click() (http://api.jquery.com/click/) function for your ‘choose from library’ button.
What you can then do is get this click function to fire a AJAX request to your backend that responds with the available items in the user’s library. Once that’s complete, you can show a nice thumbnail UI, the user picks a thumbnail and this updates a hidden field (http://www.google.co.uk/search?aq=f&sourceid=chrome&ie=UTF-8&q=hidden+input+fields) on your form and job done.
The main consideration you need to take into account is building the backend side of the processing (ie: loading the user’s thumbnails) and building the thumbnail list on the front end, although you may be able to use jQuery UI for that: http://jqueryui.com/