asp.net - example - ¿Cómo obtener el texto del elemento seleccionado de Dropdown en la interfaz de Kendo?

kendo ui jquery dropdownlist

Question

Estoy usando los controles de la interfaz de usuario de Kendo. Quiero obtener el texto seleccionado de la lista desplegable en jQuery. He usado esta sintaxis:

 $("#ddl").data("kendoDropDownList").text();

Soy capaz de obtener el texto en todos los navegadores excepto en IE. No sé por qué esto no funciona en IE, por favor, ayúdame. ¿Hay alguna otra manera de obtener texto seleccionado?

Answer 1

Aquí hay un fiddle que cualquiera quiere probar.

<select id="testDrpDown">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="1231231">and so on</option>
</select>
</br>
</br>
<button onclick="MethOne()">Method one</button>
</br>
</br>
<button onclick="Methtwo()">Method one</button>

<script>
$("#testDrpDown").kendoDropDownList();

//var can be used anuwhere in js
var dropdown = $("#testDrpDown").data("kendoDropDownList");

function MethOne() {
    alert($("#testDrpDown").data("kendoDropDownList").text());
}

function Methtwo() {
    alert(dropdown.text());
}
</script>

Answer 2

Aquí hay otra manera:

e.item[0].textContent

Ejemplo completo:

$("#ancillaryTestDDL").kendoDropDownList({
    dataSource: that.viewModel.ancillaryTestDS,
    dataTextField: "DisplayValue",
    dataValueField: "Id",
    select: function (e) {
        console.log(e.item);
        console.log(e.item[0].textContent);
    }
});

Answer 3

Cuando se selecciona un valor de una lista desplegable en un evento seleccionado, el valor seleccionado está disponible de la siguiente manera:

@(Html.Kendo().DropDownList()
              .Name("booksDropDown")
              .HtmlAttributes(new { style = "width:37%" })
              .DataTextField("BookName")
              .DataValueField("BookId")
              .Events(x => x.Select("onSelectBookValue"))
              .DataSource(datasource => datasource.Read(action => action.Action("ReadBookDropDow", "PlanningBook").Type(HttpVerbs.Get)))
              .OptionLabel("Select"))

Función de Javascript como siguiente,

  function onSelectBookValue(e) {    

                var dataItem = this.dataItem(e.item.index());
                var bookId = dataItem.BookId; // value of the dropdown
                var bookName = dataItem.BookName; // text of the dropdown
               //other user code
}

Creo que esto ayudará a alguien.

Gracias

Answer 4

Estoy de acuerdo con d.popov, su pregunta parece ser la respuesta. colocando su declaración en una función de alerta aparece el texto seleccionado:

Alerta ($ ("# ddl"). Data ("kendoDropDownList"). Text ());

Probado en IE11. La versión de IE real relacionada con el problema nunca se mencionó ...

Answer 5

Para DropDownLists, incluye un DisplayText y un valor. DisplayText es lo que el usuario selecciona y el valor es lo que se usa en el back-end.

Ejemplo: tiene una base de datos que almacena información de contacto y su DisplayText sería el nombre de los contactos y el valor sería el campo de identificación de claves primarias para esa fila en particular en la base de datos.

ID - 1 Nombre - John Smith

$("#ddl").data("kendoDropDownList").dataItem().DisplayText = John Smith
$("#ddl").data("kendoDropDownList").dataItem().Value = 1

Esto es lo que estaba buscando hacer, espero que esta sea la respuesta que también estaban buscando.

Answer 6

Para obtener el valor de texto de un comando DropDownList use de la siguiente manera:

$("#ddl").data("kendoDropDownList").text();

Answer 7

Puedes probar así

 var ddl= $("#ddl").data("kendoDropDownList").dataItem($("#ddl").data("kendoDropDownList").select()).FieldName;
//FieldName is the text field of DataSource ---  .DataTextField("FieldName")