Download the PHP package andr-04/jquery.inputmask-multi without Composer

On this page you can find all versions of the php package andr-04/jquery.inputmask-multi. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.

FAQ

After the download, you have to make one include require_once('vendor/autoload.php');. After that you have to import the classes with use statements.

Example:
If you use only one package a project is not needed. But if you use more then one package, without a project it is not possible to import the classes with use statements.

In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
Some PHP packages are not free to download and because of that hosted in private repositories. In this case some credentials are needed to access such packages. Please use the auth.json textarea to insert credentials, if a package is coming from a private repository. You can look here for more information.

  • Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
  • To use Composer is sometimes complicated. Especially for beginners.
  • Composer needs much resources. Sometimes they are not available on a simple webspace.
  • If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
  • Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Please rate this library. Is it a good library?

Informations about the package jquery.inputmask-multi

=============== Inputmask Multi

This plugin has developed for jQuery and allows to select a mask of input basing on the beginning of entered phone number. This technique allows to decrease errors on typing a phone number and make it more simple. Moreover this plugin can be used in other fields where rules of input can be presented as multiple masks of input.

Introduсtion

It’s very often web sites require to enter a phone number. In our days every country has their own rules for dialing and lengths of numbers. As a result people from different countries confused about giving their numbers each other: one of them give a number started from a figure 8, another one - from 0 and third - from +.

Review of existing solutions

To solve the problem described above and unify a format of phone numbers 3 main solutions are available:

  1. Suggest to enter a phone number using a mask of input. Advantage: A demonstrative display of a phone number decreases errors on typing. Disadvantage: every country has their own rules of writing a phone number and it has a different length.

  2. Suggest to select a country and type a remaining part of a phone number; it’s also possible to use a mask of input for a remaining part of a phone number. Advantage: possibility to use a different mask of input for every country (and every region inside a country). Disadvantages: a list of countries (and regions inside every country) can be large; a number becomes separated into 2 parts (an additional pre-processing before saving and displaying a phone number is required).

  3. Add a figure + before a phone number (outside of an input) and allow to type only digits. Advantage: it’s simple to make. Disadvantage: a demonstrative display of a phone number is absent.

The solution

As a result was decided to improve a usual mask of input to change it depending on a phone number which has typed. Moreover is suggested to show the name of a country (a region) which is determined while a phone number is typing. Subjectively, this approach has to solve all problems which is described above.

Taking into account the number of countries in the world it was decided to collect a list of masks of input for all countries. As a source of rules of phone numbering was used the information which is published on the web site of International Telecommunication Union.

A collecting process of this information was confused. It was important to take into account all possible cases of phone numbers including differences inside every country. Because of a large amount of information which had processed by hand it is possible that collected data contains inaccuracies. It is planned to apply fixes into this one over time.

The implementation

As a core was used the implementation of jquery.inputmask. This plugin continues to develop and was designed to make it possible to write extensions for it. But in this task it was impossible to write an extension. I have decided not to involve or rewrite a source code of the core to avoid any conflicts during applying my patches into the source project because of it continues to develop. Therefore I had to write a superstructure of the core to monitor (and to interrupt) external events to change the data. To embed a handler of external events before the core was used a plugin jquery.bind-first.

Sorting masks of input which are allowed

To select a mask of input which matches to a phone number more than others a list of all possible masks has to be sorted in a special way. During a thinking of rules were accepted the following definitions:

  1. All symbols in a mask were segmented into 2 types: significant symbols (in my case it is the symbol # which matches any digit, and digits 0-9) and symbols-decorators (all others).

  2. Another segmentation of symbols in a mask of input is templated symbols (in my case it is a symbol #) and others.

As a result the following rules of sorting in the order of applying were written:

  1. When comparing 2 masks of input per symbols only significant symbols (not decorators) is taken into account.

  2. Different templated symbols are taken as equivalents, another significant symbols are compared based on their codes.

  3. Non-templated symbols are always less than templated one and they located above in a result.

  4. The shorter a length of significant characters in a mask of input, the mask of input is smaller and is located above in a result.

Searching a mask of input which is matched

When comparing the input text with every mask of input in the sorted list only significant symbols are taken into account in the mask of input. If the text longer than the mask of input despite all previous symbols of the mask of input are matched, this mask is not matched. In case the input text is matched for multiple masks only first of them is returned. After that all significant symbols (including non-templated) in the mask which was found is replaced by templated one which is combines all symbols which are allowed by any templated symbol.

Processing and handling of events

To avoid any conflicts with handlers of the core the following events is interrupted:

All events is handled in the space inputmask. It allows to avoid wrong actions on calling the inputmask method after initializing this plugin (because the initialization of the core cancels another handlers in the space inputmask).

The sample of using

The format of a list of masks

A list of masks is a Javascript array of objects with equal (or similar) set of properties. At least a property which is contains a mask of input must be available for all objects in array. The name of this property can be vary. The fragment of a list of masks is shown below:

[
…
    { "mask": "+7(###)###-##-##", "cc": "RU", "name_en": "Russia", "desc_en": "", "name_ru": "Россия", "desc_ru": "" },
    { "mask": "+250(###)###-###", "cc": "RW", "name_en": "Rwanda", "desc_en": "", "name_ru": "Руанда", "desc_ru": "" },
    { "mask": "+966-5-####-####", "cc": "SA", "name_en": "Saudi Arabia ", "desc_en": "mobile", "name_ru": "Саудовская Аравия ", "desc_ru": "мобильные" },
    { "mask": "+966-#-###-####", "cc": "SA", "name_en": "Saudi Arabia", "desc_en": "", "name_ru": "Саудовская Аравия", "desc_ru": "" },
…
]

Parameters of connection of the plugin

Before using the plugin is required to sort a list of masks. It can be done by call the following function:

$.masksSort = function(maskList, defs, match, key)

On plugin initialization is transferred an object which is sets its work. This object contains the following set of parameters:

To initialize the plugin is required to call inputmasks for an input field: $.fn.inputmasks = function(maskOpts, mode)

The sample of using the plugin

<input type="text" id="customer_phone" value="7" size="25"><br>
<input type="checkbox" id="phone_mask" checked>
<label id="descr" for="phone_mask">Маска ввода</label>
<script>
    var maskList = $.masksSort($.masksLoad("phone-codes.json"), ['#'], /[0-9]|#/, "mask");
    var maskOpts = {
        inputmask: {
            definitions: {
                '#': {
                    validator: "[0-9]",
                    cardinality: 1
                }
            },
            //clearIncomplete: true,
            showMaskOnHover: false,
            autoUnmask: true
        },
        match: /[0-9]/,
        replace: '#',
        list: maskList,
        listKey: "mask",
        onMaskChange: function(maskObj, completed) {
            if (completed) {
                var hint = maskObj.name_ru;
                if (maskObj.desc_ru && maskObj.desc_ru != "") {
                    hint += " (" + maskObj.desc_ru + ")";
                }
                $("#descr").html(hint);
            } else {
                $("#descr").html("Маска ввода");
            }
            $(this).attr("placeholder", $(this).inputmask("getemptymask"));
        }
    };

    $('#phone_mask').change(function() {
        if ($('#phone_mask').is(':checked')) {
            $('#customer_phone').inputmasks(maskOpts);
        } else {
            $('#customer_phone').inputmask("+[####################]", maskOpts.inputmask)
            .attr("placeholder", $('#customer_phone').inputmask("getemptymask"));
            $("#descr").html("Маска ввода");
        }
    });

    $('#phone_mask').change();
</script>

The demonstration

The demonstration of this plugin is available on the page of the project.


All versions of jquery.inputmask-multi with dependencies

PHP Build Version
Package Version
No informations.
Composer command for our command line client (download client) This client runs in each environment. You don't need a specific PHP version etc. The first 20 API calls are free. Standard composer command

The package andr-04/jquery.inputmask-multi contains the following files

Loading the files please wait ....