Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add comma separation with numpad #467

Closed
nimadir opened this issue Jun 11, 2016 · 2 comments
Closed

Add comma separation with numpad #467

nimadir opened this issue Jun 11, 2016 · 2 comments

Comments

@nimadir
Copy link

nimadir commented Jun 11, 2016

I want to add comma separation for (Use 1000 Separation) to this library for num keyboard. How I can do this?

thanks

@Mottie
Copy link
Owner

Mottie commented Jun 11, 2016

Hi @nimadir!

Well, you have two choices:

  1. Add a custom layout with a comma. In this example, I replaced the "Accept" button with a comma and made the keyboard autoAccept any values (demo).

    $(function() {
      $.keyboard.layouts.numpad = {
          'normal': [
            '= ( ) {b}',
            '{clear} / * -',
            '7 8 9 +',
            '4 5 6 {sign}',
            '1 2 3 %',
            '0 {dec} , {c}'
          ]
        }
      $('#keyboard').keyboard({
          layout: 'numpad',
          autoAccept: true,
        })
        .addTyping({
          showTyping: true,
          delay: 250
        });
    });
  2. You can add a change callback that will automatically format the value with commas (demo):

    $(function() {
      $.keyboard.layouts.numpad = {
        'normal': [
          '= ( ) {b}',
          '{clear} / * -',
          '7 8 9 +',
          '4 5 6 {sign}',
          '1 2 3 %',
          '0 {dec} {a} {c}'
        ]
      };
      $('#keyboard').keyboard({
          layout: 'numpad',
          change: function(e, kb) {
            // code modified from http://stackoverflow.com/a/2901298/145346
            var diff,
              $el = kb.$preview,
              caret = $.keyboard.caret($el),
              parts = $el.val().toString().split('.'),
              len = parts[0].length;
            parts[0] = parts[0].replace(/,/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',');
            $el.val(parts.join('.'));
            // re-align caret
            diff = parts[0].length - len;
            caret.start += diff;
            caret.end += diff;
            $.keyboard.caret($el, caret);
          }
        })
        .addTyping({
          showTyping: true,
          delay: 250
        });
    });

@Mottie
Copy link
Owner

Mottie commented Jul 30, 2016

I'm guessing this issue has been resolved, so I'm going to close it. If you continue to have problems, please feel free to continue the discussion in this thread.

@Mottie Mottie closed this as completed Jul 30, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants