Confirmation message YES / NO

3

As a PO request, using an attribute to copy the cell number to the whatsapp field, displaying a message to the user, default is OK and Cancelar , but I would like the button names to be Sim and Não , how can I change this message? Note: Everything is working, but as a PO requirement the message should be Yes and No.

Thisisthecodeused:

$('#Whatsapp').focus(function(){varcelular=$('#Celular').val();varwhatsapp=$(Whatsapp).val();celular=celular.replace(/[\-_()]/g,"");//Remove special characters
        whatsapp = whatsapp.replace(/[\-_()]/g, "");//Remove special characters
        if (celular.length == 11) {
            if (whatsapp.length != 11) {
                if (confirm("O numero do celular também é o número do Whatsapp?") == true) {
                    $('#Whatsapp').val($('#Celular').val());
                } else {
                    $('#Whatsapp').val('');
                }
            }
        }
    });

Edited from here down

I tried to use this too, but I did not succeed (Dialog did not open):

    $('#Whatsapp').focus(function () {
        var celular = $('#Celular').val();
        var whatsapp = $(Whatsapp).val();
        celular = celular.replace(/[\-_()]/g, "");//Remove special characters
        whatsapp = whatsapp.replace(/[\-_()]/g, "");//Remove special characters
        if (celular.length == 11) {
            if (whatsapp.length != 11) {
                var mensagem = "O numero do celular também é o número do Whatsapp?";
                mensagem.dialog({
                    modal: true,
                    buttons: {
                        "Sim": function () {
                            $('#Whatsapp').val($('#Celular').val());
                            $(this).dialog('close');
                        },
                        "Não": function () {
                            return false;
                            $('#Whatsapp').val('');
                            $(this).dialog('close');
                        }
                    }
                });
                //if (confirm() == true) {
                //    $('#Whatsapp').val($('#Celular').val());
                //} else {
                //    $('#Whatsapp').val('');
                //}
            }
        }
    });
    
asked by anonymous 22.01.2017 / 18:01

1 answer

2

There is no way to change, customize this so it can be implemented with several plugins :

Jquery.ui

$(function() {
  $("#whats").focus(function() {
    $("#dialog-confirm").dialog({
      resizable: true,
      modal: false,
      buttons: {
        "Sim": function() {
          $("#whats").val($("#celular").val());
          $(this).dialog("close");          
        },
        "Não": function() {
          $(this).dialog("close");          
        }
      }
    });
  });
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.structure.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script><linkhref="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.theme.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script><linkhref="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet" />

<form>
  <div>
    <label>Celular:
      <input type="text" name="celular" id="celular" />
    </label>
  </div>
  <br>
  <div>
    <label>Whats:
      <input type="text" name="whats" id="whats" />
    </label>
  </div>
</form>

<div id="dialog-confirm" title="Mensagem">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>O numero do celular também é o número do Whatsapp?</p>
</div>

Bootstrap

$(function() {
  $("#whats").focus(function() {
    $('#myModal').modal('show');
  });
  $("#btnSim").click(function() {
    $("#whats").val($("#celular").val());
    $('#myModal').modal('hide');
  });
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

<form>
  <div>
    <label>Celular:
      <input type="text" class="form-control" name="celular" id="celular" />
    </label>
  </div>
  <br>
  <div>
    <label>Whats:
      <input type="text" class="form-control" name="whats" id="whats" />
    </label>
  </div>
</form>

<div id="myModal" class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">Mensagem?</h4>
      </div>
      <div class="modal-body">
        <p>O numero do celular também é o número do Whatsapp?</p>
      </div>
      <div class="modal-footer">
        <button type="button" id="btnSim" class="btn btn-primary">Sim</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">Não</button>
      </div>
    </div>
  </div>
</div>
    
24.01.2017 / 00:26