I have a gridview with two check box columns. One is for selection and the other for setting a property something like "add to favorite". This gridview is loaded code behind and the check boxes are defined inside Item Template. The problem is that it is not very user friendly to have someone check two boxes for the same row, when they could have just selected "add to favorite" and this should automatically check the selection check box too. I understand this could be easily done using jquery as I do not think making a postback for these selections is a good user experience. I am very new to jquery and so any help would be appreciated.
The checkboxes on the same row follow the same convention for id, so if select is cbSelect_0, the other one will be cbfavorite_0. I also gave all the cbFavorite checkboxes the same class "cbMul" and then I wrote a function
function checkUncheck() {
$(".cbMul").checked(function() {
if ( $(this).attr('checked')) {
$('#myCheckbox').attr('checked', false);
} else {
$('#myCheckbox').attr('checked', 'checked');
}
});
}
Now, I do not understand how do I get the attributes of the checkbox that was checked, replace the the name and get the id of the checkbox if select and then check that one?
Here is the gridview:
<asp:GridView ID="gvEnvironments" EmptyDataText="--- No Data ---" runat="server" AutoGenerateColumns="false"
DataKeyNames="Id" >
<Columns>
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:CheckBox ID="cbSelectEnvironments" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Id" HeaderText="ID" InsertVisible="false" ReadOnly="true" SortExpression="Id" />
<asp:TemplateField HeaderText="Multi">
<ItemTemplate>
<asp:CheckBox ID="cbFav" runat="server" Checked="false" CssClass="cbMul" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Description" HeaderText="Description" HeaderStyle-Width="300px" SortExpression="Description" />
</Columns>
Here is a fiddle: http://jsfiddle.net/FyDEk/
HTML:
<table>
<tr>
<td>
<input class="cb1" type="checkbox" />
</td>
<td>
<div id="dd">text</div>
</td>
<td>
<input class="cb2" type="checkbox" />
</td>
</tr>
</table>
JS:
$(function () {
$(".cb2").on("change", function () {
var cb = $(this),
cbIsChecked = cb.is(":checked"),
cbPrev = cb.parent().parent().find(".cb1");
if(cbIsChecked)
cbPrev.prop("checked", true);
else
cbPrev.prop("checked", false);
});
});
Add appropriate classes to your CheckBoxes.
Related
Hi I am developing one application. I have one multiselect dropdownlist box. Whenever i select one value in dropdownlistbox corresponding value in gridview will be having checkbox in below gridview. I want to disable that checkbox. I am basically mvc developer and finding hard times to fix this. I am trying my level best to fix this. For example, whever i select some value in dropdown I am getting ID using jquery as below.
<script>
$(function() {
$('.limitedNumbSelect2').change(function (e) {
var selected = $(e.target).val();
});
});
This is my gridview.
<asp:GridView ID="gdvRegretletter" CssClass="tableform" runat="server" AutoGenerateColumns="False" DataKeyNames="Vendor_ID"
EmptyDataText="No records found !" ShowHeaderWhenEmpty="true" AllowPaging="true" OnPageIndexChanging="gdvRegretletter_PageIndexChanging">
<Columns>
<asp:TemplateField ShowHeader="true" HeaderText="Select All">
<HeaderTemplate>
<asp:CheckBox ID="checkAll" runat="server" Text="Check All" onclick="checkAll(this);" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkselect" runat="server" onclick="Check_Click(this)" />
<asp:HiddenField ID="id" runat="server" Value='<%#Eval("Vendor_ID")%>' />
</ItemTemplate>
<HeaderStyle Width="8%" />
<ItemStyle VerticalAlign="Top" Width="8%" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Username">
<ItemTemplate>
<asp:Label ID="lblUsername" runat="server" Text='<%#Eval("Username") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:Label ID="lblName" runat="server" Text='<%#Eval("Name") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Email Id">
<ItemTemplate>
<asp:Label ID="lblEmail" runat="server" Text='<%#Eval("Email") %>' />
</ItemTemplate>
</asp:TemplateField>
</asp:GridView>
Whenecer i select some value from multiselect dropdownlist box I get id in a variable selected. As soon as I get ID in a variable selected i want to disable that checkbox in gridview. May i have some suggestions on this! Thank you all
Furthur i tried as below.
This is jquery code to hide checkbox
$('.limitedNumbSelect2').change(function (e) {
selected = $(e.target).val();
`$(".disablechk[Text='selected']").prop("disabled", true);`
This is my checkbox code inside gridview.
<asp:CheckBox ID="chkselect" runat="server" onclick="Check_Click(this)" Text='<%#Eval("Vendor_ID")%>' class="disablechk"/>
I am trying to do whenever i get some value from dropdown slected i want to disable that particular checkbox.
If you are getting comma separated string then split it and make an array
var temp = new Array();
temp = selected.split(",");
then loop through it
$.each(temp, function( index, value ) {
$(".disablechk[Text='" + value + "']").prop("disabled", true);
});
You can loop the GridView HiddenField values and disable the checkbox accordingly.
<script type="text/javascript">
$(function() {
$('.limitedNumbSelect2').change(function (e) {
checkGridView($(e.target).val());
});
});
function checkGridView(selected) {
$('#<%= gdvRegretletter.ClientID %> input[type="hidden"]').each(function () {
if ($(this).val() == selected) {
var checkbox = $(this).prev();
checkbox.prop("disabled", true);
}
});
}
</script>
I have a Rad combo box and a 2 RadGrids - grvUser and grvRole
grvUser RadGrid is as follows...
<telerik:RadGrid ID="grvUser" runat="server" EnableEmbeddedSkins="False" Skin="skn_RadGrid" SkinsDir="|CurrentTheme|/" SkinsPath="|CurrentTheme|/"
OnItemCreated="grvUser_ItemCreated" OnItemCommand="grvUser_ItemCommand" OnItemDataBound="grvUser_ItemDataBound" OnNeedDataSource="grvUser_NeedDataSource" GroupHeaderItemStyle-CssClass="rgGroupPanel">
<MasterTableView TableLayout="Fixed" OverrideDataSourceControlSorting="true" NoMasterRecordsText ="No Records Found, Please Refine Search To Display ">
<Columns>
<telerik:GridBoundColumn FilterControlAltText="Filter column column" DataField="UserId"
UniqueName="UserId" HeaderText="User Id" HeaderStyle-Width="120px" FilterControlWidth="70px"
AutoPostBackOnFilter="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn FilterControlAltText="Filter column column" DataField="UserName" AllowFiltering="true" ShowFilterIcon="true"
UniqueName="UserName" HeaderText="User Name" HeaderStyle-Width="120px" FilterControlWidth="70px"
AutoPostBackOnFilter="true">
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
grvRole RadGrid is as follows...
<telerik:RadGrid ID="grvRole" runat="server" EnableEmbeddedSkins="False" Skin="skn_RadGrid" SkinsDir="|CurrentTheme|/" SkinsPath="|CurrentTheme|/"
OnItemCreated="grvRole_ItemCreated" OnItemCommand="grvRole_ItemCommand" OnItemDataBound="grvRole_ItemDataBound" OnNeedDataSource="grvRole_NeedDataSource" GroupHeaderItemStyle-CssClass="rgGroupPanel">
<MasterTableView TableLayout="Fixed" OverrideDataSourceControlSorting="true" NoMasterRecordsText ="No Records Found, Please Refine Search To Display ">
<Columns>
<telerik:GridBoundColumn FilterControlAltText="Filter column column" DataField="RoleId"
UniqueName="RoleId" HeaderText="Role Id" HeaderStyle-Width="120px" FilterControlWidth="70px"
AutoPostBackOnFilter="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn FilterControlAltText="Filter column column" DataField="RoleName" AllowFiltering="true" ShowFilterIcon="true"
UniqueName="RoleName" HeaderText="Role Name" HeaderStyle-Width="120px" FilterControlWidth="70px"
AutoPostBackOnFilter="true">
</telerik:GridBoundColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
Code for RadComboBox is as follows...
<telerik:RadComboBox ID="ddlType" runat="server" DataValueField="Description"
DataTextField="Description" Text="(Select)" AllowCustomText="True" Width="200px"
OnClientDropDownClosed="onDropDownClosing1" Skin="Default">
<ItemTemplate>
<div onclick="StopPropagation(event)" class="combo-item-template" onmousemove="">
<asp:CheckBox runat="server" ID="chk1" onclick="onStatusChecked(this)" />
<asp:Label runat="server" ID="Label1" AssociatedControlID="chk1">
<%# Eval("Description")%>
</asp:Label>
</div>
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="ChckAll" Text="(Check All)" runat="server" OnClick="checkAllStatus(this)" />
</HeaderTemplate>
</telerik:RadComboBox>
The ddlType RadComboBox contains 2 values. 1 is User and 2 is Role. By default "User" is selected and such that grvUser will be displayed. If the user selects Role, then we need to display grvRole defined in the aspx page.
How can I fire onchange event for RadComboBox and display proper RadGrid either User or Role?
UPDATE
Implementation in jQuery is Ok for me.
Whatever is well conceived is clearly said, And the words to say it
flow with ease.
How to: Show / hide control based on a RadComboBox Value ?
First let's declare a simple RadComboBox with 3 In-line Items :
<telerik:RadComboBox ID="RadComboBox1" runat="server" >
<Items>
<telerik:RadComboBoxItem runat="server" Text="ALL" />
<telerik:RadComboBoxItem runat="server" Text="grvUser" />
<telerik:RadComboBoxItem runat="server" Text="grvRole" />
</Items>
</telerik:RadComboBox>
1/. We now need an event that will be fire every time user choose a "Value".
OnSelectedIndexChanged Will do the trick.
As You talk about a jQuery implementation, here is the documentation RadComboBox event :
Server-side event
Client-side event
NOTE: The SelectedIndexChanged , TextChanged and OnCheckAllCheck events do not fire unless you set the AutoPostBack property to True .
2/.Add the correct event, and some label.
<telerik:RadComboBox ID="RadComboBox1" runat="server" autopostback="True"
OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged" >
<Items>
<telerik:RadComboBoxItem runat="server" Text="ALL" />
<telerik:RadComboBoxItem runat="server" Text="grvUser" />
<telerik:RadComboBoxItem runat="server" Text="grvRole" />
</Items>
</telerik:RadComboBox>
<asp:Label ID="Label1" runat="server" Text="My Control 1(grvUser)" />
<asp:Label ID="Label2" runat="server" Text="My Control 2(grvRole)" />
3/. Lets hide them in code behind
protected void RadComboBox1_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
{
if (e.Text=="ALL")
{
Label1.Visible = true;
Label2.Visible = true;
}
else if (e.Text == "grvUser")
{
Label1.Visible=true;
Label2.Visible=false;
}
else if (e.Text == "grvRole")
{
Label1.Visible = false;
Label2.Visible = true;
}
}
That was a Client-side solution.
Use this to show field-
var agtype = $telerik.$(atCell).text().trim();
if(agtype == ""Guaranty""){{
var masterTableView = sender.get_masterTableView();
var columnIndex = masterTableView.getColumnByUniqueName(""Amount"").get_element().cellIndex;
masterTableView.showColumn(columnIndex);
}}
I am binding a checkbox in gridview with a database field, which stores boolean value i.e. IsRejected. I am trying to make it real time, i.e. if i tick checkbox then it should put 1 in database or 0 , i have tried but no effect. Why ?
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div>
<asp:GridView ID="grdvwRejectedEmployees" runat="server" AutoGenerateColumns="false" Width="100%"
DataKeyNames="EdrID" CssClass="table table-hover table-striped table-bordered"
AllowPaging="true" AllowSorting="true">
<Columns>
<asp:BoundField DataField="EdrID" HeaderText="Edr ID" />
<asp:BoundField DataField="EmployerName" HeaderText="Employer" />
<asp:BoundField DataField="BranchName" HeaderText="Branch" />
<asp:BoundField DataField="EmployeeUniqueID" HeaderText="EmployeeUniqueID" />
<asp:BoundField DataField="EmployeeName" HeaderText="Employee Name" />
<asp:BoundField DataField="PayStartDate" HeaderText="Pay Start Date" />
<asp:BoundField DataField="PayEndDate" HeaderText="Pay End Date" />
<asp:TemplateField HeaderStyle-CssClass="visible-desktop" ItemStyle-CssClass="visible-desktop">
<ItemTemplate>
<asp:CheckBox ID="chkBoxIsRejection" runat="server" Text='<%# Bind("IsRejected") %>' />
</ItemTemplate>
</asp:TemplateField>
<%--<asp:BoundField DataField="IsRejected" HeaderText="Is Rejected" />--%>
</Columns>
</asp:GridView>
</div>
</ContentTemplate>
</asp:UpdatePanel>
.cs
if (!IsPostBack)
{
if (Session["UserCredential"] != null)
{
ClsSystemUser user = (ClsSystemUser)Session["UserCredential"];
ClsSystemUser obj = new ClsSystemUser();
obj = obj.GetOrganizationName(user.Type_ID, user.OfficeID, user.SystemUserID);
int usertypeid = user.Type_ID;
if (usertypeid == 3)
{
//UserTypeID.Text = "Branch";
ClsRejectedFiles RejFiles = new ClsRejectedFiles();
grdvwRejectedEmployees.DataSource = RejFiles.GetRejectedFiles("30411098037111", 3, 1);
grdvwRejectedEmployees.DataBind();
}
like if i tick or untick the checkbox then it doesn't affect the values in database, i.e. if i check then i should put 1 in database IsRejected column or 0 if i uncheck
You are setting the Text property of the Checkbox with the data field value try setting the Checked property so it will set the checkbox value.
<asp:CheckBox
ID="chkBoxIsRejection" runat="server" HeaderText="IsRejection"
Checked='<%#Convert.ToBoolean(Eval("IsRejected")) %>'/>
UPDATE
As OP wanted to update the database on checkbox check chagned. For doing that you need to add the event to tell the page how to react when the checkbox checked changed
You need to add the event CheckedChanged. You can read it here.
<asp:CheckBox
ID="chkBoxIsRejection" runat="server" HeaderText="IsRejection"
Checked='<%#Convert.ToBoolean(Eval("IsRejected")) %>'
AutoPostBack="true" OnCheckedChanged="CheckBox1_CheckedChanged"/>
And then in code behind
protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
{
// write code to save the changes to the database.
}
I have a anchor tag for the updating the row in the gridview. I have set the checkbox in the gridview. When the user checks the checkbox and click on update button the existing row should open in a pop up..
Right now the pop up is opening but not with the checked rows with the existing data. Please see the code for your reference:-
<a id="popup" onclick="div_show()" class="btn btn-success"><i class="fa fa-plus-circle"></i>Add new</a>
</i>Update
Also see the gridview code for your reference:-
<asp:GridView ID="grdCSRPageData" runat="server" Width="100%" border="1" Style="border: 1px solid #E5E5E5;" CellPadding="3"
AutoGenerateColumns="False" OnDataBound="grdCSRPageData_DataBound" AllowPaging="true" CssClass="hoverTable" EmptyDataText="No Records Found"
OnPageIndexChanging="grdCSRPageData_PageIndexChanging" DataKeyNames="Id" OnRowDeleting="grdCSRPageData_RowDeleting"
PageSize="5" ShowFooter="true" OnRowEditing="grdCSRPageData_RowEditing" OnRowUpdating="grdCSRPageData_RowUpdating"
OnRowCancelingEdit="grdCSRPageData_RowCancelingEdit">
<AlternatingRowStyle CssClass="k-alt" BackColor="#f5f5f5" />
<Columns>
<asp:TemplateField HeaderText="Select" HeaderStyle-Width="5%" HeaderStyle-CssClass="k-grid td">
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="false" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="page_title" HeaderText="Page Title" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="page_description" HeaderText="Page Description" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="meta_title" HeaderText="Meta Title" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="meta_keywords" HeaderText="Meta Keywords" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="meta_description" HeaderText="Meta Description" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="Active" HeaderText="Active" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:TemplateField HeaderText="Action" HeaderStyle-Width="15%" HeaderStyle-CssClass="k-grid td">
<ItemTemplate>
<asp:ImageButton ID="btnDelete" AlternateText="Delete" ImageUrl="~/images/delete.png" runat="server" Width="15" Height="15" CommandName="Delete" CommandArgument='<%# Eval("Id") %>' CausesValidation="false" OnClientClick="return confirm('Are you sure you want to delete this record?')" />
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField ButtonType="Image" ItemStyle-Width="15" EditImageUrl="~/images/edit.png" ShowEditButton="True" ControlStyle-Width="15" ControlStyle-Height="15" CancelImageUrl="~/images/close.png" UpdateImageUrl="~/images/update.png">
<ControlStyle Height="20px" Width="20px"></ControlStyle>
</asp:CommandField>
</Columns>
</asp:GridView>
Please help, its been since two days I am stucked but couldn't cracked it.
Code for binding the gridview:-
private void BindGrid()
{
string strQuery = "select Id,page_title,page_description,meta_title,meta_keywords,meta_description,Active from tbl_Pages ORDER By Id DESC";
SqlCommand cmd = new SqlCommand(strQuery);
DataTable dt = GetData(cmd);
grdCSRPageData.DataSource = dt;
grdCSRPageData.DataBind();
}
Also see the Page_load method;-
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGrid();
}
}
You can try this using the AjaxControlToolKit.
In your GridView place this event handler:
OnRowCommand="grdCSRPageData_RowCommand"
Place this after your GridView:
<asp:UpdatePanel ID="upModal" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="pnlModal" runat="server" BorderWidth="1" Style="display:none;">
<table>
<tr>
<td>page_title</td>
<td><asp:TextBox ID="txtPageTitle" runat="server" /></td>
</tr>
<tr>
<td>page_description</td>
<td><asp:TextBox ID="txtPageDescription" runat="server" /></td>
</tr>
</table>
<asp:Button ID="btnOK" runat="server" Text="OK" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:Button ID="btnModal" runat="server" Style="display:none;"/>
<ajaxToolkit:ModalPopupExtender ID="mpe" runat="server" PopupControlID="pnlModal" TargetControlID="btnModal" OkControlID="btnOK" CancelControlID="btnCancel" />
In code behind:
protected void grdCSRPageData_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "Edit")
{
GridViewRow gvRow = grdCSRPageData.Rows[Convert.ToInt32(e.CommandArgument)];
txtPageTitle.Text = gvRow.Cells[0].Text;
txtPageDescription.Text = gvRow.Cells[1].Text;
upModal.Update();
mpe.Show();
}
}
protected void grdCSRPageData_RowEditing(object sender, GridViewEditEventArgs e)
{
grdCSRPageData.EditIndex = -1;
BindGrid();
}
I think you don't need to check which row you want to edit, you already have a CommandField in your GridView. You just click on the edit image and the modal popup gets populated with the data from the GridView (from the row you are editing).
Here is a solution using ajax. When you check a checkbox and click on update button jquery code will look for selected checkbox in gridview and when it finds this will assign values to textboxes which will be in popup.
Also you have to store id in hidden field on the basis of which update query will run or you can use any field on which update will happen.
Now when you click on update button in popup an ajax call will be sent which will take updated values from textboxes and send to webmethod.
In webmethod you will run your update query.And when ajax executes successfully you will empty the values of textboxes in popup and reload the page to see changes in gridview.
Html of popup
<div id="Popup">
<table>
<tr>
<td>
Category
</td>
<td>
<input type="text" id="Category" />
</td>
</tr>
<tr>
<td>
Items
</td>
<td>
<input type="text" id="items" />
</td>
</tr>
<tr>
<td>
<input type="button" value="Update" onclick="Openselected()" />
</td>
<td><input type="hidden" id="hdnID" /></td>
</tr>
</table>
</div>
This is not shown as popup but you can use any plugin to show it in popup like blockui,fancybox jqueryui dialog or any one available.
Jquery Code
This function will assign values of selected row in textboxes and open popup.
function Openselected()
{
$('table[id$=grdTest] tr').each(function () {
if ($(this).find('input[type=checkbox]').is(':checked')) {
$('#Category').val($(this).children('td').eq('02').text());
$('#items').val($(this).children('td').eq('03').text());
$('#hdnID').val($(this).children('td').eq('01').text());
}
});
}
This function will send ajax call with updated values to webmethod and on success empty textboxes of popup and reload page to see changes
function UpdateGrid()
{
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/UpdateDB",
data: JSON.stringify({ category:$('#Category').val() , items: $('#items').val(),id:$('#hdnID').val() }),
dataType: "json",
async: false,
success: function (data) {
$('#Category').val("");
$('#items').val("");
$('#hdnID').val("");
window.location.reload(true);
},
error: function (err) {
alert(err.responseText);
}
});
}
Here is webmethod
[WebMethod]
public static string UpdateDB(string category, string items,int id)
{
//Your logic of updating db.Here i am updating on basis of id you can use any feild of your choice
return "success";
}
This is only for one row as per your requirement.
Check for the rows got selected from gridview in RowDataBound method. Selected rows or in your case check marked rows can be grabed in this method.
Their are lots of references available here.. you can use one
How to check if any row is selected from GridView?
you can take a look at this may be you can use modelpopupextender provided by ajaxcontroltoolkit
go through the ASP.NET How to show AjaxControlToolkit Modal Popup from CheckBox
you can use telerik grid which automatically allow the insertion and editing in form .
<MasterTableView EditMode="PopUp" CommandItemDisplay="Top"><CommandItemSettings ShowAddNewRecordButton="true" ShowRefreshButton="true" />
See Telerik Demo
http://demos.telerik.com/aspnet-ajax/grid/examples/overview/defaultcs.aspx
I have a drop down list. On changing the index of the dropdownlist , I populate an asp.net gridview.
I have a requirement where the user should be able to remove individual rows of the gridview on the screen .
At the end of each row, I intend to have a remove button. On clicking the button the row should
disappear . But this should be only on the screen. There should be no changes done in the database.
I have my code below right now :
aspx
<table>
<tr>
<td>
<div>
<asp:Label ID="lblClient" runat="server" Text="Client :" CssClass="label" ForeColor="Black"></asp:Label>
<asp:DropDownList ID="ddlClient" runat="server" AppendDataBoundItems="true" AutoPostBack="true" OnSelectedIndexChanged="ddlClient_SelectedIndexChanged">
<asp:ListItem Text="ALL" Value="0"></asp:ListItem>
</asp:DropDownList>
</div>
</td>
</tr>
<tr>
<td>
<asp:GridView ID="gvMainLog" runat="server" Visible="true" AllowSorting="True" AutoGenerateColumns="False"AllowPaging="true">
<Columns>
<asp:BoundField DataField="Instruction" HeaderText="Instruction" />
<asp:BoundField DataField="ProviderId" HeaderText="Id" />
</Columns>
</asp:GridView>
<div>
<asp:TextBox ID="txtEditMin" runat="server"></asp:TextBox>
</div>
</td>
</tr>
</table>
aspx.cs
protected void ddl_SelectedIndexChanged(object sender, EventArgs e)
{
gvMainLog.DataSource = GetSetupUtility(1);
gvMainLog.DataBind();
}
In the GridView add the remove command like this
<Columns>
<asp:BoundField DataField="Instruction" HeaderText="Instruction" />
<asp:BoundField DataField="ProviderId" HeaderText="Id" />
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:Button ID="Button1" runat="server" CausesValidation="false" CommandName="Remove"
Text="Remove" CommandArgument='<%# Eval("id") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
In the action of the remove button use the DeleteRow method
void gvMainLog_RowCommand(Object sender, GridViewCommandEventArgs e)
{
if(e.CommandName=="Remove")
{
var id = Int32.Parse(e.CommandArgument);
gvMainLog.DeleteRow(id);
}
}
You need somthing like this:
Use TemplateField in gridview.
<script>
function deleteRow(rowId) {
$("#" + rowId).remove();
}
</script>
<asp:GridView ID="GridView1" runat="server" EnableModelValidation="True">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<div id='<%# "myRow" + Container.DataItemIndex %>'> contents <img src="deleteImageUrl" onclick='<%# "deleteRow(\"myRow" + Container.DataItemIndex+"\")" %>'/> </div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>