Gridview Doesn't Refresh After CheckedChanged? - asp.net

Question

I have a gridview with Template field. I add a checkbox in templatefield . Autopostback is true for checkbox .
I fill grid in Load-page and creted column dynamic .
if (!IsPostBack)
{
FillGrid();
}
I use update panel
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<SharePoint:SPGridView ID="grid" AllowSorting="true" AllowFiltering="true" CssClass="ms-listviewtable"
runat="server" AutoGenerateColumns="false">
<RowStyle CssClass="ms-alternating" Height="10px" />
<Columns>
<asp:TemplateField>
<ItemTemplate >
<asp:CheckBox ID="select" runat="server"
OnCheckedChanged="select_CheckedChanged" AutoPostBack="true" />
<input id="Display" type="hidden" runat="server" />
<input id="itemID" type="hidden" runat="server" />
<asp:Image ID="icon" runat="server" Height="10px" Visible="false" />
</ItemTemplate>
<ItemStyle Width="35px" />
</asp:TemplateField>
<asp:TemplateField >
</asp:TemplateField>
</Columns>
</SharePoint:SPGridView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="select" EventName="OnCheckedChanged" />
</Triggers>
</asp:UpdatePanel>
but show error :A control with ID 'select' could not be found for the trigger in UpdatePanel 'UpdatePanel1'.
My problem is : When checkbox is change, page refresh
I don't want to refresh page after checkedchange!

Answer 1

you have to set autopostback="false" or remove autopostback property in checkbox. autopostback actully refresh the page.

Answer 2

So what happens if you set the autopostback property of the checkbox to false?
Also if you are actually looking to handle the onchange event of the checkbox you could wrap the grid with an UpdatePanel; the user wouldn't see a postback but you still get the flexibility of serverside event handling.

Answer 3

First of all you need changes templetecolumn as below
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkselect" runat="server" />
<input id="Display" type="hidden" runat="server" />
<input id="itemID" type="hidden" runat="server" />
<asp:Image ID="imgicon" runat="server" Height="10px" Style="display: none;" ImageUrl="~/images/arrow_left.jpg" />
</ItemTemplate>
<ItemStyle Width="35px" />
</asp:TemplateField>
Now handle itemdatabound event in server side code
Protected Sub SPGridView_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvBanner.RowDataBound
If e.Row.RowType = DataControlRowType.DataRow Then
Dim chkselect As CheckBox = e.Row.FindControl("chkselect")
Dim imgicon As Image = e.Row.FindControl("imgicon")
If chkselect IsNot Nothing Then
chkselect.Attributes.Add("onclick", "javascript:DoMyTask(this,'" + imgicon.ClientID + "')")
End If
End If
End Sub
Now specify JavaScript function in aspx page as below.
<script type="text/javascript" language="javascript">
function DoMyTask(obj, imgid) {
var objCheck = obj.checked;
var objimg = document.getElementById(imgid)
if (objCheck == true) {
objimg.style.display = "block";
//set more attributes over here
}
else {
objimg.style.display = "none";
//set more attributes over here
}
var count = $(":checkbox:checked").length;
alert('you have selected ' + count + ' Rows');
}
</script>
Hope this will help you...happy coding ..