Question

我有用于确认弹出窗口的jquery UI代码。

if (confirm('Are you sure you want to delete the batchjob:' + 
 dataItem["Name"])) {
            $.get("@Url.Content("~/BatchJob/DeleteBatchJob")", { batchJobDetailId: parseInt(dataItem["BatchJobDetailId"]) }, function (data) {
                if (data) {
                    debugger
                   var batchJobValidateWnd = $("#ValidateBatchJobStatus").data("kendoWindow");
                    batchJobValidateWnd.content("BatchJob deleted successfully.");
                    batchJobValidateWnd.center().open();
                    $.post("@Url.Content("~/BatchJob/SearchBatchJobDetailByParams")", { jobName: $("#Name").val(), startDate: $("#ScheduleStartDate").val() }, function (data) {

                    });
                }
                else {
                    debugger
                    window.location = '@Url.Content("~/BatchJob/Create")/' + parseInt(dataItem["BatchJobDetailId"]);
                }
            });
        }

我需要Kendo Confirmation弹出窗口吗？我如何更改jquery确认弹出窗口确认弹出窗口确认弹出窗口

Answer 1

您可以通过承诺创建一个Kendo确认对话框，如果确认，则执行与jQuery对话框相同的方式。

应使用在buttonDisplayDialog click事件上呈现的External Template创建对话框本身，该事件将在继续之前等待响应。

<script id="confirmationTemplate" type="text/x-kendo-template">

<div class="popupMessage"></div>
  </br>
<hr/>
<div class="dialog_buttons">
    <input type="button" class="confirm_yes k-button" value="Yes" style="width: 70px" />
    &nbsp;
    <input type="button" class="confirm_no k-button" value="No" style="width: 70px" />
  </div>

</script>

根据用户点击“是”或“否”，将result作为true或false值返回，您应将其余代码放在此处：< / p>

$("#buttonDisplayDialog").kendoButton({
      click: function(e) {
        $.when(showConfirmationWindow('Are you sure you want to delete the batchjob:')).then(function(confirmed){

          if(confirmed){
            alert('This is where you will put confirmation code');
          }
          else{
            alert('User clicked no');
          }
        });
      }      
    });
  });

function showConfirmationWindow(message) {
    return showWindow('#confirmationTemplate', message)
  };

  function showWindow(template, message) {

    var dfd = new jQuery.Deferred();
    var result = false;

    $("<div id='popupWindow'></div>")
    .appendTo("body")
    .kendoWindow({
      width: "200px",
      modal: true,
      title: "",
      modal: true,
      visible: false,
      close: function (e) {
        this.destroy();
        dfd.resolve(result);
      }
    }).data('kendoWindow').content($(template).html()).center().open();

    $('.popupMessage').html(message);

    $('#popupWindow .confirm_yes').val('OK');
    $('#popupWindow .confirm_no').val('Cancel');

    $('#popupWindow .confirm_no').click(function () {
      $('#popupWindow').data('kendoWindow').close();
    });

    $('#popupWindow .confirm_yes').click(function () {
      result = true;
      $('#popupWindow').data('kendoWindow').close();
    });

    return dfd.promise();
  };

这是一个Dojo example来演示上面的代码。

如何在kendo UI中创建确认弹出窗口？

1 个答案: