PHPackages lara-pack/livewire-select2 - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. lara-pack/livewire-select2 ActiveLibrary[Utility & Helpers](/categories/utility) lara-pack/livewire-select2 ========================== Livewire Component : Select2 v1.0.6(3mo ago)01031MITBlade Since Aug 19Pushed 3mo agoCompare [ Source](https://github.com/bhagaskara/lara-pack-livewire-select2)[ Packagist](https://packagist.org/packages/lara-pack/livewire-select2)[ RSS](/packages/lara-pack-livewire-select2/feed)WikiDiscussions main Synced 3w ago READMEChangelogDependencies (1)Versions (8)Used By (1) Livewire Select2 Component ========================== [](#livewire-select2-component) A custom Livewire V3/V4 component wrapper for **Select2**. This component simplifies the usage of Select2 in your Livewire projects, supporting both static options arrays and AJAX-based remote data loading, along with multiple selections capabilities. Requirements ------------ [](#requirements) - PHP 8.1+ - Laravel 10+ / 11+ - Livewire ^3.0|^4.0 - jQuery - Select2 (JS & CSS) Installation ------------ [](#installation) You can install the package via composer: ``` composer require lara-pack/livewire-select2 ``` > **Note:** Ensure you have already included jQuery and Select2 assets in your layout file/app. Usage ----- [](#usage) You can use the component in your Livewire blade views using the `` tag. ### 1. Basic Usage (Static Options) [](#1-basic-usage-static-options) Provide an array of arrays containing `id` and `text` keys. ``` ``` ### 2. AJAX Remote Data (Load from API / URL) [](#2-ajax-remote-data-load-from-api--url) Instead of passing static options, you can provide an endpoint URL. The component will handle the AJAX calls and debounce internally. The API should return an array of objects structured as `[{ "id": 1, "text": "Option 1" }, ...]`. ``` ``` ### 3. Multiple Selections [](#3-multiple-selections) Enable multiple selection mode by passing `:multiple="true"`. ``` ``` ### 4. Custom "Select All Filtered" for Multiple AJAX [](#4-custom-select-all-filtered-for-multiple-ajax) This component comes with a special feature for AJAX Multiple Select. If you pass `:multipleSelection="true"`, an extra option *"--- Pilih Semua Yang Tampil ---"* will appear at the top. Selecting it will fetch and select all data matching the search term. ``` ``` Available Properties -------------------- [](#available-properties) PropertyTypeDefaultDescription`wire:model``string``null`Bind the selected value. Must be `{ "id": ..., "text": ... }` for single select, or an array of objects for multiple.`options``array``[]`Static array of options: `[['id'=>1, 'text'=>'Opt']]`.`url``string``""`The API Endpoint for AJAX data loading.`minimumInputLength``int``0`Number of characters required to trigger the search.`placeholder``string``""`Placeholder text for the input.`allowClear``bool``true`Show a clear button (X) to reset the value.`dropdownParent``string``""`Appends the dropdown to a specific element. Very useful inside Bootstrap Modals (e.g., `'#myModal'`).`debounceTime``int``500`Delay in milliseconds before firing the AJAX request.`class``string``''`Extra CSS classes injected directly to the `` element.`theme``string``''`Select2 theme (e.g., `'bootstrap-5'`).`multiple``bool``false`Set to true to allow arrays of selections.`multipleSelection``bool``false`When true in AJAX `multiple` mode, allows selecting all loaded search results at once.`disabled``bool``false`Disables the Select2 input entirely.Data Binding & Format ------------------------- [](#data-binding--format) Because Livewire components pass data over the wire, **the bound value representation is always an object or an array of objects**, representing the selected `id` and `text`. For single selection: ``` // In your Livewire Component Controller public $selectedCity = ['id' => '1', 'text' => 'Jakarta']; ``` For multiple selections: ``` // In your Livewire Component Controller public $selectedTags = [ ['id' => '1', 'text' => 'PHP'], ['id' => '2', 'text' => 'Laravel'] ]; ``` Troubleshooting: Modals ----------------------- [](#troubleshooting-modals) If your Select2 input isn't clickable or doesn't show properly inside a Bootstrap Modal, you need to set the `dropdownParent` property to target your modal element. ``` ``` License ------- [](#license) This package is distributed under the [MIT license](LICENSE). ### Health Score 36 — LowBetter than 79% of packages Maintenance78 Regular maintenance activity Popularity10 Limited adoption so far Community10 Small or concentrated contributor base Maturity41 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~32 days Recently: every ~43 days Total 7 Last Release 114d ago ### Community Maintainers ![](https://avatars.githubusercontent.com/u/24548806?v=4)[bhagaskara](/maintainers/bhagaskara)[@bhagaskara](https://github.com/bhagaskara) --- Top Contributors [![bhagaskara](https://avatars.githubusercontent.com/u/24548806?v=4)](https://github.com/bhagaskara "bhagaskara (10 commits)") ### Embed Badge ![Health badge](/badges/lara-pack-livewire-select2/health.svg) ``` [![Health](https://phpackages.com/badges/lara-pack-livewire-select2/health.svg)](https://phpackages.com/packages/lara-pack-livewire-select2) ``` ### Alternatives [venturedrake/laravel-crm A free open source CRM built as a package for laravel projects 42010.0k](/packages/venturedrake-laravel-crm)[ramonrietdijk/livewire-tables Dynamic tables for models with Laravel Livewire 21255.6k](/packages/ramonrietdijk-livewire-tables)[lakm/laravel-comments Integrate seamless commenting functionality into your Laravel project. 40614.3k1](/packages/lakm-laravel-comments)[noerd/noerd 101.3k6](/packages/noerd-noerd)[team-nifty-gmbh/tall-datatables Server-side rendered datatables for Laravel and Livewire 1319.7k3](/packages/team-nifty-gmbh-tall-datatables)[aerni/livewire-forms A Statamic forms framework powered by Laravel Livewire 2914.3k](/packages/aerni-livewire-forms) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)