dynamically adding phone numbers to the modal and applying input masks to all of them

54 Views Asked by At

How can I make a phone number an input mask dynamically? How can I set the plus button for phone numbers to always be at the end? How can I delete phone numbers? How can I send phone numbers to office-not-actions.php as many as there are? I want users to be able to enter their phone number and the newly opened phone number to be opened dynamically with an input mask. I also want to delete it dynamically. I'm using MongoDB.

. . .

 <div class="form-group">
                        <label for="tel">Phones</label>
                        <div class="input-group">
                            <input type="text" class="form-control pMask" placeholder="Phone" id="tel" name="tel">
                            <button type="button" id="phoneAdd" class="btn btn-primary">+</button>
                        </div>
                    </div>
$(document).ready(function() {
   var telCounter = 1;
         $(document).off('click', '#phoneAdd').on('click', '#phoneAdd', function() {
                telCounter++;
                var newInput = $("<input>", {
                    type: "text",
                    class: "form-control pMask",
                    placeholder: "Phone",
                    id: "tel" + telCounter,
                    name: "tel" + telCounter
                });
                $(".input-group").append(newInput);
            });


         $(".pMask").inputmask({"mask": "0999 999 99 99","clearIncomplete": true});

  function save() {

          .
          .
          .
          var tel = $('#tel').val();

          $.post(
              'partials/actions.php',
              {
                  "_": $.now(),
                  "action": "saveOffice",
                 .
                 .
                 .
                  "tel": tel
              },
          function (data) {
            if (data=="Succes") {

              $('#createModal').modal('hide');
              userdatatable.ajax.reload();

            }
            else {
              alert("Failure");
            }
          }
          );
        }

. . .

0

There are 0 best solutions below