Member 12856488 Ответов: 2

Как с помощью jQuery фильтр в GridView в ASP.NET в выпадающем списке 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.min.css" rel="stylesheet" />


<script>
        $('#<%=DropDownList1.ClientID %>')
    </script>




<asp:GridView ID="gvchaptername" AutoGenerateColumns="false" GridLines="None"
              OnRowDeleting="gvchaptername_RowDeleting" OnRowDataBound="gvchaptername_RowDataBound" runat="server" >


<asp:TemplateField  HeaderText="">
             <ItemTemplate>
            <asp:DropDownList ID="DropDownList1" class="dropdown" AutoPostBack="true"  OnSelectedIndexChanged="ddchapter_SelectedIndexChanged"   Width="160" DataTextField="CHAPTER" DataValueField="ID"  CssClass="form-control btn-sm"  runat="server"></asp:DropDownList>
             </ItemTemplate>
            </asp:TemplateField>


</Columns>

        </asp:GridView>


Что я уже пробовал:

Я получил ошибку DropDownList1
$('#<%=DropDownList1.ClientID %>')
это работает вне gridview

2 Ответов

Рейтинг:
1

Member 7969814

Чтобы получить доступ к элементу управления gridview ItemTemplate, вы должны использовать такой код

добавьте свойство dropdown [DropDownList1] как clientidmode="static"

var gv = document.getElementById("<%=gvchaptername.ClientID %>");
     var dropvalue = gv.getElementsByTagName('DropDownList1');


var dropvalue = $("#ddrateplan").val();


Пожалуйста, проверьте следующую ссылку проекта кода для повторного использования

Как получить элемент шаблона элемента gridview в javascript[^]

как получить выбранное значение в javascript из выпадающего списка gridview - Stack Overflow[^]

F-ES Sitecore

Что делать, если вид сетки имеет более одной строки?

Member 7969814

используйте петлю вот так


ВАР таблица = документ.метода getElementById("gvchaptername");

if (table.rows.length > 0) {
//цикл таблицы gridview
for (var i = 1; i < table.rows.length; i++)

{

//получить все входные элементы

ВАР входов = таблица.строки[я].метод getelementsbytagname("ввод");

для (var j = 0; j < входы.длина; j++) {

//получить текстовое поле 1

if (inputs[j].id.indexOf("Textbox1") > -1) {
оповещения(входы[Дж].значение);
}

}

}
}

F-ES Sitecore

Html по-прежнему недействителен, идентификаторы должны быть уникальными. Нет смысла использовать атрибут id, если он не уникален.

Member 7969814

GridView в с свойства itemtemplate-это набор один и тот же идентификатор объекта. мы должны использовать номер строки цикла для идентифицированного объекта. Пожалуйста, поделитесь снимком экрана, где javascript имеет ошибку. Я просто хочу знать, что является целевым значением просто доступа к выпадающему списку или что-то еще.

F-ES Sitecore

Если вы сделаете идентификатор статическим, то все строки дадут выпадающему списку один и тот же идентификатор, что сделает html недействительным, а выпадающие списки недоступными по идентификатору. Настоящий кодекс

<asp:GridView ID="gvchaptername" AutoGenerateColumns="false" GridLines="None" OnRowDataBound="gvchaptername_RowDataBound" runat="server" >
    <Columns>
        <asp:TemplateField  HeaderText="">
                <ItemTemplate>
            <asp:DropDownList ID="DropDownList1" class="form-control" ClientIDMode="Static" runat="server"></asp:DropDownList>
                </ItemTemplate>
            </asp:TemplateField>
    </Columns>
</asp:GridView>

<script type="text/javascript">
    $("#DropDownList1").css("border-color", "red");
</script>


результаты в этом;

https://imgur.com/a/h2VNvV4

Рейтинг:
1

F-ES Sitecore

Я бы добавил атрибут данных в ваши выпадающие списки, который позволит вам идентифицировать их и получить к ним доступ;

<asp:DropDownList ID="DropDownList1" class="dropdown" data-type="ddl_chapter" AutoPostBack="true" ...


Для вашего js кода Вы должны помнить что может быть более одного выпадающего списка поэтому если вы хотите получить доступ к их отдельным свойствам вам понадобится какой то цикл;

<script type="text/javascript">
    $.each($("[data-type='ddl_chapter']"), function (index, item) {
        var ddl = $(item);
        alert('Drop down ' + index + ' has value ' + ddl.val());
    });
</script>


Если вы хотите настроить таргетинг на них в целом с помощью селекторов jquery, сделайте что-то вроде

$("[data-type='ddl_chapter']").css("border-color", "red");