两次调用jQuery Dialog

时间:2016-04-12 12:05:52

标签: javascript jquery jquery-ui

我有两个功能:myFunc1myFunc2。调用myFunc1时,会显示jQuery confirmation Dialog。当用户单击“是”时,将调用myFunc2,这将显示另一个对话框 但是,尽管成功调用了myFunc2,但第二个对话框永远不会出现。

Here is a fiddle

function myFunc1() {
  dialog().then(function(data) {
    if (data == "yes") {
      console.log("clicked yes: show another dialog")
      myFunc2();
    } else {
      console.log("clicked no")
    }
  });
}

function myFunc2() {
  dialog();
  console.log("myFunc2 is called")
}

function dialog(title) {
  var def = $.Deferred();
  $("#dialog").dialog({
    modal: true,
    buttons: {
      "Yes": function() {
        def.resolve("yes");
        $(this).dialog("close");
      },
      "No": function() {
        def.resolve("no");
        $(this).dialog("close");
      }
    }
  });
  return def.promise();
}

$("button").on("click", myFunc1);

2 个答案:

答案 0 :(得分:4)

在实际关闭第一个对话框之前,您正在解析Deffered-Object。因此,当点击then() - 回调时,对话框仍然打开,因此不会创建新的。

只需交换功能就可以了。

"Yes": function() {
    $(this).dialog("close");
    def.resolve("yes");           
},

Example

  

解析Deferred后,将调用deferred.then()或deferred.done()添加的所有doneCallback。回调按照添加顺序执行

.resolve()

答案 1 :(得分:0)

如果您需要同时打开多个对话框,那么您将使用相同的div创建所有对话框,这将是一个问题。

 private void initializeChart(LineChart chart) {
    // Chart view
    chart.setDrawGridBackground(false);
    chart.setDescription("");
    chart.getLegend().setEnabled(true);
    chart.setTouchEnabled(false);
    int color = getResources().getColor(R.color.white);
    chart.getAxisLeft().setTextColor(color); // left y-axis
    chart.getXAxis().setTextColor(color);
    //X axis
    XAxis xAxis = chart.getXAxis();
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setDrawGridLines(false);
    xAxis.setDrawLabels(true);

    //Y axis
    YAxis leftAxis = chart.getAxisLeft();
    YAxis rightAxis = chart.getAxisRight();
    rightAxis.setDrawLabels(false);
    rightAxis.setDrawGridLines(false);
    leftAxis.setDrawLabels(true);
    leftAxis.setDrawGridLines(false);
    ChartItem item = CannonJsonParser.parseCanonJson(act, act.res);

    setLineData(10, 20, item);
    // set data
    chart.setData(lineData);
    chart.getLegend().setEnabled(false);
    //animate
    // chart.animateX(2000, Easing.EasingOption.EaseInOutQuart);
    chart.setDragEnabled(true);
    chart.setTouchEnabled(true);
    chart.setScaleXEnabled(true);
    chart.setScaleYEnabled(false);
    chart.setHighlightPerDragEnabled(false);
    chart.setHighlightPerTapEnabled(false);
}

此外,

// Get a random unique number to use as the dialog id
var guid = Math.floor(Math.random() * 9999999999999) + 1;
// Clone the dialog div and give it a new name
$("#dialog").clone()[0].id = guid;
// Create the dialog with the new unique div
$("#"+guid).dialog({...});