Jquery Validate with Jquery-Price-Format

Question

Jquery Validate with Jquery-Price-Format

Navigation

#1 by (1 votes)

1

How to leave the field mandatory when the value is 0.00 using jquery validate?

Here is an example image:

Asyoucanseetheimageabove,thepersondidnotenterthevalue,whenclickingtheacceptbutton,jqueryvalidatenormallyworksthefollowingimage:

Nowtheproblemiswhenyouentervalue0.00.Hereistheimage:

Asyoucanseetheimageabove,thevaluecannotbe0.00,itmustbeatleast0,01.

Followthecodebelow:

Html:

<formid="myform">
<input type="text" class="form-control" value="@Model.Valor" id="valor" name="valor" placeholder="Digite o seu valor">
</form>

Javascript :

$('#valor').priceFormat({
    prefix: 'R$ ',
    centsSeparator: ',',
    thousandsSeparator: '.'
});

Jquery Validate :

$(document).ready(function () {

        $("#myform").validate({
            ignore: ":hidden",
            rules: {
                valor: { required: true }
            },
            messages: {
                valor: "<span style=\"color: #a94442;\">Campo Valor é obrigatório *</span>"
            },
            highlight: function (element) {
                $(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function (element) {
                $(element).closest('.form-group').removeClass('has-error');
            },
            submitHandler: function (form) { etc ....}

I use Jquery-Price-Format . When entering value 0.00, jquery should show warning. When it is 0,01 take the jquery validate warning. That is, if it equals 0.00, show red warning. Any solution?

javascript html5 jquery-validate

asked by anonymous 24.01.2017 / 21:14

1 answer

Define a session variable by clicking on a link Failed to install .deb on Ubuntu [closed]

score 1 · Accepted Answer

You should create a custom validation for this particular type and remove the prefix so that only the value for the test remains, for example:

jQuery.validator.addMethod("valuethanmorezero", function(value, element) {
      var valor = value.replace(".",",").replace(",",".");
      return this.optional(element) || (parseFloat(valor) >= 0.01);
}, "Valor tem que maior que 0,01");

Now you can pass the same validation as a full example:

$(function() {
  $('#valor').priceFormat({
    prefix: '',
    centsSeparator: ',',
    thousandsSeparator: '.'
  });
  
  jQuery.validator.addMethod("valuethanmorezero", function(value, element) {
      var valor = value.replace(".",",").replace(",",".");
      return this.optional(element) || (parseFloat(valor) >= 0.01);
  }, "Valor tem que maior que 0,01");
  
  $("#myform").validate({
    ignore: ":hidden",
    rules: {
      valor: {
        required: true,
        valuethanmorezero: true
      }
    },
    messages: {
      valor: { 
      	required: "<span style=\"color: #a94442;\">Campo Valor é obrigatório *</span>",
        valuethanmorezero:"<span style=\"color: #a94442;\">Valor tem que maior que 0,01*</span>"
      }
    },
    highlight: function(element) {
      $(element).closest('.form-group').addClass('has-error');
    },
    unhighlight: function(element) {
      $(element).closest('.form-group').removeClass('has-error');
    },
    submitHandler: function(form) {}
  })

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/additional-methods.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery-price-format/2.1/jquery.priceformat.min.js"></script>

<form id="myform">
  <input type="text" class="form-control" value="0" id="valor" name="valor" placeholder="Digite o seu valor">
  <button>Enviar</button>
</form>

References