Блог

Главная - Вопросы по программированию - Kendo UI запрашивает только 1 кнопку

Kendo UI запрашивает только 1 кнопку

#kendo-ui #kendo-grid

#kendo-ui #kendo-grid

Вопрос:

Приветствую всех,

Я использую подсказку KENDO UI.

  1. Я хочу переименовать «OK» в «РАЗБЛОКИРОВАТЬ«
  2. Я хочу удалить кнопку «Отмена«, поэтому в этом приглашении доступна только 1 кнопка. Это возможно сделать? Если нет, есть ли какой-либо вариант в моей ситуации, подобной этой?

 $("#promptBtn").on("click", function () {
  window.myprompt("Please enter password!").then(function (data) {
    window.location.pathname = "unlock.php";
  })
});


function myprompt(content, defaultValue){
  return $("<div></div>").kendoPrompt({
    title: "Lock Session",
    content: content
  }).data("kendoPrompt").open().result;
}  
 <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.rtl.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.silver.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.mobile.all.min.css"/>

    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script>
</head>
<body>
  
<button id="promptBtn" class="k-button">myprompt</button>

</body>
</html>

Комментарии:

1. Вы могли бы создать свой собственный диалог ( docs. telerik.com/kendo-ui/api/javascript/ui/dialog ) с элементом ввода в теле и только одной кнопкой.

Ответ №1:

Ну, я думаю, это не может этого сделать, поэтому мне нужно использовать kendoWindow для этого! 

 var lockScreen = $("#lockScreen");
lockScreen.kendoWindow({
  visible: false,
  width: "200px",
  height: "130px",
  actions: [],
  modal: true,
  title: "LOCKED!"
});
$("#menuLock").click(function() {
    lockScreen.data("kendoWindow").center().open();
});   
  *{font-size:11px;	font-family:Arial;}  
 <!DOCTYPE html>
<html>
<head>
    <base href="https://demos.telerik.com/kendo-ui/window/constrain-movement">
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css" />
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.silver.min.css" />
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.silver.mobile.min.css" />

    <script src="https://kendo.cdn.telerik.com/2019.1.220/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script>
</head>
<body>
  


<button id="menuLock" >KENDO WINDOW</button>

  
<div id="lockScreen">
  <form action="#" method="POST">
  <p>Please enter your password!</p>
  <input id="" type="password" class="k-textbox" name="password" style="width: 180px;" />
  <button class="k-button k-primary" style="width:100%; position:absolute; bottom:0; right:0; padding: 15px 25px;">Unlock</button>	
	<span id="notification" style="display:none;" ></span>
  </form>
</div> 
  


</body>
</html>

Комментарии:

1. Вы также можете использовать KendoDialog для этого.