Skip to content

KornaNova/nova-masked-field

 
 

Repository files navigation

Laravel Nova Masked Field

Installation

composer require greg0x46/masked-field

Basic Usage

To use the Laravel Nova Masked Field, follow these steps:

  1. Import the MaskedField class in your Nova resource file:
use Greg0x46\MaskedField\MaskedField;
  1. Add the MaskedField to the fields method of your resource file:
public function fields(Request $request)
{
    return [
        MaskedField::make('Phone')
            ->mask('(###) ###-####'),
    ];
}
  1. Optional - Save Value Without Mask
    If you want to store the raw (unmasked) value in the database, use the raw() method:
MaskedField::make('Phone')
    ->mask('(###) ###-####')
    ->raw(),

masked-field-demo

Usage with dependsOn

You can also use the dependsOn method to set a conditional mask based on the value of another field. Here's an example:

use Greg0x46\MaskedField\MaskedField;

public function fields(Request $request)
{
    return [
        MaskedField::make('Phone', 'phone')
            ->mask('(###) ###-####')
            ->dependsOn(['country'], function (MaskedField $field, NovaRequest $request, FormData $formData) {
                if($formData->country == 'BR')
                    $field->mask('(##) ####-####');
            })
    ];
}

Mask syntax

The Laravel Nova Masked Field uses a mask syntax to define patterns for input formatting. Here are the default tokens available:

{
    '#': { pattern: /[0-9]/ },
    'X': { pattern: /[0-9a-zA-Z]/ },
    'S': { pattern: /[a-zA-Z]/ },
    'A': { pattern: /[a-zA-Z]/, uppercase: true },
    'a': { pattern: /[a-zA-Z]/, lowercase: true },
    '!': { escape: true },
    '*': { repeat: true }
}

You can refer to the beholdr/maska repository for more information on the mask syntax.

References

Notice Regarding Nova License

Hey everyone,

My Nova license expired in November 2023 for version v4.29.2, which is the last version I have access to. Currently, I don't have plans to renew it, so unfortunately, I won't be able to assist with issues related to updates or newer Nova features. Feel free to seek alternative support or solutions with other users or maintainers.

Thank you for your understanding.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 42.4%
  • PHP 30.0%
  • JavaScript 27.2%
  • CSS 0.4%