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

【问题标题】：I cant put a kendo dropdownlist readonly我不能把剑道下拉列表只读
【发布时间】：2021-04-29 18:39:03
【问题描述】：

我有一个 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
});

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

为什么我不能让只读元素为真？

【问题讨论】：

标签： javascript jquery asp.net-mvc kendo-ui

【解决方案1】：

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

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

【讨论】：

【解决方案2】：

第一个：

$("#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>

【讨论】：