Giriş yapmadınız.

Duyuru

TÜRKÇE KİTAP DUYURUSU:
Laravel 5 : Laravel 5.1 Güzelliği (Türkçe)
Vue.js 2 : Vue.js 2 Majesteleri (Türkçe)

#1 13.06.2018 21:48:56

mirimiran
Üye
Kayıtlı: 04.02.2016
Mesajlar: 218

Vue js Datatables kullanımı

Laravel de yajra/laravel-datatables paketini kullanarak server side bi datatable oluşturdum ama edit işlemi için vue js methodunu render edemiyorum butona tıklayınca callback işlemi olmuyor
Yazdığım kod

$units = Units::select(['id', 'name', 'unit', 'number', 'status', 'created_at']);
    return Datatables::of($units)
        ->addColumn('action', function ($units) {
            return '<button type="button" class="btn btn-default btn-sm btn-icon-anim btn-circle" v-on:click="editItem('.$units.')"><i class="fa fa-trash"></i></button>';
        })
        ->rawColumns(['action'])
        ->editColumn('status', function ($units) {
            $status_list = array(
              array("danger" 		=> "Pasif"),
              array("success"		=> "Aktif")
            );
            $status = $status_list[$units->status];
            if ($units->status == 0)return $status;
            if ($units->status == 1)return $status;
        })
        ->make(true);

Vue componentinde de

$('#dataTable').dataTable({
              paging: true,
              searching: true,
              destroy : true,
              processing      : true,
              serverSide      : true,
              pageLength      : 50,
              fixedHeader     : !0,
              ajax: '/yonetim/settings/getUnits',
              columns: [
                  { data: 'id', title: "#",orderable: true, searchable: true},
                  { data: 'name', title: "Adı",orderable: true, searchable: true},
                  { data: 'unit', title: "Birimi",orderable: true, searchable: true},
                  { data: 'number', title: "Sırası",orderable: true, searchable: true},
                  { data: 'status', title: "Durumu",
                    render : function(data, type, row) {
                        return '<span class="label label-'+Object.keys(data)[0]+'">'+Object.values(data)[0]+'</span>';
                    },
                    orderable: true, searchable: false
                  },
                  {data: 'created_at', title: 'Created_at',orderable: false, searchable: false},
                  {data: 'action', title: 'Action', orderable: false, searchable: false}
              ],
              order: [[ 0, "desc" ]],
              lengthMenu: [[ 25, 50, 101], [ 25, 50, 101]],
              select: true,

            });

Vue methodu da

editItem(item) {
          console.log("Tıklandı");
        }

Nerde hata yapıyorum yardımcı olabilecek arkadaş var mı?

Son düzenleyen mirimiran (13.06.2018 21:49:22)

Çevrimdışı

Forum alt kısmı