Download the PHP package jeremykes/keselect without Composer
On this page you can find all versions of the php package jeremykes/keselect. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download jeremykes/keselect
More information about jeremykes/keselect
Files in jeremykes/keselect
Package keselect
Short Description KeSelect is a TALL Stack dropdown picker with Eloquent Search autofill.
License MIT
FAQ
Example:
In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
- Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
- To use Composer is sometimes complicated. Especially for beginners.
- Composer needs much resources. Sometimes they are not available on a simple webspace.
- If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
- Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Informations about the package keselect
KeSelect Livewire 3 Dropdown Picker
KeSelect is a TALL Stack dropdown picker with eloquent search autofill.
I created this component because it was quite hard to find anything around for the TALL Stack. The component mimics the main functions of a lot of the other available plugins like Select2, SelectJS, TomSelect, SelectizeJS and so forth. I just didn't like going down the path of installing multiple other packages and jQuery (no thanks).
Requirement
- PHP v8.1
- Laravel v10
- Livewire v3
- TailwindCSS
- AlpineJS
KeSelect uses plain Laravel, Livewire, AlpineJS and TailwindCSS to achieve a simple dropdown select functionality that grabs data directly from the backend. The component can be customized normally in a "laravelly" way as see fit.
Installation
You can install KeSelect using composer.
Quick Start
After installing the component, include it in your blade application and you are good to go. For example (assuming we have a variable :
There are two required variables for the component; and . Their description can be found below.
Documentation
Property Explanation
- (required) - this name must exactly match the Model you would like to perform the search on. If it doesn't exist, the component will throw an error. For example if you had a Customers Model: .
- (required) - this is an array of column names in your Model that you would like the search to be performed on. If any of the columns do not exist in your Model, the component will throw an error. An example format of this is: .
- (optional) - this is the minimum number of characters that will be entered before the search is fired. The default is 3. For example if you wanted the search to fire after the 5th character: .
- (optional) - this is a column value that you want highlighted in the search results. As in the GIF above, the column value is bolded on the first line while all other column values are listed underneath in a slightly smaller font. This is also the value that will be shown in the input form if selected. If nothing is defined, the first value in the array will be used as the . For example if you wanted description to be the highlighted value: .
- (optional) - if your Model ID is not (example you use instead), then you need to define that so that the proper ID is referenced. If no is provided, the default will be assumed as . If the component can't find either definitions existing in the Model, an error will be thrown. For example if you use instead, you will define it as: .
In the KeSelect component is Modeled out of the component so that it can be referenced in the parent component. This is to allow the ID to be available to the parent once that relevant option is selected from the dropdown search results. You can reference it in the parent component like so:
If the in the is set initially (not NULL), the component will try to initialize the dropdown input with that ID. This is useful for "Edit" or "Read" pages where you need to initialize the component to have a pre-selected value.
This is the model declaration:
Styling
Included out of the box is both TailwindCSS light and dark theme. The styles are pretty standard and can be customized as necessary.
License
The MIT License (MIT).
Future
Multi-Select
I have not added Multi-select to the Component but will do so in the near future. I will see how I go.
Testing
I also have not done extensive testing on this component so please use at your own risk.
Final Thoughts
This was a fun little weekend project so if you want to get in touch for a collab or anything let me know! I hope this component is super useful for you.
