我不能把剑道下拉列表只读

如何解决我不能把剑道下拉列表只读

我有一个 kendoDropDownList 但我不能把它只读，我尝试了所有这些：

$("#PreguntaPA008").kendoComboBox();
var comboBox = $("#PreguntaPA008").data("kendoComboBox");
comboBox.readonly(true);

var dataSource = $("#PreguntaPA008").data("kendoDropDownList");
dataSource.readonly();
var dataSource = $("#PreguntaPA008").data("kendoDropDownList").attr('readonly',true);

$("#PreguntaPA008").readonly(true);

$("#PreguntaPA008").attr("disabled","disabled");

var siglaPregunta = "PA008";
const query = aplicaraComplemento ? `#Pregunta${siglaPregunta} > [name^="ComPre_"]:input` : `#${siglaPregunta}`;
$(query).attr('readonly',true);

$("#PreguntaPA008").kendoDropDownList({
    readonly: true
});

var dropdownlist = $("#PreguntaPA008").data("kendoDropDownList");
dropdownlist.enable(false);

$("#PreguntaPA008").kendoComboBox({
    enable: false
});

$("#PreguntaPA008").kendoComboBox({
    readonly: true
});

// Lo saca dos veces
$("#Pre_1658").kendoComboBox({
    readonly: true
});

// No hace nada
$("#Name_1658").kendoComboBox({
    readonly: true
});

当我在浏览器中检查元素时，我得到

为什么我不能让 readonly 中的元素为真？

解决方法

希望这个快速示例对您有用： https://dojo.telerik.com/InaMowep

这是一个简单的下拉列表，当调用 readonly 方法并希望将其设置为 readonly 时，按钮可以打开或关闭下拉列表，即 readonly vs editable，您不必向它传递真正的值.只需调用该函数即可根据 api 详细信息将其设置为只读：https://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist/methods/readonly

,

第一个：

$("#PreguntaPA008").kendoComboBox();
var combobox = $("#PreguntaPA008").data("kendoComboBox");
combobox.readonly(true);

应该可以。它应该防止用户修改它，但它看起来仍然是可编辑的。检查文档 here

另一方面，如果你这样做：

$("#PreguntaPA008").kendoComboBox();
var combobox = $("#PreguntaPA008").data("kendoComboBox");
combobox.enable(false);

它被禁用（灰显），您甚至无法选择它。文档 here

以下示例为动态更改 enable 和 readonly 创建了两个开关。

$(document).ready(function() {
  // create ComboBox from input HTML element
  var cb = $("#PreguntaPA008").kendoComboBox({
    dataTextField: "text",dataValueField: "value",dataSource: [{
        text: "Cotton",value: "1"
      },{
        text: "Polyester",value: "2"
      },{
        text: "Cotton/Polyester",value: "3"
      },{
        text: "Rib Knit",value: "4"
      }
    ],filter: "contains",suggest: true,index: 3,enable: true,readonly: false
  }).data("kendoComboBox");

  $("#enable").kendoSwitch({
    change: function(e) {
      cb.enable(e.checked);
    }
  });

  $("#readonly").kendoSwitch({
    change: function(e) {
      cb.readonly(e.checked);
    }
  });
});

<script src="https://kendo.cdn.telerik.com/2021.1.119/js/jquery.min.js"></script>
<link href="https://kendo.cdn.telerik.com/2021.1.119/styles/kendo.default-v2.min.css" rel="stylesheet"/>
<script src="https://kendo.cdn.telerik.com/2021.1.119/js/kendo.all.min.js"></script>


<div id="example" role="application">
  Enable: <input type="checkbox" id="enable" checked="checked" /><br/> Read-only: <input type="checkbox" id="readonly" /><br/>
  <input id="PreguntaPA008" placeholder="Select fabric..." style="width: 100%;" />
</div>