tejariapp-new-logotejariapp-new-logotejariapp-new-logotejariapp-new-logo
  • صفحه اصلی
  • پروژه ها
    • پروژه طراحی سایت
    • پروژه های اندروید
    • پروژه های تحت ویندوز
    • UI & UX
    • ربات تلگرام
  • سفارش پروژه
    • انجام پروژه اندروید (Android)
    • طراحی و ساخت اپلیکیشن موبایل
    • انجام پروژه طراحی سایت با php
    • انجام پروژه طراحی سایت با Asp.net
    • انجام پروژه سی شارپ
    • فرم سفارش پروژه
  • مدرسه ی تجاری اپ
    • طراحی سایت
    • اندروید
    • سی شارپ
    • آموزش پایگاه داده
    • برنامه های کاربردی
  • لینک های مفید
    • پرداخت آنلاین
    • درباره تجاری اپ
    • تماس با ما
استخدام برنامه نویس متلب
سفارش پروژه
✕
            هیچ نتیجه ای یافت نشدمشاهده همه نتایج

            آموزش دیتاتیبل (datatables) در لاراول 5.8

            • صفحه نخست
            • مدرسه ی تجاری اپ آموزش طراحی سایت
            • آموزش دیتاتیبل (datatables) در لاراول 5.8
            نحوه ایجاد و دانلود PDF در لاراول 5.8
            نحوه ایجاد و دانلود PDF در لاراول 5.8
            13 اردیبهشت 1398
            ساخت پترن و اعمال opacity در اندروید با کاتلین
            ساخت پترن و اعمال opacity در اندروید با کاتلین
            18 اردیبهشت 1398
            منتشر شده توسط مدیر سایت
            آموزش DataTables در لاراول 5.8

            آموزش DataTables در لاراول 5.8

            آموزش datatables در لاراول 5.8  ، در این پست از تجاری اپ قصد داریم نحوه ی نصب و استفاده از دیتاتیبل در لاراول 5.8 را به شما اموزش دهیم.برای این آموزش ما از پکیج laravel datatables استفاده خواهیم کرد.
            Datatables برای ما جستجوی سریع ، صفحه بندی ، مرتب سازی و غیره را فراهم می کند. Datatables اساسا پلاگین های جی کوئری می باشد که به ما اجازه می دهد تا کنترل های تعاملی پیشرفته را به داده های جداول HTML خود اضافه کنیم. Datatables همچنین برای جستجو و گرفتن اطلاعات ajax ارائه می دهد.ما می توانیم با استفاده از Datatables خیلی سریع یک layout برای جستجو و مرتب سازی ارائه دهیم.ما همچنین می توانیم Datatables را در پروژه لاراول خود پیاده سازی کنیم.

            آموزش datatables در لاراول 5.8

            شما کافیست برای پیاده سازی Datatables در پروژه لاراول خود فقط مراحل زیر را دنبال کنید. من این آموزش را در قالب یک مثال و از ابتدا توضیح خواهیم داد.با ما همراه باشید:

            1. نصب لاراول و پیکربندی اولیه
            2. نصب پکیج Yajra Datatable
            3. ایجاد رکوردهای ساختگی
            4. ایجاد Route
            5. ایجاد کنترلر
            6. ایجاد View

            نصب لاراول و پیکربندی اولیه

            برای هر پروژه لاراول ما نیاز داریم که لاراول را نصب کنیم. به همین دلیل ما یک مقاله در رابطه با چگونگی نصب و پیکربندی اولیه لاراول آماده کرده ایم که می توانید از اینجا ان را مشاهده نمایید : آموزش نصب لاراول به همراه تنظیمات اولیه

            نصب پکیج laravel datatables برای آموزش datatables در لاراول 5.8

            ما نیاز داریم برای Datatables پکیج yajra datatable را نصب کنیم.برای نصب این پکیج از دستور زیر استفاده می کنیم:

            composer require yajra/laravel-datatables-oracle
            

            بعد از نصب پکیج ما باید providers  و alias مربوط به پکیج را در فایل config/app.php ست کنیم :

            .....
            'providers' => [
            	....
            	Yajra\DataTables\DataTablesServiceProvider::class,
            ]
            'aliases' => [
            	....
            	'DataTables' => Yajra\DataTables\Facades\DataTables::class,
            ]
            .....
            

            همچنین بخوانید: آموزش گام به گام عملیات CRUD با لاراول 5.8

            ایجاد رکوردهای ساختگی

            در این مرحله ما تعدادی کاربر فیک با استفاده از tinker factory ایجاد خواهیم کرد.بنابراین برای ایجاد رکوردهای ساختگی دستور زیر را اجرا می کنیم:

            php artisan tinker
            
            factory(App\User::class, 200)->create();
            

            توجه داشته باشید که قبل از اجرای دستورات بالا باید پایگاه داده پروژه خود را ایجاد کرده باشید و همچنین دستور migrate را اجرا کرده باشید تا جدول users در پایگاه داده شما ایجاد شده باشد.

            ایجاد Route

            در این مرحله ما نیاز داریم یک Route برای فایل layout مربوط به datatables و گرفتن داده ها ایجاد کنیم.بنابراین فایل routes/web.php را باز کنید و Route زیر را در آن قرار دهید:

            Route::get('users', ['uses'=>'UserController@index', 'as'=>'users.index']);
            

            ایجاد کنترلر

            در این مرحله، ما باید کنترلر جدیدی با نام UserController ایجاد کنیم.این کنترلر layout وهمچنین گرفتن درخواست داده و برگرداندن پاسخ را مدیریت می کند ، بنابراین کدهای زیر را در فایل کنترلر مذکور قرار دهید:

            <?php
            
            namespace App\Http\Controllers;
            
            use App\User;
            use Illuminate\Http\Request;
            use DataTables;
            
            class UsersController extends Controller
            {
                /**
                 * Display a listing of the resource.
                 *
                 * @return \Illuminate\Http\Response
                 */
                public function index(Request $request)
                {
                    if ($request->ajax()) {
                        $data = User::latest()->get();
                        return Datatables::of($data)
                            ->addIndexColumn()
                            ->addColumn('action', function($row){
            
                                $btn = '<a href="javascript:void(0)" class="edit btn btn-primary btn-block">مشاهده</a>';
            
                                return $btn;
                            })
                            ->rawColumns(['action'])
                            ->make(true);
                    }
                    return view('users');
                }
            }
            

            ایجاد View

            در این مرحله که مرحله آخر مثال ما نیز می باشد یک فایل Blade با نام users.blade.php در مسیر resources/views/ برای layout  ایجاد کنید و کدهای زیر را در آن قراردهید:

            <!DOCTYPE html>
            <html>
            <head>
                <title>آموزش DataTables در لاراول 5.8 - Tejariapp.com</title>
                <meta name="csrf-token" content="{{ csrf_token() }}">
                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
                <link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
                <link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
                <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.js"></script>
                <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
                <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
                <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
                <style>
                    body {
                        direction: rtl;
                        text-align: right;
                    }
                    .dataTables_wrapper .dataTables_length {
                        float: right;
                    }
                    .dataTables_wrapper .dataTables_info {
                        float: right;
                    }
                    .example-title{
                        margin: 50px 0;
                    }
                    table.dataTable tbody th, table.dataTable tbody td {
                        padding: 4px 8px;
                    }
                </style>
            </head>
            <body>
            <div class="container">
                <h1 class="example-title">آموزش DataTables در لاراول 5.8 -  Tejariapp.com</h1>
                <table class="table table-bordered data-table">
                    <thead>
                    <tr>
                        <th>ردیف</th>
                        <th>نام</th>
                        <th>ایمیل</th>
                        <th width="100px">عملیات</th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
            </body>
            
            <script type="text/javascript">
                $(function () {
            
                    var table = $('.data-table').DataTable({
                        "oLanguage": {
                            "sUrl": "https://cdn.datatables.net/plug-ins/1.10.19/i18n/Persian.json"
                        },
                        "pageLength": 25,
                        processing: true,
                        serverSide: true,
                        ajax: "{{ route('users.index') }}",
                        columns: [
                            {data: 'DT_RowIndex', name: 'DT_RowIndex'},
                            {data: 'name', name: 'name'},
                            {data: 'email', name: 'email'},
                            {data: 'action', name: 'action', orderable: false, searchable: false},
                        ]
                    });
            
                });
            </script>
            </html>
            

            با اجرای دستور زیر می توانید خروجی این مثال را مشاهده نمایید:

            php artisan serve
            

            اکنون می توانید آدرس زیر را در مرورگر خود باز کنید:

            http://localhost:8000/users

            شما می توانید اطلاعات بیشتری در مورد این پکیج را از اینجا دریافت کنید: اینجا کلیک کنید.

            اشتراک گذاری

            پست های مرتبط

            دستورات جریان کنترل (Control flow statements) یا دستورات شرطی و حلقه ها در زبان برنامه نویسی دارت Dart

            دستورات جریان کنترل (Control flow statements) یا دستورات شرطی و حلقه ها در زبان برنامه نویسی دارت Dart

            30 بهمن 1400

            دستورات شرطی و حلقه ها در زبان برنامه نویسی دارت (Dart)


            ادامه مطلب
            آموزش عملگرها یا Operator ها در زبان برنامه نویسی دارت یا Dart

            آموزش عملگرها یا Operator ها در زبان برنامه نویسی دارت یا Dart

            30 بهمن 1400

            آموزش عملگرها یا Operator ها در زبان برنامه نویسی دارت (Dart)


            ادامه مطلب
            توابع در زبان برنامه نویسی دارت (Dart)

            توابع در زبان برنامه نویسی دارت (Dart)

            27 بهمن 1400

            توابع در زبان برنامه نویسی دارت (Dart)


            ادامه مطلب

            دیدگاهتان را بنویسید لغو پاسخ

            نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

            ساخت اپلیکیشن های موبایل

            • ساخت اپلیکیشن فروشگاهی
            • ساخت اپلیکشن ابزاری و خدماتی
            • ساخت اپلیکیشن آموزشی
            • و هزاران موضوع دیگر

             
            کلیک کنید

            آخرین دیدگاه ها

            • 7 خرداد 1401

              داودی نظر در آموزش استفاده از ckeditor همراه با آپلود عکس در لاراول 6

            • 6 فروردین 1401

              yasaman نظر در راست چین کردن متن در فیگما Figma

            • 3 فروردین 1401

              رضا نظر در مفاهیم Observable و Observer در RxJava

            تجاری اپ در شبکه های اجتماعی

            لوگوی تایید پرداخت آنلاین

            2015-2022 © تمامي حقوق مادي و معنوي اين وب سايت نزد تجاری اپ محفوظ بوده و هر گونه کپي برداري از مطالب پيگرد قانوني به همراه دارد! | طراح سایت : ProgRun
            سفارش پروژه
                      هیچ نتیجه ای یافت نشدمشاهده همه نتایج