2016-08-08 10 views
1

Ich probiere das folgende jquery/asp.net-Codebeispiel in Visual Studio 2013. Im Gegensatz zum folgenden Beispiel - in meiner Übung habe ich den C# -Code in den Code hinter der Seite platziert und ich legte den jquery-Code mit dem aspx-Markup. Die Gridview zeigt die Daten an, aber wenn ich auf die Schaltfläche klicke, wird die Warnung nicht aufgerufen. Wenn ich versuche, das Debugging für die jquery zu setzen, wird der jquery-Code nicht eingegeben. Ich wäre dankbar, wenn jemand darauf hinweisen könnte, was mir fehlt:jquery Beispiel in asp.net funktioniert nicht

-Code-Behind

protected void Page_Load(object sender, EventArgs e) 
{ 

    var myTestList = new List<MyTestClass1> 
    { 
    new MyTestClass1 {ID = 1, Name = "Name1"}, 
    new MyTestClass1 {ID = 2, Name = "Name2"}, 
    new MyTestClass1 {ID = 3, Name = "Name3"}, 
    new MyTestClass1 {ID = 4, Name = "Name4"}, 
    new MyTestClass1 {ID = 5, Name = "Name5"}, 
    new MyTestClass1 {ID = 6, Name = "Name6"} 
    }; 


    GridView1.DataSource = myTestList; 
    GridView1.DataBind(); 
} 

public class MyTestClass1 
{ 
    public int ID { get; set; } 
    public string Name { get; set; } 

} 

Markup

<%@ Page Language="C#" %> 


<%@ Import Namespace="System.Collections.Generic" %> 
<%@ Import Namespace="WebApplication1" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script runat="server"> 

//--I'm doing this in code behind 




</script> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
</head> 
<body> 
    <form id="HtmlForm" runat="server"> 
<asp:GridView ID="GridView1" runat="server" 
    AutoGenerateColumns="false" 
    DataKeyNames="ID"> 
    <Columns> 
     <asp:TemplateField> 
      <ItemTemplate> 
       <asp:CheckBox ID="CheckSelect" runat="server" /> 
       <asp:HiddenField ID="hdID" runat="server" 
        Value='<%# Eval("ID") %>' /> 
      </ItemTemplate> 
     </asp:TemplateField> 
     <asp:TemplateField> 
      <HeaderTemplate> 
       Name 
      </HeaderTemplate> 
      <ItemTemplate> 
       <asp:Label runat="server" Text='<%# Eval("Name") %>'> 
       </asp:Label> 
      </ItemTemplate> 
     </asp:TemplateField> 
    </Columns> 
</asp:GridView> 
<br /> 
<asp:Button ID="btnGetData" runat="server" Text="Get Data" /> 

JavaScript

var gridView1Control = document.getElementById('<%= GridView1.ClientID %>'); 

$('#<%= btnGetData.ClientID %>').click(function(e) { 
    //To uncheck the header checkbox when there are no selected checkboxes in itemtemplate 
    $('input:checkbox[id$=CheckSelect]:checked', gridView1Control).each(function(item, index) { 

     var id = $(this).next('input:hidden[id$=hdID]').val(); 
     alert(id); 
    }); 
    return false; 

}); 
+0

Ich muss fragen, aber ich nehme an, Sie haben keine Konsolenfehler? Was ist, wenn Sie Quelle anzeigen und die Client-ID der Schaltflächen manuell eingeben? – Eonasdan

+0

Versuchen Sie, dieses $ ('input: checkbox [id $ = CheckSelect]: checked' in diesem $ ('input: checkbox [id = "CheckSelect"]: checked' ... Ich kann nicht testen, aber zuerst schau es scheint falsch wähler – Baro

Antwort

0

Sein, weil das Element CheckSelect innen Die asp:GridViewGridView1 erhält die ID GridView1_ChkSe lect_ {row_index} und hdID erhält die ID GridView1_hdID_{row_index}. Hier verwenden Sie den Selektor $= welcher

Wählt Elemente, die das angegebene Attribut mit einem Wert haben, der genau mit einer gegebenen Zeichenfolge endet. Beim Vergleich wird zwischen Groß- und Kleinschreibung unterschieden.

Was Sie brauchen, ist *=

Elemente Wählt, die das angegebene Attribut mit einem Wert haben einen bestimmten Teilkette enthält.

Ändern Sie Ihren Code wie folgt.

$('input:checkbox[id*=CheckSelect]:checked', 
    gridView1Control).each(function (item, index) { 

    var id = $(this).next('input:hidden[id*=hdID]').val(); 
    alert(id); 
}); 
+0

Nein, keine Konsolenfehler - aber hey - Wunderbar! * = war der Trick! –