I have got a gridview. Each row has a Alternate Names (TextBox) and a hidden button, this button has to get clicked by JQuery on the textbox "onblur" automatically.
<asp:GridView ID="GridView1" CssClass="GridView1" runat="server" AutoGenerateColumns="False" EnableViewState="True">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="checkbox1" runat="server" OnClick="checkboxing(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="City Name Id">
<ItemTemplate>
<asp:Label ID="NameId" runat="server" Text='<%# Eval("Name_Id") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Alternate Names">
<ItemTemplate>
<asp:TextBox runat="server" ClientIDMode="Static" ID="altTxtNames" Style="display: none" onblur="buttonupdate(this)"></asp:TextBox>
<asp:Button runat="server" ID="TxtButton" ClientIDMode="Static" Style="visibility: hidden; display: none" OnClick="TxtButton_Click" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Whenever "onblur" event occurs in the Alternate Names (textbox)
onblur="buttonupdate(this)"
the following JQuery is executed:
function buttonupdate(alternateTxtNames) {
$('#TxtButton').click();
}
This buttonclick prompts execution of aspx.cs method where the values of edited "Alternate Names" and "City Name Id" from the clicked button grid view row are selected using following code:
protected void TxtButton_Click(object sender, EventArgs e)
{
Button btn = (Button)sender;
GridViewRow gvr = (GridViewRow)btn.NamingContainer;
string updatedSNo = (gvr.FindControl("NameId") as Label).Text;
int SNo = Convert.ToInt32(updatedSNo);
string updatedText = (gvr.FindControl("altTxtNames") as TextBox).Text;
}
But everytime the click comes from another row only the first gridview row values are selected which I think is the causality of using ClientIDMode because of which it is not able to distinguish the button click from other rows.
How should I overcome this issue. Can someone kindly guide.
Apart from the logical error of using duplicate id's, if you attach the event handler through jQuery, you would be able to get access to the target of the event.
So in that case, rather than onblur="buttonupdate(this), you could use a jQuery event handler such as this:
Change id to class: (This is necessary to attach the handler to more than one textbox)
<asp:TextBox runat="server" ClientIDMode="Static" class="altTxtNames" Style="display: none" ></asp:TextBox>
New function:
function buttonupdate(row) {
$(row).find('#TxtButton').click();
}
jQuery event handler:
$("#GridView1 .altTxtNames").on("blur", function(event){
var clickedRow = $(event.target).closest("tr");
buttonupdate(clickedRow);
});
The above handler will take the blur event, then look for the closest parent tr, then find the button to click in that row.
I'm not familiar with asp, but the above problem should be solvable through just jQuery.
This is what has worked for me:
Following is the GridView markup:
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="checkbox1" runat="server" OnClick="checkboxing(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Alternate Names">
<ItemTemplate>
<asp:Label runat="server" ID="AlternateNames" Text='<%# Eval("alternateNames") %>'></asp:Label>
<asp:TextBox runat="server" ID="altTxtNames" class="altTxtNameClass" Style="display: none"></asp:TextBox>
<asp:Button runat="server" ID="TxtButton" Style="visibility: hidden; display: none" OnClick="TxtButton_Click" />
</ItemTemplate>
</asp:TemplateField>
This is the Jquery code which changes label to textbox on checkbox click:
function checkboxing(chkbox) {
var cellz = $(chkbox).parent();
var lbl = $(cellz).siblings().find('span[id*=AlternateNames]');
var txtbox = $(cellz).siblings().find('input[id*=altTxtNames]');
if ($(chkbox).is(':checked')) {
lbl.hide();
var str = lbl.text();
txtbox.val(str);
txtbox.show();
}
else {
lbl.show();
txtbox.hide();
}
}
This is the code which gets triggered on textbox blur:
$(document).ready(function () {
$('.altTxtNameClass').on('blur', function (event) {
var clickedRow = $(event.target).closest('tr');
buttonupdate(clickedRow);
});
});
Below is the code that gets called on from above code:
function buttonupdate(row) {
$(row).find('input[id*=TxtButton]').click();
}
Below is the code that gets triggered once Button is clicked
protected void TxtButton_Click(object sender, EventArgs e)
{
Button btn = (Button)sender;
GridViewRow gvr = (GridViewRow)btn.NamingContainer;
string updatedSNo = (gvr.FindControl("NameId") as Label).Text;
int SNo = Convert.ToInt32(updatedSNo);
string updatedText = (gvr.FindControl("altTxtNames") as TextBox).Text;
}
Hope this is of some help to somebody. The syntax of the Jquery on how to implement the idea is provided by Rich so got to thank him for that.
Related
Does anyone knows How to add ASP.NET control for <i></i> tags?
i am looking for ASP.NET Control that is equivalent with <i> Html tag
in my case, I also want to implement .FindControl() method for it inside the .cs file.
Here's the part of the code..
Example.axcs
<asp:Panel id="forDiv" CssClass="input-group colorpicker-component" runat="server">
<asp:TextBox ID="txtHeree" class="form-control" runat="server" Style="width: auto"></asp:TextBox>
<asp:Panel CssClass="input-group-append" runat="server">
<asp:Label CssClass="input-group-addon input-group-text" runat="server"><i></i></asp:Label>
</asp:Panel>
</asp:Panel>
from the code above,
the FindControl method that I have implemented goes like this,
Example.ascx.cs
TextBox txtVal = e.Row.FindControl("txtHeree") as TextBox;
Panel txtVal = e.Row.FindControl("forDiv") as Panel;
and, etc..
My current problem is, I still can't find both the equivalent ASP.NET Control for <i></i> tags and also for .FindControl() method for it.
sure, I have read the reference to another QnA forum from both Stackoverflow and Microsoft Docs:
ASP.NET Control to HTML tag equivalentandhttps://learn.microsoft.com/en-us/troubleshoot/developer/webapps/aspnet/development/server-controls
ANY suggestion, answer, or efficient code for the <i></i> tag control, will be very.. very helpful.
Thank You.
Sure, if you add a "id" tag, and runat=server, then that "i" thing becomes quite much a server side control.
And doing that allows use in listview, repeaters etc.
So, do this:
<i id="MyIguy" runat="server"></i>
<br />
<asp:Button ID="Button1" runat="server" Text="Button"
CssClass="btn" OnClick="Button1_Click" />
So, with code behind the button like this:
protected void Button1_Click(object sender, EventArgs e)
{
MyIguy.InnerText = "this is fun";
}
And we see this when run:
And say we use a gridview, repeater etc.?
say this markup, we just dropped in that (wiht id, and runat=server).
Quite much makes that control work, look, and feel like any other server side asp.net control.
Say, this markup and gridview (for the find control example).
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"
DataKeyNames="ID" CssClass="table" >
<Columns>
<asp:TemplateField HeaderText="Hotel Name"> <ItemTemplate>
<asp:Label ID="txtHotel" runat="server" Text='<%# Eval("HotelName") %>' ></asp:Label>
</ItemTemplate> </asp:TemplateField>
<asp:TemplateField HeaderText="City"> <ItemTemplate>
<asp:Label ID="txtCity" runat="server" Text='<%# Eval("City") %>' ></asp:Label>
</ItemTemplate> </asp:TemplateField>
<asp:TemplateField HeaderText="Description"> <ItemTemplate>
<i id="Descript" runat="server"> <%# Eval("Description") %> </i>
</ItemTemplate> </asp:TemplateField>
<asp:TemplateField HeaderText="View"> <ItemTemplate>
<asp:Button ID="Button1" runat="server" Text="View"
CssClass="btn" OnClick="Button1_Click" />
</ItemTemplate> </asp:TemplateField>
</Columns>
</asp:GridView>
Code to load:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
GridView1.DataSource = General.MyRst("SELECT * FROM tblHotelsA ORDER BY HotelName");
GridView1.DataBind();
}
}
And we have this now:
And our view button click code, say this:
protected void Button1_Click(object sender, EventArgs e)
{
Button btn = sender as Button;
GridViewRow gRow = btn.NamingContainer as GridViewRow;
int? PKID = GridView1.DataKeys[gRow.RowIndex]["ID"] as int?;
Debug.Print("pk data base row id = " + PKID.ToString());
Debug.Print("Row click index = " + gRow.RowIndex);
// get hotel name
Label txtHotel = gRow.FindControl("txtHotel") as Label;
Debug.Print("Hotel name = " + txtHotel.Text);
// get our <i> guy
HtmlGenericControl myIthing = gRow.FindControl("Descript") as HtmlGenericControl;
Debug.Print("Our i guy = " + myIthing.InnerText);
}
Output :
so, most such controls - adding a "id" and runat="server", and at that point, it quite much behaves like most other asp.net controls.
I want to extract the article id from a gridview row when I click on the hyperlink. My goal is to be able to capture the article id field of a specific row when I click on the hyperlink in gridview.
This is what I tried so far but for some reason, it doesn't go to the codebehind when I click on the hyperlink.
<asp:GridView ID="Rssfeed" runat="server" AutoGenerateColumns="false" onrowcommand="grid_RowCommand" CssClass="Grid">
<Columns>
<asp:TemplateField HeaderText="Info">
<ItemTemplate>
Articleid:
<asp:Label ID="Label1" Text='<%#Eval("articleid") %>' runat="server" />
<br />
Title :
<asp:Label ID="Label2" Text='<%#Eval("title") %>' runat="server" />
<br />
Link:
<asp:HyperLink ID="hlnkFile" runat="server" target="_blank" CommandName="Select" NavigateUrl='<%# Eval("link") %>' Text='<%# Eval("link") %>'></asp:HyperLink> <br />
Publicationdate:
<asp:Label ID="Label3" Text='<%#Eval("publicationdate") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
public void grid_RowCommand(Object sender, GridViewCommandEventArgs e)
{
// If multiple ButtonField column fields are used, use the
// CommandName property to determine which button was clicked.
if (e.CommandName == "Select")
{
// Convert the row index stored in the CommandArgument
// property to an Integer.
int index = Convert.ToInt32(e.CommandArgument);
// Get the last name of the selected author from the appropriate
// cell in the GridView control.
GridViewRow selectedRow = Rssfeed.Rows[index];
}
}
This example can help:
<ItemTemplate>
Link:
<asp:LinkButton ID="lbFile" CommandName="Select" runat="server"><%# Eval("link") %></asp:LinkButton>
</ItemTemplate>
code behind
public void Rssfeed_RowCommand(Object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "Select")
{
// get text from LinkButton e.g. URL as in question
string link = ((LinkButton)selectedRow.FindControl("lbFile")).Text;
// Redirect to the URL link
Response.Redirect(link);
}
}
I have GridView and a button as follows. Then i am binding the gridview with data from my database. GridView has two hiddenfield for Id and ClassIndex.
when i selecting a checkbox and click button, i want to get the corresponding Id and FileName.
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="check" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:HiddenField ID="hdfId" runat ="server" Value='<%#Eval("Id") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:HiddenField ID="hdfClssIndex" runat ="server" Value='<%#Eval("ClassIndex") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:Label ID="lblFileName" runat ="server" Text='<%#Eval("FileName") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
and Button Like
<asp:Button ID="Button1" runat="server" onclick="Button1_Click"
Text="Send Request" />
the code behind button is
protected void Button1_Click(object sender, EventArgs e)
{
foreach (GridViewRow row in GridView1.Rows)
{
var check = row.FindControl("check") as CheckBox;
if (check.Checked)
{
int Id = Convert.ToInt32(row.Cells[1].Text);
//some logic follws here
}
}
}
but i am getting an error like
Input string was not in a correct format.
What is the error and how to solve it?
Your looping correct.
But you forgot to notice one thing here, when you wanted to access CheckBox you did a FindControl on row. Which means you are trying to find some control in that row.
Then why are you accessing HiddenField control inside row with row.Cell[1].Text?
Try to find that also.
int Id = Convert.ToInt32(((HiddenField)row.FindControl("hdfId")).Value);
This is a simple gridView I m using in aspx web page
<asp:GridView ID="Order" runat="server" AutoGenerateColumns="False" ShowFooter="True" GridLines="none"
ItemType="MyProject.Models.TempList" SelectMethod="GetList" >
<Columns>
<asp:BoundField DataField="ItemID" HeaderText="ID" SortExpression="ItemID" />
<asp:TemplateField HeaderText="ItemName">
<ItemTemplate>
<asp:Label runat="server" ID="ItemName" Width="40" Visible="true" text="<%#: Item.Item.ItemName %>"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Price(each)">
<ItemTemplate>
<%#: String.Format("{0:c}", Convert.ToDouble(Item.Item.UnitPrice))%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Delete">
<ItemTemplate>
<div style="float:left">
<asp:Button ID="DeleteBtn" runat="server" Text="Delete" OnClick="DeleteBtn_Click"/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I have 2+ items in a list<> which is populating the gridView, how can I tell (in the codeBehind.cs) that which Row the "DeleteBtn" was clicked on?
I was using a for loop to iterate every item in gridView using Rows[i] and used a check box to know which item wants to be deleted using a Update button.
But I want to do it directly on a custom created deletebutton.
Thanks in advance, I know I'm missing something silly.
The best way to do that is using CommandName and CommandArgument in your button declaration like that
<asp:Button ID="AddButton" runat="server" CommandName="AddToCart"
CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" Text="Add to Cart" />
you can pass any value in the case we pass the rowIndex, you can get a propertie from your object like that CommandArgument="<%# Eval("id") %>" after that you will handle the onRowCommand method
protected void GridView1_RowCommand(object sender,GridViewCommandEventArgs e)
{
if (e.CommandName == "AddToCart")
{
// Retrieve the row index stored in the
// CommandArgument property.
int index = Convert.ToInt32(e.CommandArgument);
// Retrieve the row that contains the button
// from the Rows collection.
GridViewRow row = GridView1.Rows[index];
// Add code here to add the item to the shopping cart.
}
}
hope it helps :)
Use the button's CommandArgument property; assign Container.DataItemIndex to it. Then use the OnRowCommand event of the gridview and grab the index.
Sample aspx:
<asp:Label runat="server" ID="lblMsg" />
<asp:GridView runat="server" id="gvSample" AutoGenerateColumns="false" OnRowCommand="PerformOperation">
<Columns>
<asp:BoundField DataField="RowValue"/>
<asp:TemplateField>
<ItemTemplate>
<asp:Button Text="Delete" runat="server" CommandName="MyCustomCommand" CommandArgument="<%# Container.DataItemIndex %>" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Code behind:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
PopulateGrid();
}
}
private void PopulateGrid()
{
gvSample.DataSource = Enumerable.Range(0, 10).Select(i => new { RowValue = i });
gvSample.DataBind();
}
protected void PerformOperation(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "MyCustomCommand")
{
var rowIndex = int.Parse(e.CommandArgument);
lblMsg.Text = string.Format("Button on row index: {0} was clicked!", rowIndex);
}
}
Let the button field be given a CommandName, say for example a unique string myCommandName in the Edit columns dialog box. Don't worry about the CommandArgument. Then, in the Grid view Row command event, you can check which button (i.e. column) is clicked by tracing the command name like if e.commandname = "mycommandname", at the same time the CommandArgument will also be available as String and all we have to do is to converttoint32, something like intSelectedRow = convert.ToInt32(e.CommandArgument) which will give us the selected row's index.
I need control id from grid view to use Trigger.
My code is here :
<asp:GridView ID="gvDetails" CssClass="table table-striped table-bordered datatables dataTable" DataKeyNames="folder_path" CellPadding="5" runat="server" AutoGenerateColumns="false" Width="100%">
<Columns>
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="attachment_name" HeaderText="Attachment" />
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="lnkDownload" Text="Download" runat="server" OnClick="DownloadFile"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderStyle-CssClass="hideGridColumn" ItemStyle-CssClass="hideGridColumn">
<ItemTemplate>
<asp:HiddenField ID="hdnAttach_Id" Value='<%#(Eval("attachment_id").ToString())%>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle BackColor="#2FBDF1" Font-Bold="true" />
</asp:GridView>
I need code like...
<Triggers>
<asp:PostBackTrigger ControlID="lnkDownload" />
</Triggers>
how to get "lnkDownload" id from gridview?
Exception :
You need to register each and every LinkButton as an PostBackTrigger. After each row is bound in your GridView, you'll need to search for the LinkButton and register it through code as follows:
protected void gvDetails_RowDataBound(object sender, GridViewRowEventArgs e)
{
LinkButton lb = e.Row.FindControl("lnkDownload") as LinkButton;
ScriptManager.GetCurrent(this).RegisterPostBackControl(lb);
}
And need to call this on RowDataBoundevent.
You can access the controls from the grid view using the findcontrol method
foreach(GridViewRow row in gvDetails.Rows)
{
if(row.RowType == DataControlRowType.DataRow)
{
LinkButton linkButton = (LinkButton )row.FindControl("lnkDownload");
//Your other code
}
}
I've recently encountered this problem as well.
You can find a control by doing e.row.findcontrol("NameOfControl").
Since I don't fully know what you intend to do, you can retrieve the ClientID by finding the control. Then you can specify the ID of the button by saying Button.ClientID. This will display the ContentHolder1_gridview_0_button_0.
To add attributes, you can do button.Attributes.Add("attribute", "#" + button.ClientID);
The following code is something I've fixed to have the following attribute added to the button. This is so that I can click a button and copy the textbox.
Example:
protected void gvListInventoryPassword_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
HtmlButton buttonPass= (HtmlButton)e.Row.FindControl("buttonPass");
TextBox txtBox= (TextBox)e.Row.FindControl("txtBox");
buttonPass.Attributes.Add("data-clipboard-target", "#" + txtBox.ClientID);
}
}//End of gvListInventoryPassword_RowDataBound function