{"id":37319349,"url":"https://github.com/workindia/search-select","last_synced_at":"2026-01-16T03:15:59.430Z","repository":{"id":46862344,"uuid":"245217396","full_name":"workindia/search-select","owner":"workindia","description":"SearchSelect: A searchable dropdown library","archived":false,"fork":false,"pushed_at":"2021-10-28T11:56:33.000Z","size":277,"stargazers_count":6,"open_issues_count":1,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-08-09T22:09:12.065Z","etag":null,"topics":["autocomplete","dropdown","javascript-library","search","searchable"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/workindia.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-03-05T16:46:18.000Z","updated_at":"2024-01-03T12:22:32.000Z","dependencies_parsed_at":"2022-09-23T06:40:21.345Z","dependency_job_id":null,"html_url":"https://github.com/workindia/search-select","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"purl":"pkg:github/workindia/search-select","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workindia%2Fsearch-select","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workindia%2Fsearch-select/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workindia%2Fsearch-select/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workindia%2Fsearch-select/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/workindia","download_url":"https://codeload.github.com/workindia/search-select/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/workindia%2Fsearch-select/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28477070,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-16T03:13:13.607Z","status":"ssl_error","status_checked_at":"2026-01-16T03:11:47.863Z","response_time":107,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["autocomplete","dropdown","javascript-library","search","searchable"],"created_at":"2026-01-16T03:15:58.810Z","updated_at":"2026-01-16T03:15:59.422Z","avatar_url":"https://github.com/workindia.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Search-Select\n\nSearchSelect: A searchable dropdown library.\n\n![](examples/vdo.gif)\n\n## Installation and usage\n\n### Installation\n\nDownload search-select using below methods.\n\n1. Git Release\n\n```sh\nhttps://github.com/workindia/search-select/releases\n```\n\n2. CDN\n\n```sh\nhttps://cdn.jsdelivr.net/gh/workindia/search-select@1.0.0/search-select.js\n```\n\n3. NPM\n\n```sh\nnpm i search-select-js\n```\n\n### Usage\n\nAdd search-select to your page:\n```html\n\u003clink rel=\"stylesheet\" href=\"search-select.css\"\u003e\n\u003cscript src=\"search-select.js\"\u003e\u003c/script\u003e\n```\n\nYou can create a hidden input with class `Search-Select--Hidden-Input` which will be used to create a search-select dropdown:\n```html\n\u003cinput id=\"dropdown-input\"\n    name=\"dropdown-input\"\n    class=\"Search-Select--Hidden-Input\"\n    placeholder=\"Pick Your Item\"\n    data-search-placeholder=\"Search Your Item\"\n    hidden/\u003e\n```\n\nTo initialize search-select dropdown, add following to your javascript:\n```javascript\nconst searchSelectDropdown = new SearchSelect('#dropdown-input', {\n    data: ['item1', 'item2', 'item3', 'item4'],\n    filter: SearchSelect.FILTER_CONTAINS,\n    sort: undefined,\n    inputClass: 'form-control mobile-field',\n    maxOpenEntries: 9,\n    searchPosition: 'top',\n    onInputClickCallback: function(ev) { console.log('Input Clicked') },\n    onInputKeyDownCallback: function(ev) { console.log('Input Key Down') },\n});\n```\n\nSearch-select will set selected value to the hidden input (`#dropdown-input`). Selected value can be retrieved from the hidden input. Change event listener can be applied to the hidden input to watch any change in the value.\n```javascript\n// Get selected value\nconst selectedValue = document.getElementById('dropdown-input').value;\n\n// Add change listner\ndocument.getElementById('dropdown-input').addEventListner('change', function(ev) { console.log('Value changed'); })\n```\n\n\n## Configuration Parameters\n- `data` - Input data for dropdown\n- `filter` - Filter criteria for dropdown search\n- `sort` - Sort criteria for dropdown items\n- `inputClass` - Custom class to be applied to the visible input\n- `maxOpenEntries` - Maximum number of items visible when dropdown is open\n- `searchPosition` - Position of search bar input\n- `dropdownPosition` - Position of dropdown\n- `onInputClickCallback` - Event called when search-select input is clicked\n- `onInputKeyDownCallback` - Event called when a key is pressed in search bar\n\n\n## Methods\n- `openDropdown(focus)` - Open dropdown. Pass `focus=true` if to set focus on search bar\n- `closeDropdown()` - Close dropdown.\n- `setData(data)` - Set dropdown list data.\n\n\n## License\n\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fworkindia%2Fsearch-select","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fworkindia%2Fsearch-select","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fworkindia%2Fsearch-select/lists"}