Add item to DropDownList in EditItemTemplate of a Gridview - javascript

I am trying to find a way to add an item to a dropdownlist using codebehind or javascript.
the dropdownlist is located within a gridview in the edit item section
<asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" AutoGenerateColumns="False" DataKeyNames="pallet" DataSourceID="RFS_TW" AllowPaging="True" Width="100%">
<AlternatingRowStyle BackColor="White"></AlternatingRowStyle>
<Columns>
<asp:CommandField ShowEditButton="True" />
<asp:BoundField DataField="pallet" HeaderText="Pallet" ReadOnly="True" SortExpression="pallet" ItemStyle-Width="10%" >
<ItemStyle Width="10%" />
</asp:BoundField>
<asp:BoundField DataField="date_added" HeaderText="Date" SortExpression="date_added" ReadOnly="True" ItemStyle-Width="10%">
<ItemStyle Width="10%" />
</asp:BoundField>
<asp:BoundField DataField="department" HeaderText="Department" SortExpression="department" ReadOnly="True" ItemStyle-Width="10%">
<ItemStyle Width="10%" />
</asp:BoundField>
<asp:TemplateField HeaderText="sold_by" SortExpression="sold_by">
<EditItemTemplate>
<asp:DropDownList ID="soldby_ddl" runat="server" >
<asp:ListItem>Please Select</asp:ListItem>
</asp:DropDownList>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("sold_by") %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="10%" />
</asp:TemplateField>
</Columns>
</asp:GridView>

Try to use
function addValues() {
var listBox = document.getElementById("soldby_ddl");
var option = new Option("value", "value");
listBox.appendChild(option);
}
or
function addValues() {
var listBox = document.getElementById("soldby_ddl");
var option = new Option("value", "value");
listBox.options[i++] = option;
}

Related

Not able to get values of textbox and label using asp.net and jquery from aspgrid (dynamic)

I have following grid
<asp:GridView ID="grdBOQ" width="100%" ShowHeaderWhenEmpty="true" AutoGenerateColumns="false" runat="server" CssClass="gvBOQdatatable">
<Columns>
<asp:TemplateField HeaderText="Sl No:">
<ItemTemplate>
<%#(grdBOQ.PageSize * grdBOQ.PageIndex) + grdBOQ.Rows.Count + 1%>
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" Width="40px" Wrap="False" />
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Category Name">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("Category_Name") %>' ID="lblCategoryName" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Category Description">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("Description") %>' ID="lblCategoryDescription" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Quantity">
<ItemTemplate>
<asp:TextBox ID="txtQuantity" class="form-control" runat="server" Text="0" MaxLength="8"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("UOM_Name") %>' ID="lblUnit" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit Rate">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("SellingPrice_Per_UOM") %>' ID="lblUnitRate" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total">
<ItemTemplate>
<asp:Label runat="server" Text='0.00' ID="lblTotalPrice" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EmptyDataTemplate>
<div style="width: 99%; text-align: center">
<asp:Label ID="lblEmpty" runat="server" Text="Sorry!!! No Record Found.."></asp:Label>
</div>
</EmptyDataTemplate>
</asp:GridView>
I have given following code in script tag using jquery to find asp textbox value but not working. I tried 2 different way but not getting.
First way
$("#txtQuantity").on('click', function () {
alert('testing');
});
Second Way
var recipient = $("#txtQuantity")
$("#<%=recipient.ClientID%>").on('change', function () {
alert('testing');
});
Nothing works what is the way to get. I tried the above code inside document.ready and inside aspcontent tag.As it is in grid I have now around 5 textboxes and it varies based on the values from database.
Finally I have some thing like this but no idea this is a good solution.Please advice
$("#<%=grdBOQ.ClientID %>").on('change', function () {
var GridView1 = document.getElementById('<%= grdBOQ.ClientID %>');
for (var rowId = 1; rowId < GridView1.rows.length; rowId++) {
var textValue = GridView1.rows[rowId].cells[3].children[0];
if (textValue.value != '0')
alert(textValue.value);
}
});

Calculate Running Total in asp.net Gridview [duplicate]

This question already has answers here:
how I can show the sum of in a datagridview column in asp.net
(2 answers)
Closed 7 years ago.
i would like to calculate running total in gridiview using javascript or any other method just to calculate the total hours and the grand total hours as users keying in the numbers. So here is how my current gridview look like
i want to calculate the running total as users key in the number as shown in the green highlighted color.
<div>
<asp:GridView ID="grvTest" runat="server"
ShowFooter="True" AutoGenerateColumns="False"
CellPadding="4" ForeColor="#333333"
GridLines="None" OnRowDeleting="grvStudentDetails_RowDeleting">
<Columns>
<asp:BoundField DataField="ID" HeaderText="Row ID" />
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:DropDownList ID="ddl1" runat="server">
<%--<asp:ListItem Value="G">test1</asp:ListItem>
<asp:ListItem Value="P">test2</asp:ListItem>--%>
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Day1">
<ItemTemplate>
<asp:TextBox ID="txtDay1" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Day2">
<ItemTemplate>
<asp:TextBox ID="txtDay2" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText = "Total">
<ItemTemplate>
<asp:Label ID="lblTotal" runat="server" Text="0"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowDeleteButton="True" />
</Columns>
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#EFF3FB" />
<EditRowStyle BackColor="#2461BF" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
GRAND TOTAL:
<asp:Label ID="lblGrandTotal" runat="server" Text="0"></asp:Label>
</div>
I assume that you are using a query like below to fetch data from database and binding it to your grid.
SELECT ID, NAME, HOURS1, HOURS2 FROM YOUR_TABLE
You can updated this query to have a new column to calculate your totals.
SELECT ID, NAME, HOURS1, HOURS2, HOURS1 + HOURS2 AS TOTAL FROM YOUR_TABLE
If this is not the case then please share how you are fetching and filling data into grid. So that I can suggest your more relevant solution.

make (GridView with DropDownList using FilterExpression in SqlDataSource) work without reloading the page using JavaScript

How can i make this (Filter GridView with DropDownList using FilterExpression in SqlDataSource) work without reloading the page using JavaScript ?
<asp:DropDownList ID="ddlCountries" runat="server" AutoPostBack="True" DataSourceID="DropDownDataSource"
DataTextField="SC" DataValueField="SC" AppendDataBoundItems="True">
<asp:ListItem Text="All " Value="" />
</asp:DropDownList>
<asp:SqlDataSource ID="DropDownDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:CountConnectionString %>"
SelectCommand="SELECT [SC] FROM [CountTable]"></asp:SqlDataSource>
<asp:GridView ID="GridView1" HeaderStyle-BackColor="#3AC0F2" HeaderStyle-ForeColor="White"
runat="server" AutoGenerateColumns="False" DataSourceID="GridDataSource"
DataKeyNames="ID">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" ItemStyle-Width="150"
InsertVisible="False" ReadOnly="True" SortExpression="ID" />
<asp:BoundField DataField="SC" HeaderText="SC" ItemStyle-Width="150"
SortExpression="SC" />
<asp:BoundField DataField="Traffic" HeaderText="Traffic"
SortExpression="Traffic" />
</Columns>
<HeaderStyle BackColor="#3AC0F2" ForeColor="White"></HeaderStyle>
</asp:GridView>
<asp:SqlDataSource ID="GridDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:CountConnectionString %>"
SelectCommand="SELECT * FROM [CountTable]" FilterExpression="SC = '{0}'">
<FilterParameters>
<asp:ControlParameter Name="SC" ControlID="ddlCountries" PropertyName="SelectedValue" />
</FilterParameters>
</asp:SqlDataSource>

Loop through GridView using JQuery or Javascript

I am developing a form on which i have a GridView.In each row of GridView,i have one DropDownList with values Present & Absent and some TextBoxes and one submit button.
If i select Present then all the TextBoxes get enabled and enters values.
If i select Absent then all the TextBoxes get disabled.
On submit button i want to write a JQuery Or Javascript Code to check if user has selected Present and do not enter marks and want to show an alert.
I've tried following JQuery Code but i don't understand what i'm doing wrong in that code.
$("#<%=grdOJTResult.ClientID%> tr").each(function () {
var Value = $(this).closest("tr").find("select[id*=ddlStatus]").val();
if (Value == 0) {
if ($(this).closest("tr").find("input[id*=txtAttendance]").val() == "") {
alert("Please Enter Attendance.");
$(this).closest("tr").find("input[id*=txtAttendance]").focus();
return false;
}
else if ($(this).closest("tr").find("input[id*=txtWritten]").val() == "") {
alert("Please Enter Written Marks.");
$(this).closest("tr").find("input[id*=txtWritten]").focus();
return false;
}
else if ($(this).closest("tr").find("input[id*=txtTurnOut]").val() == "") {
alert("Please Enter TurnOut Marks.");
$(this).closest("tr").find("input[id*=txtTurnOut]").focus();
return false;
}
else if ($(this).closest("tr").find("input[id*=txtSmartness]").val() == "") {
alert("Please Enter Smartness Marks.");
$(this).closest("tr").find("input[id*=txtSmartness]").focus();
return false;
}
else if ($(this).closest("tr").find("input[id*=txtKnowledge]").val() == "") {
alert("Please Enter Knowledge Marks.");
$(this).closest("tr").find("input[id*=txtKnowledge]").focus();
return false;
}
else if ($(this).closest("tr").find("input[id*=txtLanguage]").val() == "") {
alert("Please Enter Language Marks.");
$(this).closest("tr").find("input[id*=txtLanguage]").focus();
return false;
}
else if ($(this).closest("tr").find("input[id*=txtAttitude]").val() == "") {
alert("Please Enter Attitude Marks.");
$(this).closest("tr").find("input[id*=txtAttitude]").focus();
return false;
}
}
});
Below is my GridView.
<asp:GridView ID="grdOJTResult" runat="server" AutoGenerateColumns="false" Width="98%"
CssClass="mGrid" DataKeyNames="EmpId,BatchId" HorizontalAlign="Center">
<Columns>
<asp:BoundField DataField="EmpCode" HeaderText="Employee Code" ItemStyle-HorizontalAlign="Center">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="EmpFullName" HeaderText="Employee Name" ItemStyle-HorizontalAlign="Center">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:TemplateField HeaderText="ATTENDANCE (16)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtAttendance" Width="50px" MaxLength="4" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender1" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtAttendance" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="WRITTEN MARKS (34)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtWritten" Width="50px" MaxLength="3" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender2" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtWritten" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="TURN OUT (10)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtTurnOut" Width="50px" MaxLength="3" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender3" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtTurnOut" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="SMARTNESS (10)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtSmartness" Width="50px" MaxLength="3" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender4" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtSmartness" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="KNOWLEDGE (10)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtKnowledge" Width="50px" MaxLength="3" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender5" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtKnowledge" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="LANGUAGE (10)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtLanguage" Width="50px" MaxLength="3" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender6" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtLanguage" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="ATTITUDE (10)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtAttitude" Width="50px" MaxLength="3" runat="server" ></asp:TextBox>
<Cc1:FilteredTextBoxExtender ID="FilteredTextBoxExtender7" runat="server" Enabled="True"
FilterType="Custom,Numbers" TargetControlID="txtAttitude" ValidChars=".">
</Cc1:FilteredTextBoxExtender>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="TOTAL MARKS (100)" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:TextBox ID="txtTotal" Width="50px" MaxLength="3" runat="server" ReadOnly="true"></asp:TextBox>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="STATUS" ItemStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:DropDownList ID="ddlStatus" Width="50px" runat="server" CssClass="ddlRes">
<asp:ListItem Text="Present" Value="0"></asp:ListItem>
<asp:ListItem Text="Absent" Value="1"></asp:ListItem>
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Try:
$("#<%=grdOJTResult.ClientID%> tr").each(function () {
var Value = $(this).find('select[id$="ddlStatus"]').val();
});
Demo:
http://jsfiddle.net/v9cqwrfm/2/

How to enable and disable the LinkButton in GridView when CheckBox in the same GridView was checked?

I have a number of Template Fields in my GridView. In which I have One CheckBox called "chkSelect" in it and in another Template Field I have one LinkButton called "lnkgvQCAttribute". Here I want to Disable the LinkButton when the CheckBox is Unchecked and Enable the LinkButton when the CheckBox is Checked. How to do this using JavaScript?
Here is my GridView's columns:
<Columns>
<asp:TemplateField HeaderText="S.No.">
<ItemTemplate>
<asp:Label ID="lblSNo" runat="server" Text='<%# Container.DataItemIndex + 1 %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="25px" />
<ControlStyle Width="25px" />
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' onClick="CheckedTotal();" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" />
</HeaderTemplate>
<ControlStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
<asp:BoundField DataField="PurchaseID" HeaderText="PurchaseID" Visible="false" />
<asp:BoundField DataField="POID" HeaderText="POID" Visible="false" />
<asp:BoundField DataField="PurchaseDetailID" HeaderText="PurchaseDetailID" Visible="false" />
<asp:TemplateField HeaderText="ItemID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblgvItemID" runat="server" Text='<%# Bind("ItemID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Item Description" SortExpression="ItemDescription">
<ItemTemplate>
<asp:Label ID="lblItemDesc" runat="server" Text='<%# Bind("ItemDescription") %>' Style="display: none"></asp:Label>
<asp:TextBox ID="txtItemDesc" runat="server" Text='<%# Bind("ItemDescription") %>' Font-Size="Smaller" Enabled="false"></asp:TextBox>
</ItemTemplate>
<ControlStyle Width="200px" />
<ItemStyle Width="200px" />
</asp:TemplateField>
<asp:BoundField DataField="SpecificationName" HeaderText="Specification Name" SortExpression="SpecificationName">
<ItemStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:TemplateField HeaderText="RD">
<ItemTemplate>
<asp:Label ID="lblgvRD" runat="server" Text='<%# Bind("RandomDimension") %>'></asp:Label></ItemTemplate>
<ItemStyle Width="40px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Planned Quantity" SortExpression="PlannedQuantity">
<ItemTemplate>
<asp:Label ID="lblPlannedQuantity" runat="server" Text='<%# Bind("PlannedQuantity") %>' />
<asp:TextBox ID="txtPlannedQuantity" runat="server" Style="display: none" Text='<%# Bind("PlannedQuantity") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="OnOrder Quantity" SortExpression="OnOrderQuantity">
<ItemTemplate>
<asp:Label ID="lblOnOrderQuantity" runat="server" Text='<%# Bind("OnOrderQuantity") %>' />
<asp:TextBox ID="txtOnOrderQuantity" runat="server" Style="display: none" Text='<%# Bind("OnOrderQuantity") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Order Quantity" SortExpression="OrderQuantity">
<ItemTemplate>
<asp:TextBox ID="txtOrderQuantity" runat="server" MaxLength="10" onkeypress="return DecimalValidate(event);" onkeyup="return calculateTotal();" Text='<%# Bind("OrderQuantity") %>' Enabled="false" />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit Rate" SortExpression="UnitRate">
<ItemTemplate>
<asp:Label ID="lblUnitRate" runat="server" Style="display: none" Text='<%# Bind("UnitRate") %>' />
<asp:TextBox ID="txtUnitRate" runat="server" onkeypress="return DecimalValidate(event);" onkeyup="return calculateTotal();" Text='<%# Bind("UnitRate") %>' Enabled="false />
</ItemTemplate>
<ControlStyle Width="90%" />
<ItemStyle Width="80px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Total Amount" SortExpression="TotalAmount">
<ItemTemplate>
<asp:TextBox ID="txtTotalAmt" runat="server" contentEditable="false" onclick="this.blur();" Style="background-color: Transparent; border: 0px; cursor: default" Text='<%# Bind("TotalAmount") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="ItemStatusID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblgvItemStatusID" runat="server" Text='<%# Bind("ItemStatusID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="QC">
<ItemTemplate>
<asp:LinkButton ID="lnkgvQCAttribute" runat="server" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>' CommandName="QC" Text="QC" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
Please I need all your suggestions...
First add a reference to jQuery (download it and put it in one of site-folders, for example Scripts):
<script src="Scripts/jquery-1.2.6.pack.js" type="text/javascript"></script>
Then you should create a CssClass name for your elements, like:
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' CssClass="chkSelect" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" />
</HeaderTemplate>
<ControlStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
and
<asp:TemplateField HeaderText="QC">
<ItemTemplate>
<asp:LinkButton ID="lnkgvQCAttribute" runat="server" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>'
CommandName="QC" Text="QC" CssClass="lnkgvQCAttribute" />
</ItemTemplate>
</asp:TemplateField>
Now, you can find your elements with JS and control their behavior. In this case, the checkbox is in a span, then in a td, and finally a tr. You should navigate to the tr, in the tr find the a element that have lnkgvQCAttribute class, and control it:
<script type="text/javascript">
$(document).ready(function () {
$("span.chkSelect input").click(function () {
var enabled = this.checked;
var link = $(this).parent().parent().parent().find("a.lnkgvQCAttribute");
if (enabled) {
var href = $(link).attr("data-href");
$(link).attr("href", href);
$(link).removeAttr("data-href");
} else {
var href = $(link).attr("href");
$(link).attr("data-href", href);
$(link).removeAttr("href");
}
});
});
</script>
Enjoy!
Call onclick="disableLinkButton(this)" on checkbox
function disableLinkButton(obj) {
var rowObject = getParentRow(obj);
if(obj.checked) {
rowObject.childNodes[3].disabled = true // debug and check, row Object will contain that link button as its childnodes
}
else {
rowObject.childNodes[3].disabled = false;
}
}
function getParentRow(obj) {
obj = obj.parentElement;
while(obj.tagName != "TR")
return obj;
}
Add following javascript and style onto the page:
<script type="text/javascript">
$(function () {
$("input[id*='chkSelect_']", "#<%= GridView1.ClientID %>")
.click(function () {
var linkButton = $(this).closest("tr").find("a[id*='lnkgvQCAttribute_']");
if (this.checked) {
EnableLinkButton(linkButton);
}
else {
DisableLinkButton(linkButton);
}
}) //disable turned off linkbuttons on page load
.not(":checked").each(function () {
DisableLinkButton($(this).closest("tr").find("a[id*='lnkgvQCAttribute_']"));
});
});
function EnableLinkButton(lb) {
$(lb)
.removeClass("disabled")
.attr("href", function () {
return !$(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('retun false;', '__doPostBack') : this.href;
});
}
function DisableLinkButton(lb) {
$(lb)
.addClass("disabled")
.attr("href", function () { return $(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('__doPostBack', 'retun false;') : this.href; });
}
</script>
<style type="text/css">
a.disabled
{
color: #e3e3e3;
text-decoration: none;
cursor: default;
}
</style>

Categories