I want to get the IdQueue's of the Queues I have checked in the check box, in java script.
For example, if i have checked boxes of IdQueue's 3 and 5, i want that the JS will alert me the IdQueue of them.
I need your help with this JS.
Thanks ahead.
<div data-role="popup" align=center id="Div1" style="width:600px; height:400px; direction:rtl; background-color:white">
<asp:GridView ID="GridView1" ClientIDMode="Static" runat="server" AllowPaging="False" AutoGenerateColumns="false"
OnRowCommand="grd_Threshold_Command" CssClass="text" Width="80%" OnRowDataBound="grd_Threshold_OnRowDataBound" >
<HeaderStyle CssClass="gridHeader" />
<RowStyle CssClass="gridRow" VerticalAlign="Top" />
<Columns>
<asp:TemplateField HeaderText="IdQueue" Visible="true">
<ItemTemplate>
<asp:Label ID="lblCSQCode" runat="server" Text='<%# Bind("CSQid") %>' BorderStyle="none"
BorderWidth="0px"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="NameQueue" HeaderStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Label ID="lblCSQName" runat="server" Text='<%# Bind("Name") %>' BorderStyle="none"
BorderWidth="0px"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="IntervalQueue" HeaderStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:DropDownList Visible="true" Enabled="true" ID="ddlResalution" EnableViewState="true"
runat="server" Width="148px">
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="ChooseQueue" HeaderStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:CheckBox ID="cbk1" runat="server" EnableViewState="true" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<br />
<asp:Label ID="lblMust" runat="server" Text="" ForeColor="Red"></asp:Label>
<br />
<div style="width: 100px; margin: 0 auto;">
<asp:ImageButton ID="ImgBtnSave" runat="server" ImageUrl="~/Images/glossyGreenOK.gif"
Height="40px" OnClick="lnkBranchReport_Click" Width="40px" />
</div>
<div style="width: 100px; margin: 0 auto;color: #003399; font-weight: bold;
font-size: 14px;">
<asp:LinkButton ID="lnbSave" runat="server" OnClientClick="CheckedBoxes()" >ok</asp:LinkButton>
</div>
</div>
Try this:
<asp:CheckBox ID="cbk1" runat="server" EnableViewState="true" data-id='<%# Eval("CSQid") %>' />
<asp:LinkButton ID="lnbSave" runat="server" OnClientClick="CheckedBoxes();return false();" >ok</asp:LinkButton>
Add a custom attribute to checkbox so we can directly access id from here instead getting from label lblCSQCode. After that add this javascript
First way
$('#<%=lnbSave.ClientID%>').on('click', function() {
var arr = [];
var selectedID = '';
$('#<%=GridView1.ClientID%> tr td input[type=checkbox]:checked').each(function() {
var id = $(this).parent().attr('data-id');
arr.push(id);
});
selectedID = arr.join();
//alert(selectedID);
});
Second way
function CheckedBoxes() {
var arr = [];
var selectedID = '';
$('#<%=GridView1.ClientID%> tr td input[type=checkbox]:checked').each(function() {
var id = $(this).parent().attr('data-id');
arr.push(id);
});
selectedID = arr.join();
//alert(selectedID);
}
Related
I have an asp.net page with a gridview in an updatepanel:
<asp:UpdatePanel ID="upGrid" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="gvBatchGroups" />
</Triggers>
<ContentTemplate>
<asp:GridView ID="gvBatchGroups" runat="server" AutoGenerateColumns="False" DataKeyNames="GroupID" GridLines="Both"
BorderWidth="1px" CellPadding="2" ForeColor="Black" BorderStyle="Double" HorizontalAlign="Center"
HeaderStyle-HorizontalAlign="Center" AllowSorting="True" CssClass="gvformat" OnRowDataBound="gvBatchGroups_RowDataBound">
<AlternatingRowStyle BackColor="#95B9B9" />
<HeaderStyle BorderStyle="Double" BorderColor="Black"/>
<Columns>
<asp:BoundField DataField="GroupID" HeaderText="Group ID" ItemStyle-HorizontalAlign="Center"/>
<asp:BoundField DataField="GroupCode" HeaderText="Group Code" ItemStyle-HorizontalAlign="Center"/>
<asp:BoundField DataField="GroupName" HeaderText="Group Name" />
<asp:BoundField DataField="GroupType" HeaderText="Group Type" ItemStyle-HorizontalAlign="Center"/>
<asp:BoundField DataField="FinancialYear" HeaderText="Financial Year" ItemStyle-HorizontalAlign="Center"/>
<asp:BoundField DataField="IsBatchSelected" HeaderText="Batch Selected" ItemStyle-HorizontalAlign="Center"/>
<asp:TemplateField ItemStyle-HorizontalAlign="Center" ItemStyle-VerticalAlign="Middle">
<ItemTemplate>
<asp:Button ID="btnDetail" runat="server" Text="view" OnClick="btnDetails_Click" CausesValidation="false" Font-Names="Trebuchet MS" CssClass="btn btn-comment" ForeColor="White" Font-Bold="True" />
</ItemTemplate>
<HeaderTemplate>Properties</HeaderTemplate>
</asp:TemplateField>
<asp:templatefield ItemStyle-HorizontalAlign="Center">
<HeaderTemplate>Select
<input id="cbHeaderSelect" type="checkbox" onclick="CheckAll(this)" runat="server" />
</HeaderTemplate>
<itemtemplate><asp:checkbox ID="cbSelect" runat="server"></asp:checkbox></itemtemplate>
</asp:templatefield>
</Columns>
</asp:GridView>
<asp:Button ID="bttnHidden" runat="Server" Style="display: none" />
<br />
</ContentTemplate>
</asp:UpdatePanel>
Column 8 has a checkbox that calls the following Javascript function to select all the checkboxes in the grid:
function CheckAll(oCheckbox) {
var Gridview = document.getElementById("<%=gvBatchGroups.ClientID%>");
for (i = 1; i < Gridview.rows.length; i++) {
Gridview.rows[i].cells[7].getElementsByTagName("INPUT")[0].checked =
oCheckbox.checked;
} }
However, when I click on the Column header, the Javascript function errors displaying the following:
Unable to get property 'rows' of undefined or null reference
This line appears under:
for (i = 1; i < Gridview.rows.length; i++)
Could the updatepanel be preventing the Javascript from "seeing" the gridview?
Any help would be most appreciated!
How do I get client id of image control
<asp:GridView ID="gv" OnRowDataBound="GetItems" runat="server" BackColor="White" BorderColor="#3366CC" BorderStyle="None" BorderWidth="1px" CellPadding="4" Font-Names="tahoma" Font-Size="8pt" AutoGenerateColumns="False" Height="154px" Width="929px">
<Columns>
<asp:TemplateField HeaderText="pic">
<ItemTemplate>
<asp:Repeater ID="pictures" runat="server">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" height="120" width="90" ImageUrl='<%# Eval("ImageUrl") %>' onclick="DisplayNewImageInWidnow();" />
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I use this code but it doesn't work
function DisplayNewImageInWidnow()
{
var img = document.getElementById('<%=gv.FindControl("pictures").FindControl("Image1").ClientID %>').src
OnClientClick="return DisplayNewImageInWidnow();"
or prevent server side from running
OnClientClick="DisplayNewImageInWidnow();return false;"
then
function DisplayNewImageInWidnow(obj)
{
var imgId = obj.id;
}
I have an issue with my ajax gridview, I want to get values from label inside my ajax but it's returning null. below is my gridview:
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="myModal" class="modal" style="display: none">
<!-- Modal content -->
<div class="modal-content">
<span onclick="CloseMyDiv();" id="closeSpan" class="close">×</span>
<br />
<div class="modal-body">
<AjaxData:GridView id="grdvPriorApproval" runat="server" RowCommandEvent="extractFunction">
<Columns>
<AjaxData:GridViewTemplateColumn HeaderText="ClaimhId" SortField="ClaimhId" Visible="False" >
<EditItemTemplate>
<asp:TextBox ID="txtClaimhID" runat="server" Text='<%# Bind("ClaimhId") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate >
<asp:Label ClientIDMode="Static" ID="lblClaimhID" runat="server" Text='<%# Bind("ClaimhId") %>'></asp:Label>
</ItemTemplate>
</AjaxData:GridViewTemplateColumn>
<AjaxData:GridViewTemplateColumn HeaderText="ApprovalTypeId" SortField="ClaimhId" Visible="False" >
<EditItemTemplate>
<asp:TextBox ID="txtApprovalTypeId" runat="server" Text='<%# Bind("ApprovaltypeID") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate >
<asp:Label ClientIDMode="Static" ID="lblApprovalTypeId" runat="server" Text='<%# Bind("ApprovaltypeID") %>'></asp:Label>
</ItemTemplate>
</AjaxData:GridViewTemplateColumn>
<AjaxData:GridViewBoundColumn ReadOnly="true" HeaderText="Reference" DataField="Reference" SortField="Reference" HeaderStyle-HorizontalAlign="Left" >
<ItemStyle HorizontalAlign="Left" Width="100px" />
<HeaderStyle HorizontalAlign="Left" />
</AjaxData:GridViewBoundColumn>
<AjaxData:GridViewBoundColumn ReadOnly="true" HeaderText="Patient #" DataField="MemberId" SortField="MemberId" HeaderStyle-HorizontalAlign="Left" >
<ItemStyle HorizontalAlign="Left" Width="100px" />
<HeaderStyle HorizontalAlign="Left" />
</AjaxData:GridViewBoundColumn>
<AjaxData:GridViewBoundColumn ReadOnly="true" HeaderText="Patient Name" DataField="MemberName" SortField="MemberName" HeaderStyle-HorizontalAlign="Left" >
<ItemStyle HorizontalAlign="Left" Width="100px" />
<HeaderStyle HorizontalAlign="Left" />
</AjaxData:GridViewBoundColumn>
<AjaxData:GridViewBoundColumn ReadOnly="true" HeaderText="Remarks" DataField="Remark" SortField="Remark" HeaderStyle-HorizontalAlign="Left" >
<ItemStyle HorizontalAlign="Left" Width="100px" />
<HeaderStyle HorizontalAlign="Left" />
</AjaxData:GridViewBoundColumn>
<AjaxData:GridViewBoundColumn ReadOnly="true" HeaderText="Valid Untill" DataField="ValidUntill" SortField="ValidUntill" HeaderStyle-HorizontalAlign="Left" >
<ItemStyle HorizontalAlign="Left" Width="100px" />
<HeaderStyle HorizontalAlign="Left" />
</AjaxData:GridViewBoundColumn>
<AjaxData:GridViewCommandColumn ControlStyle-Font-Bold="true" ControlStyle-ForeColor="#f2fae5"
ControlStyle-BackColor="#6c9815" ButtonType="Button" SelectText="Extract" ShowSelectButton="True">
</AjaxData:GridViewCommandColumn>
<%--<AjaxData:GridViewButtonColumn CommandName ="extract" ControlStyle-Font-Bold="true" ControlStyle-ForeColor ="black" Text="Extract" Visible="true" >
</AjaxData:GridViewButtonColumn>--%>
</Columns>
</AjaxData:GridView>
</div>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
And this is my javascript function:
function extractFunction(sender,e) {
var index = e.get_row().get_rowIndex();
var gridView = $find('<%= grdvPriorApproval.ClientID %>');
var row = gridView._rows[index].findControl('lblClaimhID').value;
__doPostBack('CustomPostBack', row);
}
Index value is 0 and row value is null.
1- I tried to change RowCommandEvent to SelectedIndexChangedEvent but that will create an issue on finding index (it will return an error).
2- In postback event I tried to get the selected row and values in this way:
CType(Me.grdvPriorApproval.SelectedRow.FindControl("lblApprovalTypeId"), Label).Text
but I got an error under selectedRow
Any help with my first Ajaxdata gridview is appreciated
How can i only allow the client to insert either of these two fields.Either Textbox (selected Column) or Value from dropdown (selected Column) but only one field is allowed in a gridview.
<asp:GridView ID="gvMedia" DataSourceID ="dsMedia" SkinID="GridviewSkin" runat="server" AutoGenerateColumns="false" AllowSorting="true" GridLines="Vertical" Width="700px" CellPadding="2" PageSize="50">
<Columns>
<asp:TemplateField HeaderText="Selected">
<ItemTemplate>
<telerik:RadTextBox runat="server" ID="txtSelected" Width="80px" MaxLength="10" onkeypress="return NumberOnly(this)">
</telerik:RadTextBox>
<asp:Label ID="lblOr" runat="server" Text='or'></asp:Label>
<telerik:RadComboBox ID="cmbSelected" CssClass="ComboBox" runat="server" Width ="50px" Height="100px">
<Items>
<telerik:RadComboBoxItem runat="server" Text="" Value="" />
<telerik:RadComboBoxItem runat="server" Text="100%" Value="100%" />
<telerik:RadComboBoxItem runat="server" Text="50%" Value="50%" />
</Items>
</telerik:RadComboBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EditRowStyle BackColor="#99FF66" />
<SelectedRowStyle BackColor="#FFFF99" />
</asp:GridView>
Preferred Method : using clientside events.
Please try with the below code snippet.
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script type="text/javascript">
function ValueChanged(obj, eve) {
var id = obj.get_id();
var tarid = obj.get_id().replace("txtSelected", "cmbSelected");
var combo = $telerik.findComboBox(tarid);
if (obj.get_value() != "")
combo.clearSelection();
}
function ClientSelectedIndexChanged(obj, eve) {
var id = obj.get_id();
var tarid = obj.get_id().replace("cmbSelected", "txtSelected");
var txt = $telerik.findTextBox(tarid);
txt.set_value("");
}
</script>
</telerik:RadCodeBlock>
<asp:GridView ID="gvMedia"
runat="server" AutoGenerateColumns="false" AllowSorting="true" GridLines="Vertical" Width="700px" CellPadding="2" PageSize="50">
<Columns>
<asp:TemplateField HeaderText="Selected">
<ItemTemplate>
<telerik:RadTextBox runat="server" ID="txtSelected" Width="80px" MaxLength="10">
<ClientEvents OnValueChanged="ValueChanged" />
</telerik:RadTextBox>
<asp:Label ID="lblOr" runat="server" Text='or'></asp:Label>
<telerik:RadComboBox ID="cmbSelected" CssClass="ComboBox" runat="server" Width="50px" Height="100px"
OnClientSelectedIndexChanged="ClientSelectedIndexChanged">
<Items>
<telerik:RadComboBoxItem runat="server" Text="" Value="" />
<telerik:RadComboBoxItem runat="server" Text="100%" Value="100%" />
<telerik:RadComboBoxItem runat="server" Text="50%" Value="50%" />
</Items>
</telerik:RadComboBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EditRowStyle BackColor="#99FF66" />
<SelectedRowStyle BackColor="#FFFF99" />
</asp:GridView>
Let me know if any concern.
I have multiple file upload control in asp.net grid view,i want to clear/reset file upload control when wrong file selection.
fileupload1 btnReset1
fileupload2 btnReset2
...
when i click btnReset2 then only clear value for fileupload2
How can i do this using java script.
Thank you all in advance
My code is as below.
JS Code:-
<script type="text/javascript">
function hi(ob) {
debugger;
var grid = document.getElementById("<%= GridView1.ClientID %>");
var inputs = grid.getElementsByTagName("input");
var fileUpload;
var strRowNo = ob.id.toString().split("_")[3];//get row number
alert(strRowNo);
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == "file") {
fileUpload = inputs[i];
if (i == strRowNo) {
fileUpload.value = "";
}
}
}
}
</script>
//Aspx Code:-
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="A" HeaderText="A" />
<asp:BoundField DataField="B" HeaderText="B" />
<asp:BoundField DataField="C" HeaderText="C" />
<asp:TemplateField HeaderText="File">
<ItemTemplate>
<div id="fuDiv" runat="server">
<asp:FileUpload ID="fupFile" runat="server" />
</div>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Reset">
<ItemTemplate>
<asp:Image ID="ibtnReset" runat="server" onClick="javascript:hi(this);" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="A" HeaderText="A" />
<asp:BoundField DataField="B" HeaderText="B" />
<asp:BoundField DataField="C" HeaderText="C" />
<asp:TemplateField HeaderText="File">
<ItemTemplate>
<div id="fuDiv" runat="server">
<asp:UpdatePanel ID="update_fupFile" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:FileUpload ID="fupFile" runat="server" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ibtnReset" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</div>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Reset">
<ItemTemplate>
<asp:UpdatePanel ID="update_fupFile" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Image ID="ibtnReset" runat="server" onClick="javascript:hi(this);" />
</ContentTemplate>
</asp:UpdatePanel>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>