使用SweetAlert2与vis.js

为了使项目在vis.js编辑，它使用回调这是好与SweetAlert 使用SweetAlert2与vis.js

我想用SweetAlert2利用其新的功能，但它是用承诺来代替回调可见。 js使用回调！

这里是http://visjs.org/examples/timeline/editing/editingItemsCallbacks.html所采取的示例代码：

线47至57和129行至137，其中vis.js呼吁SweetAlert的提示：

onAdd: function (item, callback) { 
     prettyPrompt('Add item', 'Enter text content for new item:', item.content, function (value) { 
     if (value) { 
      item.content = value; 
      callback(item); // send back adjusted new item 
     } 
     else { 
      callback(null); // cancel item creation 
     } 
     }); 
    }, 

function prettyPrompt(title, text, inputValue, callback) { 
    swal({ 
     title: title, 
     text: text, 
     type: 'input', 
     showCancelButton: true, 
     inputValue: inputValue 
    }, callback); 
    }

那么如何修改此使用SweetAlert2？

来源

2017-07-20 Rami Sedhom

在这里你去：

var items = new vis.DataSet([ 
 
    {id: 1, content: 'item 1', start: new Date(2013, 3, 20)} 
 
]); 
 

 
var min = new Date(2013, 3, 1); // 1 april 
 
var max = new Date(2013, 3, 30, 23, 59, 59); // 30 april 
 

 
var container = document.getElementById('visualization'); 
 
var options = { 
 
    editable: true, 
 

 
    onAdd: function (item, callback) { 
 
    swal({ 
 
     title: 'Add item', 
 
     text: 'Enter text content for new item:', 
 
     input: 'text', 
 
     inputValue: item.content 
 
    }).then(function(result) { 
 
     if (result.value) { 
 
     item.content = result.value; 
 
     callback(item); // send back adjusted new item 
 
     } 
 
    }); 
 
    } 
 
}; 
 
var timeline = new vis.Timeline(container, items, options);

<link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.1/vis.css" rel="stylesheet"> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.1/vis.js"></script> 
 

 
<script src="https://unpkg.com/[email protected]/dist/sweetalert2.all.js"></script> 
 

 
<div id="visualization"></div>

来源

2017-07-21 13:37:55

使用SweetAlert2与vis.js

回答

相关问题