Как сделать, чтобы форма понимала, когда я хочу загрузить картинку с компьютера и когда с удалённого URL?

Question

[GoldenAlex]

Доброе время суток,

Описание задачи: есть форма в которое вставлено поле для загрузки файлов. При просмотре в браузере форма приобретает вид текстового поля с кнопкой Browse на борту. Это стандартный набор. Сама задача состоит в том что это текстовое поле хочу использоваться как для загрузки картинок с компьютера так и с URL. Т.е. если я хочу загрузить картинку с URL, то просто пропишу полный путь картинки в это же поле.

Как сделать чтобы форма понимала когда я хочу загрузить картинку с компьютера и когда с удалённого URL?

Спасибо за ответы!

Answer 1

[Евгений]

Кнопка-переключатель + скрытые поля + JS-магия

Answer 2

[bsboris]

В Хроме и Сафари форма загрузки файлов не имеет текстового поля, например, только кнопка «Browse».
Наверное, надо самому сделать текстовый инпут и кнопку, поле file сделать скрытым и эмулировать нужные события через JS. А на стороне сервера уже разбирать какое поле заполнено и как грузить файл.

Answer 3

[NemeZZiZZ]

Нужно сделать два разных поля: одно будет [input name='file' type='file'], второе [input name='url' type='text']. С помощью CSS Вы сможете из совместить в одно. При получении данных обработчиком в $_FILES будет информация по отправленному файлу, а в $_POST — по URL этого файла.

Comments

[NemeZZiZZ]

Возможно, Вам будет полезен такой подход: немного дополнив его, Вы можете получить желаемую форму. Сделано там упрощённо-примитивно, важна сама идея.

[NemeZZiZZ]

Ссылку забыл, извиняюсь: vremenno.net/design/file-inputs-styling/

Answer 4

[Hint]

Вы ведь понимаете, что изменить форму визуально будет недостаточно? Вам придется дописывать скрипт на сервере, принимающий файлы.

Answer 5

[Пума Тайланд]

Что вам мешает отличить ссылку от локального пути в js?
test.org/picture.jpg
c://mydirectory/picture.jpg
Сказать честно я наверно не понял до конца вопроса.

Answer 6

[Nikitian]

Урл можно вставить и в форму выбора файла в поле имени файла.