带有 max 属性的 sweetalert2 输入数字，错误放置？答案

【问题标题】：sweetalert2 input number with max attribute, error placement?带有 max 属性的 sweetalert2 输入数字，错误放置？
【发布时间】：2020-07-23 10:54:16
【问题描述】：

我有一个带有input: 'number' 和inputAttributes:{ min: 0, max: foo } 的sweetalert 模式。

问题是，如果输入的值大于允许值（例如 max:2 ，输入：3），我不知道如何放置错误位置

这是我的代码：

$(".addItem").on('click',function()
{
  var _this = $(this);
  Swal.fire({
    title :"add "+_this.data('title'),
    input : 'number',
    inputAttributes: {
       min: 0,
       max: _this.data('maximum')
    }
  });
});

在这种情况下，我在最大值为“1”的字段中输入“2”，然后在 sweetalert 模态按钮上方出现错误。我想知道如何放置错误位置？在preConfirm:function(value){...} 中使用Swal.showValidationError('bar') 对我不起作用。感谢您的帮助

【问题讨论】：

标签： javascript jquery sweetalert sweetalert2

【解决方案1】：

没关系，我解决了这个问题

inputValidator: (value) => {
              if (value > _this.data('maximum')) {
                return 'quantity should not exceed available stock! <small>stock :'+_this.data('maximum')+'</small>'
              }
            }

以上inputAttribute:{foo:bar}

【讨论】：

【解决方案2】：

您可以使用SweetAlert2

let { value: cantidad } = await Swal.fire({
    title: "Cantidad",
    html: "Cantidad máxima: " + cantidad_existencia + "<br>&nbsp;",
    input: "number",
    inputPlaceholder: 'Cantidad',
    inputValue: 1,
    inputAttributes: {
        min: 1,
        max: cantidad_existencia,
        step: 1,
        pattern: "[0-9]{10}"
    },
    inputValidator: (value) => {
        if (value > cantidad_existencia) {
            return 'La cantidad ingresada supera a la cantidad en inventario'
        }
        if (value < 0) {
            return 'La cantidad ingresada no tiene sentido'
        }
        if (value == 0) {
            return 'No ha especificado cuanto va a comprar'
        }
    },
    confirmButtonText: `Establecer`,
})

【讨论】：