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]');
Related
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));
}
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
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>
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>
My requirement is that if check-box is checked then you have to select something from the dropdown box. I have multiple rows in the gridview so i am only requiring that you have to make a selection from the dropdown if you select the checkbox.
function validateDDL() {
var flag = true;
var dropdowns = new Array(); //Create array to hold all the dropdown lists.
var gridview = document.getElementById('<%=gvSearch.ClientID%>'); //GridView1 is the id of ur gridview.
dropdowns = gridview.getElementsByTagName('Select'); //Get all dropdown lists contained in GridView1.
for (var i = 0; i < dropdowns.length; i++) {
if (dropdowns.item(i).value == 'Select') //If dropdown has no selected value
{
flag = false;
break; //break the loop as there is no need to check further.
}
}
if (!flag) {
dropdowns[i].focus();
alert('Please select a Project Role from the dropdown box. Thanks');
}
return flag;
}
</script>
gridview
<asp:GridView ID="myGridview" runat="server"
AutoGenerateColumns="false" OnRowDataBound="OnRowDataBound"
AllowPaging="true" ShowFooter="True"
OnPageIndexChanging="OnPaging">
<Columns>
<asp:TemplateField HeaderText="ID" Visible="true">
<ItemTemplate>
<asp:Label ID="lblID" runat="server" Text='<%# Eval("PRJ_ID")%>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="10px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Title" Visible="true">
<ItemTemplate>
<asp:Label ID="lblPrjTit" runat="server" Text='<%# Eval("PRJ_TITLE")%>'></asp:Label>
</ItemTemplate>
<%-- <ItemStyle Width="10px" />--%>
</asp:TemplateField>
<asp:TemplateField HeaderText="Project Role">
<ItemTemplate>
<asp:DropDownList ID="ddlRole" CssClass="form-control" runat="server">
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Check">
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack="true" />
</ItemTemplate>
<ItemStyle Width="10px" />
</asp:TemplateField>
</Columns>
</asp:GridView>
i have solved so in case someone might have similar issue
<script type="text/javascript">
function validateDDL() {
//debugger;
var flag = true;
var gridView = document.getElementById('<%= gvSearch.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var inputs = gridView.rows[i].getElementsByTagName('input');
var dropdowns = gridView.rows[i].getElementsByTagName('Select');
if (inputs != null && inputs.length >= 1 && inputs[0] != null && dropdowns != null && dropdowns.length >= 1 && dropdowns[0] != null) {
if (dropdowns[0].type == "select-one" && inputs[0].type == "checkbox") {
var ddlSelectedItem = dropdowns[0].value;
// if (inputs[0].checked && (ddlSelectedItem == "Select" || txtval == null)) {
if (inputs[0].checked && ddlSelectedItem == "Select" ) {
flag = false;
break;
}
else {
flag = true;
}
}
}
}
if (!flag) {
alert('your message alert here');
}
return flag;
}
</script>