caption: browse
created: 20131024141900000
modified: 20231113093304323
tags: Widgets
title: BrowseWidget
type: text/vnd.tiddlywiki

! Introduction

The browse widget displays an HTML file browser button that allows the user to choose one or more files to import. It sends a [[WidgetMessage: tm-import-tiddlers]] carrying a JSON representation of the tiddlers imported from the files up through its parents. This message is usually handled by the NavigatorWidget which adds the tiddlers to the store and updates the story to display them.

! Content and Attributes

The content of the <<.wid BrowseWidget>> widget is ignored.

|!Attribute |!Description |
|multiple |Set to "multiple" to select multiple file upload |
|deserializer |<<.from-version "5.1.15">> Optional name of deserializer to be used (by default the deserializer is derived from the file extension or type) |
|tooltip |Optional tooltip text |
|accept |<<.from-version "5.1.23">> Optional comma delimited [[list of file accepted extensions|https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#Unique_file_type_specifiers]] and/or MIME types |
|message |Optional override of widget message to be generated. The files will be passed in the JavaScript object `event.target.files` |
|param |Optional parameter to be passed with the custom message |
|disabled |<<.from-version "5.3.7">> Optional. Set to "yes" to disable file browser. Defaults to "no". |
|tabindex |<<.from-version "5.3.7">> Optional. Sets the `tabindex` attribute of the HTML select element to the given value |
|data-* |<<.from-version "5.3.2">> Optional [[data attributes|https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes]] to be assigned to the HTML element |
|style.* |<<.from-version "5.3.2">> Optional [[CSS properties|https://developer.mozilla.org/en-US/docs/Web/CSS/Reference]] to be assigned to the HTML element |

On iPhone/iPad choosing the multiple option will remove the ability to take photographs/videos directly into TiddlyWiki.

''e.g.''

```
<$browse/>
```

renders as:

<$browse/>

