Giter Site home page Giter Site logo

nova-inline-text's Introduction

Nova Inline Text

Version Total Downloads License

This package lets you edit text fields directly on your resources pages.

Installation

composer require pdmfc/nova-inline-text

Usage

use Pdmfc\NovaFields\InlineText;

//...

public function fields()
{
    return [
        InlineText::make('Name'),
    ];
}

Making it editable

By default, this field behaves like a regular text field. To be able to edit it on the index page, use the inlineOnIndex() method:

public function fields()
{
    return [
        InlineText::make('Name')
            ->inlineOnIndex(),
    ];
}

Basic usage

This method also accepts a closure with the current request if you want to make it editable dynamically:

public function fields()
{
    return [
        InlineText::make('Name')
            ->inlineOnIndex(function (NovaRequest $request) {
                return $request->user()->isAdmin();
            }),
    ];
}

Updating field value

The default trigger to save the value is by pressing the Enter key (keyup.enter). If you wish to use a different event trigger to update the value you can use the saveOn() method that accepts an argument corresponding to a javascript event:

public function fields()
{
    return [
        InlineText::make('Name')
            ->inlineOnIndex()
            ->saveOn('blur'),
    ];
}

Key event modifiers

You can also specify the key event modifier:

public function fields()
{
    return [
        InlineText::make('Name')
            ->inlineOnIndex()
            ->saveOn('keyup.shift'),
    ];
}

Refreshing resource table

When saving the current field value, it will not refresh the table. If you need this functionality, use the refreshOnSaving() method:

public function fields()
{
    return [
        InlineText::make('Name')
            ->inlineOnIndex()
            ->refreshOnSaving(),
    ];
}

โš ๏ธ Caveats

  • When updating the field, make sure you add the sometimes validation rule to the rest of the fields that are required:

    Text::make('Email')
        ->rules('required', 'email')
        ->updateRules('sometimes') // Add these method call and validation rule to the fields that are required

How to contribute

  • clone the repo
  • on composer.json of a laravel nova application add the following:
{
    //...

    "require" {
        "pdmfc/nova-inline-text: "*"
    },

    //...
    "repositories": [
        {
            "type": "path",
            "url": "../path_to_your_package_folder"
        }
    ],
}
  • run composer update pdmfc/nova-inline-text

You're now ready to start contributing!

nova-inline-text's People

Contributors

skoyah avatar joaopaulolndev 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.