【问题标题】:Refreshing JSON input in Select Box after Resolve / Promise in Sweet Alert 2在 Sweet Alert 2 中 Resolve / Promise 后刷新 Select Box 中的 JSON 输入
【发布时间】:2019-12-03 06:58:52
【问题描述】:

我有一个甜蜜的警报 2 选择由外部 JSON 文件填充的输入框

var inputOptionsPromise = new Promise(function(resolve) {
    setTimeout(function() {
        $.getJSON("http://localhost/so/categories.json", function(data) {
            resolve(data)
        });
    }, 500)
})

此 JSON 文件包含一个可以选择的类别列表,或 "Add Category +" 键值对的最后一个选项

title: 'Select Category',
input: 'select',
inputClass: 'swal-select-category',
inputPlaceholder: 'Please Select',
inputOptions: inputOptionsPromise,
inputValidator: (value) => {
    return new Promise((resolve) => {
        if (value === '') {
            resolve('You need to input a category!');
        } else if (value === 'Add Category +') {
            alertify.prompt('Category Name', '', function(evt, value) {
                $.ajax({
                    type: "POST",
                    async: false,
                    url: 'http://localhost/sa/resources/scripts/addcategory.php',
                    data: {
                        data: value
                    },
                    success: function() {
                        alertify.success('Category ' + value + ' Added.');
                        resolve(value + ' Category Added');
                    },
                    failure: function() {
                        alert("Error Adding Category!");
                        resolve('Error!');
                    }
                });
            }, function() {
                resolve('You need to input a category!');
            });
        } else {
            resolve()
        }
    })
}

如您所见,如果用户选择了选择选项Add Category +,这是一个弹出输入框,它对 PHP 页面执行 AJAX 请求以将任何输入(新类别)附加到此 JSON 文件。

这按预期工作,用户可以在 JSON 文件中选择预先存在的类别,也可以使用上述选项将类别添加到 JSON 文件。

然而,在完成所有这些工作之后,不幸的是,在这种情况下,一旦将新类别附加到 JSON 文件,输入框/JSON 就不会刷新。

如果用户刷新页面,或再次退出甜蜜警报 2 队列,它会重新加载 JSON 并显示输入的新类别 - 但不会在用户期望选择他的甜蜜警报 2 现有对话框中或她所在的类别。

是否可以刷新我的inputOptionsPromise var 以在 inputValidator 或 Resolve 中获取新的 JSON 值?

我已在甜蜜警报 2 中添加了一个自定义类...我必须使用一些 hack-ish jquery 解决方案来刷新选择选项,还是有更好的方法在进入和退出时获取刷新的 JSON 数据承诺/解决?

【问题讨论】:

  • 通常不会期望验证器做任何比验证更多的事情。
  • 叹息我现在明白了。在某种程度上,它正在验证正确的类别输入——具有能够添加自定义类别的附加功能——至少这是我的思考过程。现在我正试图向后工作,我想:P

标签: javascript jquery json promise sweetalert2


【解决方案1】:

我刚刚添加了这段 jQuery 来插入选项值作为第二个选择选项。工作正常,不需要 json 刷新。可能会更好。

$('.swal2-select option:first').after($('<option />', { 'value': value, text: value }));
$('.swal2-select option[value="' + value + '"]').attr('selected','selected');

$.ajax
    ({
        type: "POST",
        async: false,
        url: 'http://localhost/sa/resources/scripts/addcategory.php',
        data: { data: value },
        success: function () {                
          alertify.success('Category ' + value + ' Added.');
        $('.swal2-select option:first').after($('<option />', { 'value': value, text: value }));
        $('.swal2-select option[value="' + value + '"]').attr('selected','selected');
          resolve(value + ' Category Added');
        },
        failure: function() {
          alert("Error Adding Category!");
          resolve('Error!');
        }
    });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-06-18
    • 1970-01-01
    • 2018-12-04
    相关资源
    最近更新 更多