2 つの列と 1 つのチェックボックスにいくつかの結果を含むテーブルがあります。チェックボックスがクリックされたら、クリックまたは選択したものを同じページの div に配置する必要があります。
生成された html は次のようになります。
<table cellspacing="0" cellpadding="4" id="ctl00_PlaceHolderMain_myGrid" style="color:#333333;width:100%;border-collapse:collapse;">
<tr style="color:White;background-color:#5D7B9D;font-weight:bold;">
<th scope="col"> </th>
<th scope="col">JobCode</th>
<th scope="col">JobName</th>
<th scope="col">JobPartner</th>
<th scope="col">JobManager</th>
<th scope="col">ClientName</th>
</tr>
<tr style="color:#333333;background-color:#F7F6F3;">
<td>
<input id="ctl00_PlaceHolderMain_myGrid_ctl02_CheckBox1" type="checkbox" name="ctl00$PlaceHolderMain$myGrid$ctl02$CheckBox1" />
</td>
<td>Column1</td>
<td>Column2</td>
<td>Column3</td>
<td>Column4</td>
<td>Column5</td>
</tr>
</table>
そしてjsファイルにはこれがあります」：
/// <reference path="jquery-1.9.1.min.js" />
$(document).ready(function () {
//On every checkbow that is clicked
$("#myGrid INPUT").click(function () {
var clientCode = $(this).parent().parent().parent().find("td:eq(2)").text()
var clientName = $(this).parent().parent().parent().find("td:eq(1)").text()
var displayvalue = clientCode.toUpperCase() + " - " + clientName.toUpperCase();
var removeDiv = $("#" + clientCode);
removeDiv.remove();
if ($(this).prop("checked") == true) {
AddSelectedJob(clientCode, displayvalue);
// $("[id$=ResultsDiv]").append('<div class="selectedjobs" id=' + clientCode + '>' + displayvalue + '<a href="#"><i class="icon-trash"></i></a></div>');
//Add to selectedjobs
FillSelectedJobs();
}
});
}
開発者ツールを使用して js デバッガーをアタッチし、関数内にブレークポイントがあるチェックボックスをクリックしても何も起こりません。
アップデート
これはサーバーのaspxコードです
<div style="width: 100%">
<div style="float: left">
<asp:Label ID="Label1" runat="server" Text="Search :"></asp:Label>
</div>
<div style="float: left">
<asp:TextBox ID="txtSearch" runat="server" Width="250px"></asp:TextBox>
</div>
<div style="float: left">
<asp:Button ID="btnSearch" runat="server" Text="Search" />
</div>
<div style="float: left; margin-left: 20px">
<asp:Label ID="lblClientCode" runat="server" Text=""></asp:Label>
</div>
<div style="clear: both"></div>
<div>
<div style="height: 300px; overflow: auto; float: left">
<asp:GridView ID="myGrid"
AutoGenerateColumns="true"
runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" Width="100%">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<EditRowStyle BackColor="#999999" />
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#E9E7E2" />
<SortedAscendingHeaderStyle BackColor="#506C8C" />
<SortedDescendingCellStyle BackColor="#FFFDF8" />
<SortedDescendingHeaderStyle BackColor="#6F8DAE" />
<Columns>
<asp:TemplateField>
<EditItemTemplate>
<asp:CheckBox ID="chkSelected" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<div style="margin-top: 0px; margin-left: 10px; float: left">
<asp:Label Text="Selected :" runat="server"></asp:Label>
<div id="ResultsDiv" style="margin-top: 0px">
</div>
</div>
<div style="clear: both"></div>
</div>
<div style="margin-top: 20px; margin-left: 550px">
<asp:Button ID="btnClose" runat="server" Text="Close" />
</div>
<div>
<asp:Label ID="lblError" runat="server" Text=""></asp:Label>
</div>
</div>