Select event is not working in AjaxData GridView - javascript

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

Related

Unable to get property 'rows' of a gridview in an updatepanel in asp.net

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 to call id from gridview in javascript window.open in asp .net?

I'm new to .net and jquery.
My gridview shows like this http://s3.postimg.org/erfrxh25f/untitled.jpg
Here is my loginfo click event.
protected void loginfo_click(Object sender, EventArgs e)
{
Button btn = (Button)(sender);
Response.Write("<script>");
Response.Write("window.open('loginfo.aspx?id=" + + "','_blank')");
Response.Write("</script>");
}
gridview:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataKeyNames="Book_id" DataSourceID="SqlDataSource1"
OnRowCommand="GridView1_RowCommand"
EnablePersistedSelection="True" BackColor="White"
OnSelectedIndexChanged="GridView1_SelectedIndexChanged" Height="240px"
Width="755px" BorderColor="Red" BorderWidth="2px">
<Columns>
<asp:BoundField DataField="Book_id" HeaderText="Book_id" InsertVisible="False"
ReadOnly="True" SortExpression="Book_id" >
<ControlStyle BorderColor="Red" />
</asp:BoundField>
<asp:BoundField DataField="Book_name" HeaderText="Book_name" SortExpression="Book_name" />
<asp:BoundField DataField="Author_name" HeaderText="Author_name" SortExpression="Author_name" />
<asp:BoundField DataField="Publisher_name" HeaderText="Publish_name" SortExpression="Publisher_name" />
<asp:TemplateField HeaderText="Edit">
<ItemTemplate>
<asp:Button runat="server" ID="btnedit" Text="Edit" CommandName="EditRow"></asp:Button>
</ItemTemplate>
<ControlStyle BorderColor="#CCFF66" BackColor="#FF0066" ForeColor="White" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Delete">
<ItemTemplate>
<asp:Button runat="server" ID="btndelete" Text="Delete" CommandArgument='<%# Eval("Book_id") %>' CommandName="Deleterow"></asp:Button>
</ItemTemplate>
<ControlStyle BackColor="#FF0066" ForeColor="White" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Log Info">
<ItemTemplate>
<asp:Button runat="server" ID="btnloginfo" Text="Log-Info" CommandArgument='<%# Eval("Book_id") %>' Onclick="loginfo_click"/>
</ItemTemplate>
<ControlStyle BackColor="#FF0066" ForeColor="White" />
</asp:TemplateField>
</Columns>
<EditRowStyle BorderColor="Red" />
<HeaderStyle BackColor="#FF0066" BorderColor="#CCFFFF" ForeColor="White"
Height="50px" Width="50px" />
<SelectedRowStyle BackColor="#FF66FF" />
</asp:GridView>
I just confused how to call bookid in window.open.,
Any help would be highly appreciated.
Thanks,
update:
loginfo.css:
protected void Page_Load(object sender, EventArgs e)
{
SqlConnection con = Connection.DBconnection();
SqlCommand com = new SqlCommand("sp_logdetails", con);
com.CommandType = CommandType.StoredProcedure;
}
loginfo.aspx:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataKeyNames="Book_id" EnablePersistedSelection="True" BackColor="White" Height="240px"
Width="755px" BorderColor="Red" BorderWidth="2px">
<Columns>
<asp:BoundField DataField="id" HeaderText="id" InsertVisible="False"
ReadOnly="True" SortExpression="Book_id" >
<ControlStyle BorderColor="Red" />
</asp:BoundField>
<asp:BoundField DataField="bookid" HeaderText="bookid" SortExpression="bookid" />
<asp:BoundField DataField="studentid" HeaderText="studentid" SortExpression="studentid" />
<asp:BoundField DataField="date" HeaderText="date" SortExpression="date" />
<asp:BoundField DataField="returndate" HeaderText="returndate" SortExpression="returndate" />
<asp:BoundField DataField="returnstatus" HeaderText="returnstatus" SortExpression="returnstatus" />
</Columns>
</asp:GridView>
You are already setting Book_id as a CommandArgument, so you can get the value from there directly by accessing the button through sender object.
protected void loginfo_click(Object sender, EventArgs e)
{
Button btn = (Button)sender;
Response.Write("<script>");
Response.Write("window.open('loginfo.aspx?id=" + btn.CommandArgument + "','_blank')");
Response.Write("</script>");
}

How to get an element in each loop of gridview in javascript

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);
}

Enable either texbox or dropdown value to be inserted javascript

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.

Clear/Reset file upload control in grid view

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>

Categories

Resources