Button ClickEvent is not triggered - asp.net

Afternoon All,
I have two buttons on my web page that is used to lock and unlock a web page so that a user can lock the page and edit this without other users being able to access the record and then unlock this record so other users can edit this.
The problem i have is that the buttons doesnt work and im not to sure why. I am using image buttons but it looks like the event is not being triggered, i cant see the problem and its driving me crazy. Can some one please take a look at my code...
<asp:ImageButton ID="btnLock" runat="Server"
AlternateText="Click to lock record" ImageUrl="~/images/lock.png" />
<asp:ImageButton ID="btnUnlock" runat="Server"
AlternateText="Click to unlock record" ImageUrl="~/images/unlock.png" />
<asp:Label ID="lblUserName" runat="server" Font-Bold="True" Font-Size="Medium"
ForeColor="#CC3300"></asp:Label>
<asp:HiddenField ID="hdnIsLockedBy" runat="server" />
'VB Code for lock button...
Protected Sub btnLock_Click(sender As Object, e As System.EventArgs) Handles btnLock.Click
Dim lock As New WeeklyClass
'Check that the Loggedby field is set to null so the user can then lock the record
If String.IsNullOrEmpty(lock.LockedBy) Then
'lock and add the username
lock.LockedBy = User.Identity.Name
'global variable islockedby
hdnIsLockedBy.Value = User.Identity.Name
'AgendaID required as part of the stored procedure
lock.AgendaID = Integer.Parse(lblAgendaNumber.Text)
End If
'Save to the database using the Class DAL and the Stored Procedure
WeeklyClassDAL.LockWeeklyAgenda(lock)
'Display buttons as expected result
btnLock.Visible = False
btnUnlock.Visible = True
' Refreshes fields on the page
Response.Redirect("~/WeeklyAgenda.aspx?Edit=" & lblAgendaNumber.Text)
End Sub
'VB Code for unlock button...
Protected Sub btnUnlock_Click(sender As Object, e As System.EventArgs) Handles btnUnlock.Click
Dim unlock As New WeeklyClass
' Check to see if the system has a username
If hdnIsLockedBy.Value = User.Identity.Name Then
'set the lockedby field to null
unlock.LockedBy = hdnIsLockedBy.Value
'pass the relevent agendaid
unlock.AgendaID = Integer.Parse(lblAgendaNumber.Text)
End If
' save to the database using the Class DAL
WeeklyClassDAL.unLockWeeklyAgenda(unlock)
'Display buttons as expected result
btnLock.Visible = True
btnUnlock.Visible = False
' Refreshes fields on the page
Response.Redirect("~/WeeklyAgenda.aspx?Edit=" & lblAgendaNumber.Text)
End Sub
Any help is much appriechiated. I have been looking at this for ages and cant seem to find the issue.
Regards
Betty

You have not subscribed to the click event. Your control does not know that it has to call those functions when a user clicks them.
Subscribe to those events as follows:
<asp:ImageButton ID="btnLock" runat="Server"
AlternateText="Click to lock record" ImageUrl="~/images/lock.png"
OnClick="btnLock_Click" />
<asp:ImageButton ID="btnUnlock" runat="Server"
AlternateText="Click to unlock record" ImageUrl="~/images/unlock.png"
OnClick="btnUnloc_Click />

You need to specify the Click event in your buttons.
OnClick="Button1_Click"
So your buttons should be:
<asp:ImageButton
ID="btnLock"
runat="Server"
AlternateText="Click to lock record"
ImageUrl="~/images/lock.png"
OnClick="btnLock_Click" />
<asp:ImageButton
ID="btnUnlock"
runat="Server"
AlternateText="Click to unlock record"
ImageUrl="~/images/unlock.png"
OnClick="btnUnloc_Click />

You need to add autopostback="true" to the buttons:
<asp:ImageButton ID="btnLock" runat="Server" autopostback="true"
AlternateText="Click to lock record" ImageUrl="~/images/lock.png" />
Otherwise the code behind will not be triggered.

Related

How to add new line items in a APS.net webform and submit to database

Please note: I do not necessarily need working code. I just don't know how to word what I am looking for to even find an answer on the web. I guess i'm just asking for a little guidance on what kind of control I would to use to accomplish my goal.
Basically when I go to a job site I will use different amounts and types of inventory. So one line item would consist of
Item Description
Quantity Used
UsedByTech
I'm collecting these via webform text box. I would like to have a button that says "Add" and then allows me to input another line item, and so on.
Then at some point a submit button on the form would gather those line items and input them in to a MSSQL databse.
I'm currently using ASP.Net framwork and webforms.
Can somone please tell me what kind of control would allow this a may be give me some hints about what to search for?
Ok, this is actually quite easy - but we let asp.net do most of the work for us.
So, we assume we have these two tables:
so, we have a table to list out the Job Sites
And then as per above, we have a table to list out the Job items for each site.
Ok, so we display the Job Sites.
Drop in a Gridview - build it using the wizards:
Now, blow out (delete) the data source from the page - don't need it.
Remove the DataSource setting for the Gridview
And lets drop in a plane jane button into that grid.
Thus, this markup - most of it was generated for me
<div style="padding:25px">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataKeyNames="ID" CssClass="table" Width="40%">
<Columns>
<asp:BoundField DataField="JobSite" HeaderText="JobSite" />
<asp:BoundField DataField="JobDate" HeaderText="JobDate" DataFormatString="{0:yyyy-MM-dd}" />
<asp:BoundField DataField="Foreman" HeaderText="Foreman" />
<asp:BoundField DataField="Description" HeaderText="Description" />
<asp:TemplateField HeaderText="View">
<ItemTemplate>
<asp:Button ID="cmdView" runat="server" Text="View Job" CssClass="btn"
Onclick="cmdView_Click"/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
And our code to load this grid is thus this:
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
LoadGrid
End If
End Sub
Sub LoadGrid()
GridView1.DataSource = MyRst("SELECT * from JobSites Order by JobDate")
GridView1.DataBind()
End Sub
Ok, we now have this:
Ok, so now we need to wire up that "view" button.
So, we grab the PK row value - jump to our edit items page;
Protected Sub cmdView_Click(sender As Object, e As EventArgs)
Dim btn As Button = sender
Dim gRow As GridViewRow = btn.Parent.Parent
' get PK database ID
Dim PK As Integer = GridView1.DataKeys(gRow.RowIndex).Item("ID")
' Now jump to our job add job items page
Session("JobID") = PK
Response.Redirect("JobAddItems.aspx")
End Sub
So, now we need to build our 2nd page.
I could use a repeater - but I used DataList - to display the ONE job.
I again used the wizards - then blow out the DataSource setting and item on that page.
We then drop in a gridview for the "many" items (the job items).
I now have this:
<br />
<div style="border:solid;border-color:black;width:20%">
<asp:DataList ID="DataList1" runat="server" DataKeyField="ID">
<ItemTemplate>
JobSite:
<asp:Label ID="JobSiteLabel" runat="server" Text='<%# Eval("JobSite") %>' Font-Size="Larger" Font-Bold="true" />
<br />
JobDate:
<asp:Label ID="JobDateLabel" runat="server" Text='<%# Eval("JobDate", "{0:yyyy-MM-dddd}") %>' />
<br />
Foreman:
<asp:Label ID="ForemanLabel" runat="server" Text='<%# Eval("Foreman") %>' />
<br />
Description:
<asp:Label ID="DescriptionLabel" runat="server" Text='<%# Eval("Description") %>' />
<br />
<br />
</ItemTemplate>
</asp:DataList>
<br />
</div>
<br />
<div style="float:left">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataKeyNames="ID" CssClass="table borderhide" Width="30%">
<Columns>
<asp:TemplateField HeaderText="Description">
<ItemTemplate>
<asp:TextBox id="txtDesc" runat="server" Text='<%# Eval("ItemDescription") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Qty">
<ItemTemplate>
<asp:TextBox id="txtQty" runat="server" Text='<%# Eval("Qty") %>' TextMode="Number" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Used By">
<ItemTemplate>
<asp:TextBox id="txtUsedBy" runat="server" Text='<%# Eval("UsedBy") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<div style="float:right">
<asp:Button ID="cmdAdd" runat="server" Text="Add Item" CssClass="btn" style="margin-top:-20px" />
</div>
</div>
<div style="clear:both"></div>
<asp:Button ID="cmdSave" runat="server" Text="Save" CssClass="btn" />
<asp:Button ID="cmdCancel" runat="server" Text="Cancel" CssClass="btn" style="margin-left:40px"/>
</div>
Ok, and the code to load this up is this:
We load up the main record - just for display, and then the GridView of child items.
Dim rstJobItems As New DataTable
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
ViewState("JobID") = Session("JobId")
LoadData()
Else
rstJobItems = ViewState("JobItems")
End If
End Sub
Sub LoadData()
DataList1.DataSource = MyRst("SELECT * from JobSites WHERE ID = " & ViewState("JobID"))
DataList1.DataBind()
rstJobItems = MyRst("SELECT * FROM JobItems where Job_ID = " & ViewState("JobID"))
GridView1.DataSource = rstJobItems
GridView1.DataBind()
ViewState("JobItems") = rstJobItems
End Sub
Ok, so now on the first page, when we click on a row, we jump to the 2nd page, and we see/have this:
So we need to wire up the button to add a new row.
That code looks like this:
Protected Sub cmdAdd_Click(sender As Object, e As EventArgs) Handles cmdAdd.Click
' user might have done some edits
GridToTable()
' create a new row
Dim NewRow As DataRow = rstJobItems.NewRow
NewRow("Job_id") = ViewState("JobID")
NewRow("Qty") = 0
rstJobItems.Rows.Add(NewRow)
GridView1.DataSource = rstJobItems
GridView1.DataBind()
End Sub
So, say in above, I click the add row, then you will see this:
(in fact I clicked it two times).
Ok, so you are free to tab around - edit data in that grid. You can edit/change existing rows, or add a new row and simple tab around and enter data.
So, now lets wire up the Save button. That save button has to allow and deal with editing rows - and also saving edits - all in ONE shot to the database.
The code for save button is thus this:
Protected Sub cmdSave_Click(sender As Object, e As EventArgs) Handles cmdSave.Click
GridToTable()
Using conn As New SqlConnection(My.Settings.TEST4)
Using cmdSQL As New SqlCommand("SELECT * FROM JobItems WHERE ID = 0", conn)
Dim da As New SqlDataAdapter(cmdSQL)
Dim daU As New SqlCommandBuilder(da)
da.Update(rstJobItems)
End Using
End Using
' data add, and any edit now saved - return to our job site listing page
Response.Redirect("JobSites.aspx")
End Sub
So we send grid to table, and then in ONE database update, send the table back to the database.
Of course after we save, we return back to our first page with the grid now read to edit more.
So, the other routine used in above was sending the Grid (rows) back to the table.
That code is this:
Sub GridToTable()
For Each gRow As GridViewRow In GridView1.Rows
Dim OneRow As DataRow = rstJobItems.Rows(gRow.RowIndex)
OneRow("ItemDescription") = CType(gRow.FindControl("txtDesc"), TextBox).Text
OneRow("Qty") = CType(gRow.FindControl("txtQty"), TextBox).Text
OneRow("UsedBy") = CType(gRow.FindControl("txtUsedBy"), TextBox).Text
Next
End Sub
And of course the cancel button? Well, if you add some rows, or just edit the rows, and hit cancel? Well, we don't save - but just return to the previous page.
eg:
Protected Sub cmdCancel_Click(sender As Object, e As EventArgs) Handles cmdCancel.Click
Response.Redirect("JobSites.aspx")
End Sub
And last but not least, I have a "general" helper routine that simple returns a data table - and I used it several times in above. That routine kind of gives me a FoxPro or MS-Access like ability to get a data table with great ease (in place of typing that same code over and over).
That routine was this:
Public Function MyRst(strSQL As String) As DataTable
Dim rstData As New DataTable
Using conn As New SqlConnection(My.Settings.TEST4)
Using cmdSQL As New SqlCommand(strSQL, conn)
conn.Open()
rstData.Load(cmdSQL.ExecuteReader)
End Using
End Using
Return rstData
End Function
So the above is quite much start to finish. It is of course quick code, and done rather fast/quick for stack overflow. But it is full of great ideas, and as noted, I let the wizards generate most of the markup. (but then remove the data source from the GV, and also the Data source item that gets created in the page.
So in summary:
I did not write most of that markup - I let the wizards generate most of it.
Note how SMALL and relative simple the code bits were. we broke up this into bite sized parts - thus each routine is not a lot of code.
We ALSO let .net built the sql update (and insert) commands for us. this eliminated BOAT LOADS of parameters, and BOATLOADS of work to wire that up. And it also MUCH better for performance, since ado.net is smart - for rows not changed - it don't send the updates to sql server.
Note also how ONE simple update method of
da.Update(rstJobItems)
Handles BOTH edits/updates, an inserts with one command. And we probably could/should drop in a delete row button - and the update would also handle that for us too!!!
So, there is a LOT of great ideas in above, but key concepts are:
Leverage as much as you can the wizards, and built in controls.
Leverage the ability of ado.net to update a table of edits in ONE shot back to the database - and as above shows, SAME single update also works for both inserts and updates at the same time.

CausesValidation=False but client side validation still occuring (controls generated in code behind)

I have an asp.net webform with static content (layout, fields, etc.) that creates a set of (image)buttons in code behind. I have required field validators and custom validators on my static content. Even though I'm setting CausesValidation on my new buttons, when clicked the page isn't posted back due to client validation issues.
The buttons are created as part of a sepearte button click event (i.e. not as part of the page load event).
Private Sub CreateButtons_Click(sender As Object, e As EventArgs)
Dim Btn As New ImageButton()
Btn.ID = "Something"
Btn.ImageUrl = "/Images/Something.png"
Btn.CausesValidation = False
AddHandler Btn.Click, AddressOf Btn_Click
ControlToAddTo.Controls.Add(Btn)
End Sub
Private Sub Btn_Click(sender As Object, e As EventArgs)
'Do something
End Sub
I could turn off the client validation to solve this but I don't want to lose that functionality preventing unneccesary round trips to the server to validate. I've tried creating buttons in the page onload event and these work fine so I presume as part of the page lifecycle, client validation is initiated after the onload but before any element events are fired.
What's the best way to get CausesValidation=false to actually work...?
Edit: Example of the other aspx content on the page (fields and validators):
Date of Birth:
<asp:RequiredFieldValidator ID="RFV_DOB" runat="server" ControlToValidate="DOB" Text=" *" ErrorMessage="Date of Birth is a required field" CssClass="Validation" ValidationGroup="Main" />
<asp:CompareValidator ID="CV_DOB" runat="server" ControlToValidate="DOB" Operator="DataTypeCheck" Type="Date" Text=" *" ErrorMessage="DOB must be enterred in date format" CssClass="Validation" ValidationGroup="Main" />
<asp:TextBox ID="DOB" runat="server" CssClass="ST_I" MaxLength="10" />
Gender:
<asp:RequiredFieldValidator ID="RFV_Gender" runat="server" ControlToValidate="Gender" Text=" *" ErrorMessage="Gender is a required field" CssClass="Validation" ValidationGroup="Main" />
<asp:DropDownList ID="Gender" runat="server" CssClass="ST_I">
<asp:ListItem Selected="True" />
<asp:ListItem Text="Female" Value="F" />
<asp:ListItem Text="Male" Value="M" />
<asp:ListItem Text="Transgender" Value="T" />
<asp:ListItem Text="Other" Value="O" />
</asp:DropDownList>
<asp:Button ID="Send" runat="server" Text="Send Message" style="margin: 20px;" ValidationGroup="Main" />
Figured it out. I don't think it was client validation I was seeing either. I'd confused it for that because my server side onclick wasn't being reached. However the problem was actually with recreating my dynamic controls (I.e. the image buttons) on subsequent postbacks - in particular here, the postback initiated by the user clicking the button. It actually bypassed client validation but as I wasn't recreating the buttons on postback it didn't know that the button causing the postback was set to CausesValidation=false so server validation fired. It wasn't hitting the onclick because, again, it hadn't been recreated so didn't know the button causing the postback had an event handler.
Tip of the day, always recreate your dynamic controls on postback!

formview textbox control textchanged event will not fire

I need help in VB (no C# or Javascript, please -- I'm clueless with those languages)
I have also checked all the "questions that may already have your answer -- and those that were in VB didn't match my situation or were resolved by using AutoPostback,coding a textChanged event, or adding ontextchanged= to the textbox field --- I have all of these in my code already.
I can't seem to get the TextChanged event to fire despite setting the AutoPostBack to true.
Even after creating at submit button it still won't fire, what have I left out?
What I'm trying to accomplish:
I want the Finish Date to set to a date 30 days after the Start Date if and only if the user edits a start date.
Otherwise just display in the Finish Date whatever would have originally displayed there.
Both dates are allowed to be null in the database and both are defined as datetime.
In Default.aspx
<asp:FormView ID="FormView1" runat="server" DataKeyNames="MASTERID_Action"
DataSourceID="srcAction">
<EditItemTemplate>
MASTERID_Action:
<asp:Label ID="MASTERID_ActionLabel1" runat="server"
Text='<%# Eval("MASTERID_Action") %>' />
<br />
Action_StartDate:
<asp:TextBox ID="Action_StartDateTextBox" runat="server"
Text='<%# Bind("Action_StartDate") %>'
ontextchanged="Action_StartDateTextBox_TextChanged" AutoPostBack="True" /> <rjs:PopCalendar ID="StartDateCal" runat="server" Control="Action_STartDateTextBox" />
<br />
Action_FinishDate:
<asp:TextBox ID="Action_FinishDateTextBox" runat="server"
Text='<%# Eval("Action_FinishDate") %>' />
<br />
<asp:Button ID="SubmitButton1" runat="server" Text="Refresh"
onclick="SubmitButton1_Click" />
<asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True"
CommandName="Update" Text="Update" />
<asp:LinkButton ID="UpdateCancelButton" runat="server"
CausesValidation="False" CommandName="Cancel" Text="Cancel" />
</EditItemTemplate>
In Default.aspx.vb
Partial Class _Default
Inherits System.Web.UI.Page
Protected Sub Action_StartDateTextBox_TextChanged(sender As Object, e As System.EventArgs)
Dim txtStartDate As TextBox = Me.FormView1.FindControl("Action_StartDateTextBox")
Dim txtFinishDate As TextBox = Me.FormView1.FindControl("Action_finishdatetextbox")
Dim strNewFinishDate As String
If txtFinishDate.Text = "" And txtStartDate.Text <> "" Then
strNewFinishDate = Convert.ToString(Convert.ToDateTime(txtStartDate).AddDays(30))
ElseIf txtFinishDate.Text <> "" Then
strNewFinishDate = txtFinishDate.Text
Else
strNewFinishDate = ""
End If
txtFinishDate.Text = strNewFinishDate
End Sub
Protected Sub SubmitButton1_Click(sender As Object, e As System.EventArgs)
Dim mytest As String
End Sub
End Class
16/01/2013 edit: had a typo in Protected Sub Action_StartDateTextBox_TextChanged ran the page but it still doesn't fire. Still need help with this, please.
17/01/2013 edit: My question is still unanswered, the response I did receive caused more errors. Please help.
I think you might have been deleted your controls after writing its corresponding events.If so, as a result it will remove all the handlers that you had specified with the events.
'---This is your code, by the way it seems to be missing its handler
... Action_StartDateTextBox_TextChanged(sender As Object, e As System.EventArgs)
try to add its handler like this,
'---Adding hanler
... Action_StartDateTextBox_TextChanged(sender As Object, e As System.EventArgs) Handles Action_StartDateTextBox.TextChanged
If you need more details regarding Event Handler, Just refer this.
No response on this, but I have to keep moving. So, I have chosen what is probably the smarter route -- to take care of my postbacks as client-side javascript. I would have accepted an answer of "asp.net can't do this. Javascript would make your life so much easier" for this issue....

Placing ASP.Net DetailsView into Edit mode and Update mode

We are working with an ASP.Net DetailsView with a VB.Net code-behind file. We are trying to allow the user to edit and save changes in the DetailsView by allowing the user to click the Edit button and then click the Update button.
Nothing happens when the user clicks the Edit button so we added an OnClick handler for the Edit button. The DetailsView will go into edit mode but only if the user clicks the Edit button twice. (Maybe an ASP.Net bug?)
Once the DetailsView is in Edit mode the Update and Cancel buttons are displayed as expected but nothing happens when the user clicks either of those buttons. We placed an OnClick on the Update button in an attempt to force the DetailsView to Update but the only choices for .ChangeMode(DetailsViewMode. are Edit, Insert, ReadOnly.
I also thought DetailsViews did not need additional OnClicks unless we needed to perform special handling.
Here is the markup for the DetailsView:
<asp:DetailsView
ID="DetailsView"
runat="server"
Height="50px"
Width="218px" AutoGenerateRows="False">
<Fields>
<asp:TemplateField ShowHeader="False">
<EditItemTemplate>
<asp:Button ID="ButtonUpdate" runat="server" CausesValidation="True"
CommandName="Update" Text="Update" OnClick="ButtonUpdate_Click" />
<asp:Button ID="ButtonCancelUpdate" runat="server" CausesValidation="False"
CommandName="Cancel" Text="Cancel" />
</EditItemTemplate>
<ItemTemplate>
<asp:Button ID="ButtonEdit" runat="server" CausesValidation="False"
CommandName="Edit" Text="Edit" OnClick="ButtonEdit_Click"/>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Forename" HeaderText="First Name:" />
</Fields>
</asp:DetailsView>
Here is the coding in the code-behind file:
Public Class StudentDetailsMaintenance
Inherits System.Web.UI.Page
Dim theTableAdapter As New DataSetSingleStudentTableAdapters.StudentsMaintenanceTableAdapter
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
' Load the data from the database into the DetailsView.
'------------------------------------------------------
DetailsView.DataSource = theTableAdapter.GetDataByStudentID(StudentMaintenance.IntStudentID)
DetailsView.DataBind()
End Sub
Protected Sub ButtonEdit_Click(sender As Object, e As EventArgs)
' Place the DetailsView into Edit mode.
'--------------------------------------
DetailsView.ChangeMode(DetailsViewMode.Edit)
End Sub
Protected Sub ButtonUpdate_Click(sender As Object, e As EventArgs)
' Place the DetailsView into Update mode.
'----------------------------------------
DetailsView.ChangeMode(DetailsViewMode.)
End Sub
End Class
The ButtonUpdate_Click routine is incomplete because we don't know how to get the DetailsView to do the update.
Addional Note:
This is the first time we are trying to do a DetailsView by not setting up a DataSource in the markup. Instead of doing that we are using the data from a DataSet TableAdapter created in the DataSet designer.
If we did the DetailsView along with the DataSource all in the markup then the Edit and Update buttons work without any problem. We were also doing this in an attempt to eliminate extra coding if possible.
If you want the DetailsView's automatic behaviour for Edit, you need to use a CommandField to show the Edit button:
<asp:DetailsView id="dvDetailsView" runat="server" DataSourceId="sqlDS" DataKeyNames="primaryKey">
<Fields>
<asp:CommandField ButtonType="Button" ShowEditButton="true" />
</Fields>
</asp:DetailsView>
As noted above you need to include the DataKeyNames property to specify the primary key for the datasource so that ASP.NET knows which record in the data source to update. Also as mentioned above, you need to make sure that the Bind("columnName") statements use the same field names as used in your data store.
Also, make sure that you provide an UpdateCommand in your SqlDataProvider (or equivalent for your data store) so that the update can take place.
Now when you place the DetailsView into Edit mode, the Update and Cancel buttons will automatically be displayed where the is. If you need to do some work with the data before the data is updated in the data store, then handle the DetailView's ItemUpdating event in the code behind.
Well, looking real briefly, try wrapping your Page_Load databind in an If Not Page.IsPostback.
Postback wreaks havoc on databound controls.

Remove tick/check box from ASP.NET Checkbox control

I have this CheckBoxList control and to each ListItem of it, have set the Text property to the img HTML tag so it displays an image.
I am trying to remove the tick/check box from the checkboxes of a ASP.NET CheckBoxList control when i click on each item.
My code does this. Every time i click on some check box, the SelectedIndexChanged event fires up and it does some saving of some data in my database. And when the saving is done and the page is refreshed i want to check/tick box of the checkbox item that was clicked not to be there anymore and the checkbox to be disabled cause i don't want the user to able able to click it again. I have tried to tried to set the Enable and Selected properties to False, and also add an attribute to the CheckboxList control, but without success. Here is my code.
<asp:CheckBoxList ID="Services" runat="server" RepeatColumns="5" CellPadding="10"
CellSpacing="15" RepeatLayout="Table"
Font-Size="Large" RepeatDirection="Vertical" TextAlign="Right"
AutoPostBack="true" EnableViewState="true">
<asp:ListItem Value="Facebook" Text="<img src='/ServiceIcons/facebook.png'
title='Facebook' />" />
<asp:ListItem Value="Googleplus" Text="<img src='/ServiceIcons/googleplus.png'
title='Google+' />" />
<asp:ListItem Value="LinkedIn" Text="<img src='/ServiceIcons/linkedin.png'
title='LinkedIn' />" />
<asp:ListItem Value="RSS" Text="<img src='/ServiceIcons/rss.png' title='RSS' />" />
<asp:ListItem Value="Skype" Text="<img src='/ServiceIcons/skype.png' title='Skype' />"
/>
</asp:CheckBoxList>
And in the code behind i do this:
Private Sub Services_SelectedIndexChanged(ByVal sender As Object, ByVal e As
System.EventArgs) Handles Services.SelectedIndexChanged
-----Storing to database code here------
Services.Items(Services.SelectedIndex).Enabled = False
Services.Items(Services.SelectedIndex).Attributes.Add("class",
"displayCheckBox")
Services.Items(Services.SelectedIndex).Selected = False
End Sub
And the css class here:
.displayCheckBox input{display:none;}
After the the event does the storing in the database and the page is refreshed, the checkbox that was selected is disabled but it shows the tick/check box, and i don't want it to show it if is selected.
Any one has an idea. I have searched a lot, but it seems that the CheckBoxList control doesn't provide much costumizing options.
Thank you in advance !
If you want to remove the checkbox from the checkboxlist, on SelectedIndexChanged event, try this:
Private Sub Services_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles Services.SelectedIndexChanged
'-----Storing to database code here------
Services.Items.RemoveAt(Services.SelectedIndex)
End Sub

Resources