# GC.Spread.Sheets.NameBox.NameBox

## Content

# Class: NameBox

[Sheets](../modules/GC.Spread.Sheets).[NameBox](../modules/GC.Spread.Sheets.NameBox).NameBox

## Table of contents

### Constructors

- [constructor](GC.Spread.Sheets.NameBox.NameBox#constructor)

### Properties

- [options](GC.Spread.Sheets.NameBox.NameBox#options)

### Methods

- [dispose](GC.Spread.Sheets.NameBox.NameBox#dispose)
- [getHost](GC.Spread.Sheets.NameBox.NameBox#gethost)
- [refresh](GC.Spread.Sheets.NameBox.NameBox#refresh)

## Constructors

### <a id="constructor" name="constructor"></a> constructor

• **new NameBox**(`host`, `workbook`, `options?`)

Represents name box.

#### Parameters

| Name | Type | Description |
| :------ | :------ | :------ |
| `host` | `string` \| `HTMLElement` | The DOM Element. |
| `workbook` | [`Workbook`](GC.Spread.Sheets.Workbook) | - |
| `options?` | [`INameBoxOptions`](../interfaces/GC.Spread.Sheets.NameBox.INameBoxOptions) | - |

## Properties

### <a id="options" name="options"></a> options

• **options**: [`INameBoxOptions`](../interfaces/GC.Spread.Sheets.NameBox.INameBoxOptions)

Indicates the options of the name box.

**`property`** {boolean} [enableAddCustomName] Indicates whether enable add custom name when input a name which is not existed to the selector.

**`property`** {boolean} [enableNavigateToRange] Indicates whether enable navigate to the named range or drawing item when input its name or click on custom list item.

**`property`** {boolean} [showCustomNameList] Indicates whether show the custom name list dropdown indicator.

**`property`** {number} [dropDownMaxHeight] Indicates the drop down list element max height.

**`example`**
```javascript
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
var div = document.createElement('div');
div.id = 'nameBox';
div.style.width = '300px';
div.style.height = '50px';
document.getElementById('panel').appendChild(div);

var nameBox = new GC.Spread.Sheets.NameBox.NameBox(document.getElementById('nameBox'), spread);
nameBox.options.enableAddCustomName = false; // cannot add custom name with inputting in name box input box now.
nameBox.options.enableNavigateToRange = false; // cannot swap the selected range to the value of the name box input box now.
nameBox.options.showCustomNameList = false; // cannot open the custom name list by down arrow button right side and the button will be hidden now.
nameBox.options.dropDownMaxHeight = 100; // the custom name list host DOM element height will no larger than 100px now.

```

## Methods

### <a id="dispose" name="dispose"></a> dispose

▸ **dispose**(): `void`

Dispose the NameBox and unbind all events.

**`example`**
```javascript
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
var nameBox = new GC.Spread.Sheets.NameBox.NameBox(document.getElementById('nameBox'), spread);
// do something
nameBox.dispose();
```

#### Returns

`void`

___

### <a id="gethost" name="gethost"></a> getHost

▸ **getHost**(): `HTMLElement`

get the NameBox host element.

**`example`**
```javascript
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
var nameBox = new GC.Spread.Sheets.NameBox.NameBox(document.getElementById('nameBox'), spread);
var host = nameBox.getHost();
```

#### Returns

`HTMLElement`

___

### <a id="refresh" name="refresh"></a> refresh

▸ **refresh**(): `void`

refresh the NameBox and sync the name box value to the work sheet selection.

**`example`**
```javascript
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
var nameBox = new GC.Spread.Sheets.NameBox.NameBox(document.getElementById('nameBox'), spread);
var sheet = spread.getActiveSheet();
sheet.setSelection(0, 0, 3, 3);
nameBox.refresh();
```

#### Returns

`void`