Displaying filename in a input type=file scenario

[webcliq]

I have attached ss.SimpleUpload to a standard input type=file form field. I have no problems uploading the file in both an Add Record and Edit Record situation.

The default behaviour for an input type=file field is that when the file is chosen, the name of the file selected replaces the "No file selected" text. SimpleUpload does not replicate that behaviour. This is nuisance for an Add Record scenario but annoying for an Edit Record scenario as the user has no idea what the stored filename is.

Comments, suggestions and ideally a solution would be appreciated.

[LPology]

I worked on this for a couple of hours tonight. Can you try this version of the uploader and see if it fixes your issue:

http://pastebin.com/dkDMiHsZ

Please let me know what feedback you have. Thanks.

[webcliq]

Firstly, thank you very much for your efforts. Regrettably your "fix" in 2.2 did not work. When I reverted my best attempt at a File Upload field that is in keeping with the rest of my UX design, to a traditional input, type=file, on uploading the file, input field just disappeared!

Now before you made the change, it did nothing at all .... so persuading it to disappear must be considered some form of progress .....

---

I am in the process of updating my Cliqon CMS (see Cliqon.Com). I am working on V4. I am also using my new V$ to rewrite my business directory, Ojored.Com, which serves as my demo for Cliqon and a money maker in its own right.

I have a PHP Class called clqform.class.php. In it I have two functions that handle "uploading". One is a Drag and Drop image uploader. Which is, as you can imagine, no use for ordinary file uploads such as PDFs. I had used qq.FileUploader in the past but as you will know, that has moved on to better things. I searched for an uptodate version of what I had had before and found your offering. I can see what the roots of SimpleUploader are and therefore, in principle, it does what I want.

Having gone through the usual learning and implementation stage (which it seems that most of the other people raising issues, do not do) I have it working (apart from my issue) exactly as I would wish.

I can implement your JS script on either a traditional input type=file or on a constructed file input field (div, button and span). The latter has two benefits, it is exactly in line with your demo and also it can be made to follow the UX or design standard for a form (I use a modified form of Bootstrap).

I could not make your script display the uploaded filename on either file field - traditional or constructed. If I turned off your script then the filename automatically appearing (after being selected) or being displayed programmatically (see replaceText()), just happens. Equally on an edit record, writing the filename to a value="" also works. With one proviso, I discovered that if the filename is too long, it will not display. So as a temporary measure I have truncated it.

Therefore, so as not to involve you in my activities, which might confuse the issue, I raised the issue as simply as I could - I took the simple case of the input type=file and reported that.

Working within the limitations of Github, I have uploaded a screen grab which shows how doc.txt is not replaced by the filename. I use Noty growls as a progress meter.

As I have said in my first sentence, I also replaced my current programming with just a plain input type=file field and as I explained, upon successful upload the field disappeared.

Attached below are screengrabs and my code in the form of 3 PNG.

I would be delighted to assist in any way I can to help you solve this.

Please may I make an important design or UX request. I have been designing "systems" for nearly 35 years. I still fervently believe that the way I was taught to design systems then is still correct today. Records are display on a list. Any CRUD activity should be displayed on a popup. Before the implementation of Javascript and Ajax in the mid last decade, all web data entry forms would involve a transition from listing page to data entry page. Many top notch web systems, including systems like WordPress and Drupal, Joomla, Umbraco etc. do it that way when there is absolutely no need.

What I do not wish to support in any file upload mechanism (or anything else such as form validation) is providing support for bits of the form that are going to expand and contract. The successor to qq.FileUploader would have forced me to go that route.

I was able to make your progress feedback work with Noty growls. I believe that is the best solution. I believe that if you concentrate on providing a File Upload facility that does not force me to make space for your messages, then you will have an edge and a niche over others.

I trust that this makes sense and I hope you find the suggestion and feedback useful.

Mark Richards Webcliq