Code Monkey home page Code Monkey logo

orchid-repeater-field's Introduction

Orchid Platform Repeater Field

Brief

We've all worked with WordPress at one time or another. Inspired by Advanced Custom Fields.

This package adding repeater fields support to Orchid RAD platform.

Pre-requirements

You must have installed and configured Orchid Platform

Version Support: .*

For ^13.0.1 use ^13.0.0 tag and newer.

Older versions do not have support for most of the current functionality.

For 6.* version use 2.0.5 tag.

For 5 version use 1.0.0 tag.

For 4.7.1 version use 0.0.8 tag.

How to use

  1. Install package with composer: composer require nakukryskin/orchid-repeater-field

    Latest version of laravel automatically discover package to use.

  2. Create RepeaterFields.php in your Orchid Layouts directory. Example:

 <?php
 
 namespace App\Http\Orchid\Layouts\Repeaters;
 
 use Orchid\Screen\Layouts\Rows;
 use Orchid\Screen\Fields\Input;
 use Orchid\Screen\Fields\Select;
 
 class RepeaterFields extends Rows
 {
     function fields(): array
     {
         return [
             Input::make('repeater_name')
                 ->type('text')
                 ->max(255)
                 ->required()
                 ->title('Nested Field'),
             
             Select::make('select.')
                 ->multiple()
                 ->options([
                     'test' => 'Test',
                     'test2' => 'Test2'
                 ])
                 ->required()
         ];
     }
 }
  1. Simply start adding the RepeaterField::make('repeater') in your screen: Example:
public function layout(): array
{
   return [
       Layout::rows([
           RepeaterField::make('repeater')
               ->title('Repeater')
               ->layout(App\Http\Orchid\Layouts\Repeaters\RepeaterFields::class),
       ])
   ];
}
  1. Open your screen and check that the repeater fields here

Advanced usage

Repeater field also support required, max and min parameters. You can add these parameters with call the RepeaterField.

RepeaterField::make('repeater')
    ->title('Repeater')
    ->layout(App\Http\Orchid\Layouts\Repeaters\RepeaterFields::class)
    ->required()
    ->min(10)
    ->max(20)

If ->required() passed to the constructor automatically will set min to 1. If the user tries to delete this field, it will be prevented and show the message.

You can also change the text when deleting a block using the method ->confirmText('Are you sure that you want to delete the block?').

To show required message on save you must add this rule to your screen rules, eg. 'content.*.repeater' => 'required'

You also can rename button label with your own with method buttonLabel(). eg.

RepeaterField::make('repeater')
    ->title('Repeater')
    ->layout(App\Http\Orchid\Layouts\Repeaters\RepeaterFields::class)
    ->buttonLabel('Add new repeater field')

In extreme cases, if you are using some kind of dynamic data loading and you need to pass additional data to your Layout, use the ->ajaxData() method. This method can work both with a callable function and with an array of data. This can be useful when you need to filter the data for each of the fields.

To use ajaxData, first connect trait AjaxDataAccess to your Layout:

<?php

namespace App\Orchid\Layouts;

use Nakukryskin\OrchidRepeaterField\Traits\AjaxDataAccess;
use Orchid\Screen\Layouts\Rows;
use Orchid\Screen\Fields\Input;
use Orchid\Screen\Fields\Select;

class RepeaterFields extends Rows
{
    use AjaxDataAccess;

    public function fields(): array
    {
        return [
            Select::make('select.')
                ->title('Select')
                ->multiple()
                ->options($this->getSelectOptions())
                ->required(),
        ];
    }
    
    protected function getSelectOptions() {
        return $this->getAjaxData()->get('select_options');
    }
}

After that, on the main screen, determine what you want to transmit. In the example, we generate a list based on the current user role:

Repeater::make('repeater')
      ->title('Repeater')
      ->layout(\App\Orchid\Layouts\RepeaterFields::class)
      ->ajaxData(function () {
          $data = [
              'select_options' => [
                  'default' => 'Default option',
              ],
          ];
   
          if (request()->user()->id === 1) {
              $data['select_options']['only_first'] = 'Option only for user with id #1';
          }
   
          return $data;
      }),

Dynamic ajax data with anonymous function

You can combine output options and what and when to output to the user in your repeater fields. Note that your Layout knows nothing about the state of the other fields on the current screen and, if you want to transfer data about the current fields you must first save the record and use the data and query of your main screen.

Repeater::make('repeater')
         ->title('Repeater')
         ->layout(\App\Orchid\Layouts\RepeaterFields::class)
         ->ajaxData([
             'select_options' => [
                 'default' => $this->query()['name'] ?? 'Default Name',
             ],
         ]),

Using other field from query to

orchid-repeater-field's People

Contributors

nks avatar psalador avatar leshkens avatar shishx86 avatar dependabot[bot] avatar mavsan avatar bistory avatar osbre avatar imitronov avatar russianprotein avatar stylecibot avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.