---
title: Render the multi-select list
summary: Render a drop-down multi-select list backed by a checkbox list.
status: draft
owner: SAIF Doc Gen
last_reviewed: 2026-08-17
library: SAIF.Presentation.Web.Controls.V2
reference_type: package
operation_id: OP-V2-010
trigger: "`CreateChildControls` and `DataBind` for a `MultiListControl` instance."
---

# Render the multi-select list

Render a drop-down multi-select list backed by a checkbox list. `CreateChildControls` and `DataBind` for a `MultiListControl` instance.

| Field | Value |
| --- | --- |
| **Operation ID** | OP-V2-010 |
| **Trigger** | `CreateChildControls` and `DataBind` for a `MultiListControl` instance. |
| **Inputs** | `IsTextEditable`, `ListDatasource`, `TextDatasource`, `WildCardItem`. |
| **Outputs** | A composite textbox + arrow image button + checkbox list control. |
| **Primary components** | `MultiListControl` |
| **Entry point** | `SAIF.Presentation.Web.Controls.V2/MultiListControl.vb` |

## Steps

1. On `CreateChildControls`, compose a textbox (editable per `IsTextEditable`), an image button whose `src` is resolved from the embedded `MultiComboArrow.gif` web resource, and a checkbox list. ([BR-V2-061](../business-rules.md#br-v2-061-multi-select-list-composed-of-textbox-image-button-and-checkbox-list), [BR-V2-062](../business-rules.md#br-v2-062-text-portion-editability-controlled-by-istexteditable))
2. Wire the image button `onclick` to `MultiListShow('<id>_<checkListClientId>')` and add an `onmousedown` handler to the page form calling `MultListLostFocus(event)` so the list closes when focus is lost. ([BR-V2-063](../business-rules.md#br-v2-063-list-auto-closes-on-focus-loss))
3. Register the embedded `MultiList.js` script include through `Page.ClientScript.GetWebResourceUrl`. ([BR-V2-064](../business-rules.md#br-v2-064-multi-list-assets-ship-as-embedded-web-resources))
4. `DataBind` binds `ListDatasource` to the checkbox list and `TextDatasource` to the text display; `WildCardItem` designates the entry that represents "all". ([BR-V2-065](../business-rules.md#br-v2-065-wildcarditem-designates-the-all-values-entry))

## Process flow

The following diagram visualizes this operation's control flow.

```mermaid
flowchart TD
	Start([CreateChildControls]) --> Compose[Compose textbox + image button + checkbox list]
	Compose --> Wire[Wire onclick/onmousedown handlers]
	Wire --> Script[Register embedded MultiList.js]
	Script --> DataBindS([DataBind]) 
	DataBindS --> Bind[Bind ListDatasource/TextDatasource]
	Bind --> Done([Rendered])
```

## Failure and edge-case behavior

- No exceptional failure handling beyond the branches described in **Steps** was found in the analysis findings.*

## Related documentation
- [Operations and processes](../operations-processes.md)
- [Business rules](../business-rules.md)

## Sources
- `SAIF.Presentation.Web.Controls.V2/MultiListControl.vb`