Javascript sum grandtotal returning NaN error - javascript

I am using below JavaScript code to get row totals and grand total of gridview
but the issue is grand total which is $mult returns NaN
out put i get
Item Name Unit Price UOM Quantity Total Amount
item1 5.00 pcs 2 10.00
item2 10.00 pcs 3 30.00
NaN
JavaScript
<script>
$(document).ready(function () {
$(".txtMult input").on('keyup mouseup', multInputs);
function multInputs() {
var $mult = 0;
$("tr.txtMult").each(function () {
var $UnitPrice = $('.UnitPrice', this).val();
var $Quantity = $('.Quantity', this).val();
var $total = (($UnitPrice) * ($Quantity));
$mult += $total;
});
$("tr.txtMult").each(function () {
var $UnitPrice = $('.UnitPrice', this).val();
var $Quantity = $('.Quantity', this).val();
$('.multTotal', this).text(parseFloat($total).toFixed(3));
});
$(".lblGrandAmount").text(parseFloat($mult).toFixed(3));
}
});
</script>
Grid-view
<asp:GridView ID="griditem" OnRowDataBound="griditem_RowDataBound" CssClass="table" GridLines="None" runat="server" ShowFooter="True" AutoGenerateColumns="False">
<Columns>
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:CheckBox ID="chkSel" Checked="true" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ItemName" HeaderText="Item Name" SortExpression="Item Name" />
<asp:TemplateField HeaderText="Unit Price" SortExpression="UnitPrice">
<ItemTemplate>
<asp:TextBox ID="txtCalcUnitprice" TextMode="Number" step="any" Width="120" CssClass="form-control UnitPrice" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Name" HeaderText="UOM" SortExpression="UOM" />
<asp:TemplateField HeaderText="Quantity" SortExpression="Quantity">
<ItemTemplate>
<asp:TextBox ID="txtCalcQty" Width="120" TextMode="Number" min="0" step="any" CssClass="form-control Quantity" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total Amount">
<ItemTemplate>
<asp:Label ID="lbltotalamount" CssClass="multTotal" runat="server"></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:Label ID="lblgrandamount" CssClass="lblGrandAmount" runat="server"></asp:Label>
</FooterTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ItemID" HeaderText="ItemID" ItemStyle-CssClass="hiddencol" HeaderStyle-CssClass="hiddencol" SortExpression="ItemID" />
</Columns>
</asp:GridView>
What could be the issue that makes this error occur?

All trs have the class txtMult, so you need to exclude header tr and grand total tr from the calculation. You can use :gt(0) and :lt(-1) for this like following.
$(".txtMult input").on('keyup mouseup', multInputs);
function multInputs() {
var $mult = 0;
$("tr.txtMult:gt(0):lt(-1)").each(function () {
var $UnitPrice = $('.UnitPrice', this).val();
var $Quantity = $('.Quantity', this).val();
var $total = $UnitPrice * $Quantity;
$mult += $total;
$('.multTotal', this).text($total.toFixed(2));
});
$(".lblGrandAmount").text($mult.toFixed(2));
}

Related

Get sum of gridview textboxes values and show total in label using javascript

I have in my application a grid-view in which a number of textboxes as template field, which can be incremented.When i enter some value in first textbox the sum of all textbox should be shown in Label. I have tried to use the below code but it didn't work.
JavaScript
<script type="text/javascript">
function calculate() {
var txtTotal = 0.00;
$(".calculate").each(function (index, value) {
var val = value.value;
val = val.replace(",", ".");
txtTotal = MathRound(parseFloat(txtTotal) + parseFloat(val));
});
document.getElementById("<%= lbltotal.ClientID %>").value = txtTotal.toFixed(2);
}
function MathRound(number) {
var result = Math.round(number * 100) / 100;
return result;
}
</script>
GridView
<asp:GridView ID="GridView1" runat="server" ShowFooter="true" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="RowNumber" HeaderText="Row Number" />
<asp:BoundField DataField="Description" HeaderText="Item Description" />
<asp:TemplateField HeaderText="Amount">
<ItemTemplate>
<asp:TextBox ID="txtamount" onkeyup="calculate();" CssClass="calculate" runat="server" Text=""></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
label
<asp:Label ID="lbltotal" runat="server" Text="" ForeColor="Green"></asp:Label>
Use this snippet. It adds an keyup listener to every TextBox in GridView1. Then it loops all the TextBoxes and adds the values and put the total in Label1
<script type="text/javascript">
var total = 0;
$(document).ready(function () {
$('#<%= GridView1.ClientID %> input[type="text"]').keyup(function () {
$('#<%= GridView1.ClientID %> input[type="text"]').each(function () {
if ($(this).val() != "") {
total += parseFloat($(this).val());
}
});
document.getElementById("<%= Label1.ClientID %>").innerHTML = total.toFixed(2);
});
});
</script>

Hide/Show Button based on status if row selected - Javascript

I hope I can be of help. I could not find anything like this in javascript.
I did in C # code, but I could use in Javascript for faster page and related transactions.
My situation is this:
I have to hide or display two buttons depending on the choice of a selected line taking into account the value of a particular field.
How to bring it in Javascript?
For now I've done this:
<script type="text/javascript">
function cbCheck_CheckedChanged()
{
List<object> ListStatoIns = new List<object>();
try
{
if (ListStatoIns != null)
{
if (ListStatoIns.Exists(x => x.Equals(true)) && ListStatoIns.Exists(x => x.Equals(false)))
{
btnApriInserimenti.style.display = "block";
btnChiudiInserimenti.style.display = "block";
}
else if (!ListStatoIns.Exists(x => x.Equals(true)))
{
btnChiudiInserimenti.style.display = "none";
btnChiudiInserimenti.style.display = "block";
}
else if (!ListStatoIns.Exists(x => x.Equals(false)))
{
btnChiudiInserimenti.style.display = "block";
btnChiudiInserimenti.style.display = "none";
}
}
}
catch (err) { }
}
</script>
This is Grid:
<cap:MultiColumnSortingGridView ID="gvDettaglio" runat="server" CssClass="grid-view"
DataKeyNames="Organizzazione,OrgID,Mensilita,CodiceOrg,isCaricamentoCompletato"
EmptyDataText="Non sono presenti dati inspezionabili: controlla la mensilità di riferimento o lo stato della contabilità" AutoGenerateColumns="false"
ExportButtonCssClass="button BtnExportExcel" ExportFileName="Dettaglio Straordinario">
<Columns>
<asp:TemplateField ItemStyle-Width="40">
<HeaderTemplate>
<asp:CheckBox ID="cbCheckAll" runat="server" Checked="false" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="cbCheck" runat="server" CssClass='<%# Eval("isCaricamentoCompletato")%>'
ToolTip="Seleziona per la riapertura o la chiusura dell'inserimento"
AutoPostBack="true" onclick="javascript:gvDettaglio.Rows(cbCheck_CheckedChanged);"/>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ItemStyle-Width="40">
<ItemTemplate>
<span class="jTooltipR button BtnAudit" title='<%# PrintOperazione(Eval("_ultimo"), Eval("_ultima")) %>'></span>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Mensilita di pagamento">
<ItemTemplate>
<%# PrintMensilita(CNA.CommonLib.Util.ConversionUtil.ConvertInt32orDefault(Eval("Mensilita"))) %>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="CodiceOrg" HeaderText="Codice" SortExpression="CodiceOrg" />
<asp:BoundField DataField="OrgID" HeaderText="Id Org." Visible="false" />
<asp:BoundField DataField="Organizzazione" HeaderText="Organizzazione" SortExpression="Organizzazione" />
<asp:BoundField DataField="NrDipendenti" HeaderText="Militari al BTG/RGT" SortExpression="NrDipendenti" />
<asp:BoundField DataField="NrDipInteressati" HeaderText="Mil. con Str." SortExpression="NrDipInteressati" />
<asp:BoundField DataField="NrJobMassivi" HeaderText="File inseriti" SortExpression="NrJobMassivi" />
<asp:BoundField DataField="NrJobElaborazioni" HeaderText="Militari inseriti" SortExpression="NrJobElaborazioni" />
<asp:TemplateField ItemStyle-Width="20">
<ItemTemplate>
<span class="jTooltipL buttonLittle BtnInfoLittle" title='<%# PrintTotaleDet(Eval("Totale")) %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Totale Ore">
<ItemTemplate>
<%# PrintTotale(Eval("Totale")) %>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Stato Inserimento" SortExpression="isCaricamentoCompletato">
<ItemTemplate>
<label class='<%# Eval("isCaricamentoCompletato").Equals(true) ? "validatedNotItem" : "validatedItem"%>'
style="width: 40px!important;"
title='<%#Eval("isCaricamentoCompletato").Equals(true) ? "Caricamento Chiuso" : "Caricamento Aperto"%>'>
</label>
<%--<span class="jTooltipL buttonLittle BtnInfoLittle" title= '<%#Eval("isCaricamentoCompletato").Equals(true) ? "Caricamento Chiuso" : "Caricamento Aperto"%>' />--%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ItemStyle-Width="40" HeaderText="Dettaglio">
<ItemTemplate>
<asp:LinkButton CausesValidation="false" ID="btnExportExcel" runat="server"
CssClass="button BtnExportExcel" Width="40" CommandName="Report" OnClick="OnClikDettaglioStraordinario"
Visible='<%# !String.IsNullOrEmpty(PrintTotale(Eval("Totale"))) %>'
ToolTip='Dettaglio straordinari inseriti' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</cap:MultiColumnSortingGridView>
Who helps me? many thanks in advance

Iterate Gridview to find greatest value using Javascript or jQuery

I have a gridview and scenario is: once someone deletes a row, it checks if NOTIF_RECIP_SEQ_NBR is maximum or not. If yes then it deletes that row else give a popup.
So basically once someone click on delete, it gets the NOtif_recip_Id of that row and iterates through Gridview to see if NOTIF_RECIP_SEQ_NBR of any row corresponding to that NOTIF_RECIP_ID is greater or not.
Question is It possible at client side? I did it with server side but I don't think that's a good way when I have all data on client side itself.
Please help. I tried multiple ways with Javascript but no use.
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<script type="text/javascript">
function check(var a ,var b)
{
var grid = document.getElementById("GridView1");
var cellPivot;
debugger;
if (grid.rows.length > 0) {
for (i = 1; i < grid.rows.length-1; i++)
{
//here I want code to iterate and compare value.Is it possible?
alert("You must select an answer for all columns if Pivot is yes")
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
<table>
<tr>
<td>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Label ID="Label13" runat="server" Text="Notif_Recip Data" BackColor="Azure"></asp:Label>
<asp:GridView ID="GridView1" runat="server" DataKeyNames="NOTIF_RECIP_GUID" emptydatatext="There are no data records to display."
AutoGenerateColumns = "false" Font-Names = "Arial"
Font-Size = "11pt" AlternatingRowStyle-BackColor="Beige"
HeaderStyle-BackColor = "AppWorkspace"
PageSize = "10" >
<Columns>
<asp:TemplateField ItemStyle-Width = "30px" HeaderText = "NOTIF_RECIP_ID">
<ItemTemplate>
<asp:Label ID="lblNOTIF_RECIP_ID" runat="server"
Text='<%# Eval("NOTIF_RECIP_ID")%>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtNOTIF_RECIP_ID" runat="server"
Text='<%# Eval("NOTIF_RECIP_ID")%>'></asp:TextBox>
<asp:RequiredFieldValidator ID="v1txtNOTIF_RECIP_ID" runat="server" ControlToValidate="txtNOTIF_RECIP_ID" Text="?" ForeColor="Red" />
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField ItemStyle-Width = "100px" HeaderText = "NOTIF_RECIP_SEQ_NBR">
<ItemTemplate>
<asp:Label ID="lblNOTIF_RECIP_SEQ_NBR" runat="server"
Text='<%# Eval("NOTIF_RECIP_SEQ_NBR")%>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="lnkRemove" runat="server"
CommandArgument = '<%# Eval("NOTIF_RECIP_GUID")%>'
OnClientClick = "ValidateGrid"
Text = "Delete" OnClick = <%# "javascript:check('" + Eval("NOTIF_RECIP_SEQ_NBR")" + "Eval("NOTIF_RECIP_ID") + "')" %> ></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" />
</Columns>
<HeaderStyle Font-Bold="True" />
<AlternatingRowStyle BackColor="#C2D69B" />
</asp:GridView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID = "GridView1" />
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
I found the solution so pasting for anyone who in need.
<script type = "text/javascript">
function GetSelectedRow(lnk) {
debugger;
var table, tbody, i, rowLen, row, j, colLen, cell;
var result = confirm('Do you want to delete this value ?');
if (result) {
var x = document.getElementById('Label100');
table = document.getElementById("GridView1");
tbody = table.tBodies[0];
var bool = true;
var row = lnk.parentNode.parentNode;
var rowIndex = row.rowIndex - 1;
var RecipID = row.cells[0].innerText;
var Sqqno = parseInt(row.cells[1].innerText);
for (i = 1, rowLen = tbody.rows.length; i < rowLen; i++) {
row = tbody.rows[i];
var newrecipId = row.cells[0].innerText;
if (newrecipId == RecipID) {
cell = row.cells[1];
var newseq = parseInt(row.cells[1].innerText);
if (Sqqno < newseq) {
// debugger;
bool = false;
x = document.getElementById('Label100');
x.innerHTML = "ERROR-Delete RecipId with max Seqnumber";
x.style.display = "block";
return bool;
break;
}
}
else {
bool = true;
}
}
return bool;
}
else {
return false;
}
}
</script>

Check Box to be selected row index manner in gridview

I want to select the check box values in row index manner in a grid view, Can someone suggest how to select the checkbox? Please find below the code not working appropraitely.
function Check_Click(spanChk) {
{
var IsChecked = spanChk.checked;
var Chk = spanChk;
Parent = document.getElementById('Gv1');
var btn = document.getElementById('<%=btnsubmit.ClientID %>');
var items = Parent.getElementsByTagName('input');
var i = 0;
var tot = 0;
for (i = 0; i < items.length; i++) {
if (items[i].checked) {
tot = tot + 1;
if (tot > 2) {
alert('Cannot check more than 2 check boxes');
items[i].checked = false;
return;
}
}
}
}
}
This is my grid view file
<asp:GridView ID="Gv1" runat="server" AutoGenerateColumns="False" OnRowDataBound="Gv1_RowDataBound">
<Columns>
<asp:BoundField DataField="datedif" HeaderText="Day/Hour" SortExpression="datedif" />
<asp:TemplateField HeaderText="Hour1">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" Enabled='<%# Eval("hour1").ToString().Equals("False") %>' OnCheckedChanged="CheckBox1_CheckedChanged" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour2">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox2" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox2" runat="server" Enabled='<%# Eval("hour2").ToString().Equals("False") %>' OnCheckedChanged="CheckBox6_CheckedChanged" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour3">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox3" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox3" runat="server" Enabled='<%# Eval("hour3").ToString().Equals("False") %>' OnCheckedChanged="CheckBox3_CheckedChanged" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour4">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox4" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox4" runat="server" Enabled='<%# Eval("hour4").ToString().Equals("False") %>' OnCheckedChanged="CheckBox4_CheckedChanged" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour5">
<EditItemTemplate>
<asp:CheckBox ID="CheckBox5" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox5" runat="server" Enabled='<%# Eval("hour5").ToString().Equals("False") %>' OnCheckedChanged="CheckBox5_CheckedChanged" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Call the JavaScript function from all of the CheckBoxes as shown below,
<asp:GridView ID="Gv1" runat="server" AutoGenerateColumns="False" OnRowDataBound="Gv1_RowDataBound">
<Columns>
<asp:BoundField DataField="datedif" HeaderText="Day/Hour" SortExpression="datedif" />
<asp:TemplateField HeaderText="Hour1">
<EditItemTemplate>
<asp:CheckBox ID="chkColumn1" runat="server" onclick="Check_Click(this)" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkHour1" runat="server" Enabled='<%# Eval("hour1").ToString().Equals("False") %>'
OnCheckedChanged="CheckBox1_CheckedChanged" onclick="Check_Click(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour2">
<EditItemTemplate>
<asp:CheckBox ID="ChkColumn2" runat="server" onclick="Check_Click(this)" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkHour2" runat="server" Enabled='<%# Eval("hour2").ToString().Equals("False") %>'
OnCheckedChanged="CheckBox6_CheckedChanged" onclick="Check_Click(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour3">
<EditItemTemplate>
<asp:CheckBox ID="chkColumn3" runat="server" onclick="Check_Click(this)" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkHour3" runat="server" Enabled='<%# Eval("hour3").ToString().Equals("False") %>'
OnCheckedChanged="CheckBox3_CheckedChanged" onclick="Check_Click(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour4">
<EditItemTemplate>
<asp:CheckBox ID="chkColumn4" runat="server" onclick="Check_Click(this)" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkHour4" runat="server" Enabled='<%# Eval("hour4").ToString().Equals("False") %>'
OnCheckedChanged="CheckBox4_CheckedChanged" onclick="Check_Click(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Hour5">
<EditItemTemplate>
<asp:CheckBox ID="chkColumn5" runat="server" onclick="Check_Click(this)" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkHour5" runat="server" Enabled='<%# Eval("hour5").ToString().Equals("False") %>'
OnCheckedChanged="CheckBox5_CheckedChanged" onclick="Check_Click(this)" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
And in the JavaScript, validate the selected CheckBox with its Row and then validate the number of items selected.
function IdExists(elements, id) {
for (var i = 0; i < elements.length; i++) {
if (elements[i].id.indexOf(id) > -1) {
return true;
}
}
return false;
}
function Check_Click(chkBx) {
Parent = document.getElementById('<% =Gv1.ClientID %>');
for (i = 0; i < Parent.rows.length; i++) {
var row = Parent.rows[i];
var items = row.getElementsByTagName('input');
if (items.length > 0) {
if (IdExists(items, chkBx.id)) {
var tot = 0;
for (j = 0; j < items.length; j++) {
if (items[j].type == 'checkbox' && items[j].checked) {
tot = tot + 1;
if (tot > 2) {
alert('Cannot check more than 2 check boxes');
chkBx.checked = false;
return;
}
}
}
}
}
}
}
You need to add a class name in the checkbox. then you can easily get all the checkbox by the class name.
function Check_Click(spanChk) {
{
var IsChecked = spanChk.checked;
var items = document.getElementsByClassName('myCheckBox');
var i = 0;
var tot = 0;
for (i = 0; i < items.length; i++) {
if (items[i].checked) {
tot = tot + 1;
if (tot > 2) {
alert('Cannot check more than 2 check boxes');
items[i].checked = false;
return;
}
}
}
}
}
UPDATE:
you can also use the below code to get all the checkbox.
var Checkboxes = document.querySelectorAll('input[type=checkbox]');

CheckBox in HeaderTemplate validates ItemTemplate CheckBox

Question:
I'm trying to validate the dropdownlist if the user checked the checkbox as you can see in the screen one.
Problem:
So, how can I validate the checkbox if the user have select all the checkboxes from header?
as you can see the screen two. if I select all the checkboxes then i am looking to fireup the validate as shown in screen one.
output:
screen 1:
screen 2
//aspx
<asp:GridView ID="gv" runat="server" AutoGenerateColumns="False" DataKeyNames="Id"
OnRowDataBound="gv_RowDataBound">
<Columns>
<asp:BoundField DataField="ID" ControlStyle-Width="250px" HeaderText="ID" SortExpression="ID" />
<asp:BoundField DataField="FirstName" ControlStyle-Width="250px" HeaderText="FirstName"
SortExpression="FirstName" />
<asp:BoundField DataField="LastName" ControlStyle-Width="250px" HeaderText="LastName"
SortExpression="LastName" />
<asp:TemplateField HeaderText="Reject">
<HeaderTemplate >
Reject<br />
<asp:CheckBox ID="checkboxall" runat="server" />
<asp:DropDownList ID="drpPaymentMethod_header" runat="server">
<asp:ListItem Value="-1">Please select reason</asp:ListItem>
<asp:ListItem Value="0">Month</asp:ListItem>
<asp:ListItem Value="1">At End</asp:ListItem>
<asp:ListItem Value="2">At Travel</asp:ListItem>
</asp:DropDownList>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="checkbox1" CssClass="selectreject" runat="server" />
<asp:DropDownList ID="drpPaymentMethod" runat="server">
<asp:ListItem Value="-1">Please select reason</asp:ListItem>
<asp:ListItem Value="0">Month</asp:ListItem>
<asp:ListItem Value="1">At End</asp:ListItem>
<asp:ListItem Value="2">At Travel</asp:ListItem>
</asp:DropDownList>
<asp:RequiredFieldValidator ID="rfv" InitialValue="-1" ControlToValidate="drpPaymentMethod" ForeColor="Red" SetFocusOnError="true"
Enabled="false" Display="dynamic" runat="server" ErrorMessage="Please select reason"></asp:RequiredFieldValidator>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Value">
<ItemTemplate>
<asp:TextBox ID="txt_Value" runat="server" Width="58px" Text="0"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
//cs
protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
CheckBox checkbox1 = e.Row.FindControl("checkbox1") as CheckBox;
RequiredFieldValidator rfv = e.Row.FindControl("rfv") as RequiredFieldValidator;
DropDownList drpPaymentMethod = (DropDownList)e.Row.FindControl("drpPaymentMethod");
// you can just pass "this" instead of "myDiv.ClientID" and get the ID from the DOM element
checkbox1.Attributes.Add("onclick", "UpdateValidator('" + checkbox1.ClientID + "','" + drpPaymentMethod.ClientID + "','" + rfv.ClientID + "');");
if (!checkbox1.Checked)
drpPaymentMethod.Attributes.Add("disabled", "disabled");
}
if (e.Row.RowType == DataControlRowType.Header)
{
CheckBox checkboxall = e.Row.FindControl("checkboxall") as CheckBox;
//how to get the reference here ( rfv ?????????)
//checkboxall.Attributes.Add("onclick", "UpdateValidatorAll('" + checkboxall.ClientID + "','" + drpPaymentMethod.ClientID + "','" + rfv.ClientID + "');");
}
}
//js
$(document).ready(function () {
var checkbox1 = "#<%=gv.ClientID%> input[id*='checkbox1']:checkbox";
var checkboxall = $("input[id$='checkboxall']");
$(checkboxall).click(function () {
if (checkboxall.is(':checked')) {
$('.selectreject > input').attr("checked", checkboxall.attr("checked"));
}
else {
$('.selectreject > input').attr("checked", false);
}
});
});
function UpdateValidator(chkID, drpID, validatorid) {
//enabling the validator only if the checkbox is checked
var enableValidator = $("#" + chkID).is(":checked");
if (enableValidator)
$('#' + drpID).removeAttr('disabled');
else
$('#' + drpID).attr('disabled', 'disabled');
var vv = $('#' + validatorid).val();
ValidatorEnable(document.getElementById(validatorid), enableValidator);
}
function UpdateValidatorAll(....) // i havent write the code for this function (select All checkbox)
try this:
ASPX:
<asp:GridView ID="gv" runat="server" AutoGenerateColumns="False" DataKeyNames="Id"
OnRowDataBound="gv_RowDataBound">
<Columns>
<asp:BoundField DataField="ID" ControlStyle-Width="250px" HeaderText="ID" SortExpression="ID" />
<asp:BoundField DataField="FirstName" ControlStyle-Width="250px" HeaderText="FirstName"
SortExpression="FirstName" />
<asp:BoundField DataField="LastName" ControlStyle-Width="250px" HeaderText="LastName"
SortExpression="LastName" />
<asp:TemplateField>
<HeaderTemplate>
Reject<br />
<asp:CheckBox ID="checkboxall" runat="server" />
<asp:DropDownList ID="drpPaymentMethod_header" runat="server">
<asp:ListItem Value="-1">Please select reason</asp:ListItem>
<asp:ListItem Value="0">Month</asp:ListItem>
<asp:ListItem Value="1">At End</asp:ListItem>
<asp:ListItem Value="2">At Travel</asp:ListItem>
</asp:DropDownList>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="checkbox1" runat="server" />
<asp:DropDownList ID="drpPaymentMethod" CssClass="gridDropDown" runat="server">
<asp:ListItem Value="-1">----</asp:ListItem>
<asp:ListItem Value="0">Month</asp:ListItem>
<asp:ListItem Value="1">At End</asp:ListItem>
<asp:ListItem Value="2">At Travel</asp:ListItem>
</asp:DropDownList>
<asp:RequiredFieldValidator ID="rfv" CssClass="gridRfv" InitialValue="-1" ControlToValidate="drpPaymentMethod"
Enabled="false" Display="Static" runat="server" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Value">
<ItemTemplate>
<asp:TextBox ID="txt_Value" runat="server" Width="58px" Text="0"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Button ID="Button1" runat="server" Text="Button" />
CS:
protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
CheckBox checkbox1 = e.Row.FindControl("checkbox1") as CheckBox;
RequiredFieldValidator rfv = e.Row.FindControl("rfv") as RequiredFieldValidator;
DropDownList drpPaymentMethod = (DropDownList)e.Row.FindControl("drpPaymentMethod");
// you can just pass "this" instead of "myDiv.ClientID" and get the ID from the DOM element
checkbox1.Attributes.Add("onclick", "UpdateValidator('" + checkbox1.ClientID + "','" + drpPaymentMethod.ClientID + "','" + rfv.ClientID + "');");
if (!checkbox1.Checked)
drpPaymentMethod.Attributes.Add("disabled", "disabled");
}
if (e.Row.RowType == DataControlRowType.Header)
{
CheckBox checkboxall = e.Row.FindControl("checkboxall") as CheckBox;
checkboxall.Attributes.Add("onclick", "UpdateValidatorAll('" + checkboxall.ClientID + "');");
}
}
JavaScript:
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function UpdateValidator(chkID, drpID, validatorid) {
//enabling the validator only if the checkbox is checked
var enableValidator = $("#" + chkID).is(":checked");
if (enableValidator)
$('#' + drpID).removeAttr('disabled');
else
$('#' + drpID).attr('disabled', 'disabled');
var vv = $('#' + validatorid).val();
ValidatorEnable(document.getElementById(validatorid), enableValidator);
}
function UpdateValidatorAll(chkID) {
//enabling the validator only if the checkbox is checked
var enableValidator = !$("#" + chkID).is(":checked");
$('.gridDropDown').each(function (index) {
if (enableValidator)
$(this).removeAttr('disabled');
else
$(this).attr('disabled', 'disabled');
});
$('.gridRfv').each(function (index) {
var cont = $(this).get();
ValidatorEnable(cont[0], enableValidator);
});
}
</script>

Categories

Resources