This package developed for edit-update any database field with Bootstrap modal and JQuery/Ajax.
composer require murattcann/update-modal
This package provides you to update any field in the table without refresh page. You can use this to update any kind of database table field as live. Lets get started!
I assume you have products table like this:
You should include modal view to the top index page and pass "modalTitle" parameter to this view. This parameter our modals new title. You can just write "Edit".
You should include js blade view to the bottom of index page.
Now, you should include button blade view to the corresponding table td tag with with specified parameters like this:
The process we just did should give us this result on the index page:
As you can see, we can edit-update title and price title.
If you click price to edit you would see the modals input type is number. It is because of "inputType" parameter which we passed to included view.
If you click title to edit you would see the modals input type is textarea. This is because of same reason. We did it.
If you use yajrabox datatables package you can also integrate for this. But there is a little bit difference between traditional html tables and yajrabox datatable. You know, yajrabox package is rendering table view on server side. So, you haven't got a table which you can edit on the view files.
Yajrabox package generates table from server side and you should only write {!! $dataTable->table() !!}
on view page that you would like to use. As you can see, there is no html table to edit cells. So, how can we do this editing things in this case? Lets get started.
I assueme you have services table like this:
Now, we should have a helper to generate button as we want.
Let's say, I want to edit priority field with this package.
We must have some functions to do so.
After this step, you should edit ServiceDataTable.php file according to your wish.
As I said before, I want to edit priority field. So, I should make such a change:
This is the different side of yajrabox. Other steps are same with html table.
Now, you should include modal view and update blade file as we did before.
If you encounter any errors or problems, contact with me.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent