Tuesday, April 21, 2009

How to add Image in the DataGridView or ListView Column, VB.NET

How to add Image in the DataGridView or ListView Column, VB.NET
 
Some time you have to display different images in the datagrid view based on column value. The simplest and fast performing way to achive this with datagridview, you add one Image column in the datatable and bind this datatable into the datagridview.
For ListView Control, you add one Image column listview item and add this item into into the listview control
 
NameSpace
Imports System.Text
Imports System.IO
 
Source Code
 
'Display Image column in the first column in the datagridview
Private Function BindDataGrid() As Integer
 
Dim rowCount As Integer
Dim dsCustomer As New DataSet
'Get related data from database
dsCustomer = GetAllCustomerData()
 
Try
 
Dim custTable As DataTable = dsCustomer.Tables(0)
Dim col As DataColumn
col = New DataColumn("Image", GetType(System.Drawing.Image))
custTable.Columns.Add(col)
col.SetOrdinal(0) 'This line will add image column in '0' place
 
'ImageList1 is ImageList control defined in the design time and add desired image (Design time) in the Imagelist Control,
For rowCount = 0 To custTable.Rows.Count - 1
If custTable.Rows(rowCount)("Dept").ToString() = "Finance" Then
   custTable.Rows(rowCount)("Image") = ImageList1.Images("ImageName1")
ElseIf custTable.Rows(rowCount)("Dept").ToString() = "Sales" Then
   custTable.Rows(rowCount)("Image") = ImageList1.Images("ImageName2")
Else
   custTable.Rows(rowCount)("Image") = ImageList1.Images("ImageName3")
End If
Next
 
   DataGridView1.DataSource = custTable
   DataGridView1.Columns(0).Width = "20"
 
   Return custTable.Rows.Count
 
Catch ex As Exception
    Throw ex
End Try
 
End Function
 
Note:  Another way to add Image in the ImageList Object at runtime
         ImageList.Images.Add(Bitmap.FromFile("../Icons/Image1.ico"))
 
'Display Image column in the first column in the listview control
Private Function BindListView() As Integer
 
Dim rowCount As Integer
Dim dsCustomer As New DataSet
'Get related data from database
dsCustomer = GetAllCustomerData()
 
Try
 
'Clear all the previous data if any, to overcome from binding duplicate data
ListView1.Clear()
' Set the view to show details. This is for to display all the rows and columns
ListView1.View = View.Details
 
'Design time add desired image in the Imagelist Control, ImageList1 is ImageList control defined in the design time
ListView1.SmallImageList = ImageList1
 
'Add columns,
ListView1.Columns.Add("Cust_Name", -2, HorizontalAlignment.Left)
ListView1.Columns.Add("Cust_Address", -2, HorizontalAlignment.Right)
 
Dim item As New ListViewItem
Dim custTable As DataTable = dsCustomer.Tables(0)
 
For rowCount = 0 To custTable.Rows.Count - 1
If custTable.Rows(rowCount)("Dept").ToString() = "Finance" Then
    item = New ListViewItem(custTable.Rows(rowCount)(0).ToString(), 0) 'Image1
ElseIf custTable.Rows(rowCount)("Dept").ToString() = "Sales" Then
    item = New ListViewItem(custTable.Rows(rowCount)(0).ToString(), 1) 'Image2
Else 'Other Dept
     item = New ListViewItem(custTable.Rows(rowCount)(0).ToString(), 2) 'Image3
End If
 
     item.SubItems.Add(custTable.Rows(rowCount)(0).ToString())
     item.SubItems.Add(custTable.Rows(rowCount)(1).ToString())
      ListView1.Items.Add(item)
Next
 
Return custTable.Rows.Count
 
Catch ex As Exception
     Throw ex ' Handle Exception here
End Try
 
End Function
 
Note:   'Another way to add Image in the custTable Row at runtime
           custTable.Rows(rowCount)("Image") = New System.Drawing.Bitmap ("../Icons/Image1.ico")

Friday, April 17, 2009

ListView Control De-select it selected value when click on other controls in .NET

ListView Control De-select it selected value when click on other controls in .NET

Following example tested with VB.NET Window Form, .NET Framework 2.0 and IE 6.0

Problem:

  1. Load listview control
  2. Select some rows from listview
  3. Now select some other controls in the form
  4. All listview selected rows are de-selected

Solution:

Select your listview control on lost focus of listview event


Private Sub ListView1_LostFocus(ByVal sender As Object, ByVal e As System.EventArgs) Handles ListView1.LostFocus

ListView1.Select()

End Sub


Note:
Here the simple way to select/Unselect listview control programatically

'Select Items from ListView Control
ListView1.Items(0).Selected = True

ListView1.Select()

'Un-Select Items from ListView Control
ListView1.Items(0).Selected = False
ListView1.Select()

Thursday, April 09, 2009

Confirm Popup message box with “Yes/No” button instead of “Ok/Cancel”

Confirm Popup message box with "Yes/No" button instead of "Ok/Cancel" In the javascript you have 'Confirm' function to popup message box and this message box comes with "Ok" and "Cancel" button but sometime you might have a requirement to display "Yes" and "No" button popup message box instead of "ok" and "Cancel". To achive this we have lots of work around. One of that is go and overrite window confirm function with vbscript. So you are still using JavaScript and Confirm function to display popup message box with "Yes" and "No" button and this fucntion will return "True" or "False" based on which button clicked. Copy and past following code in your aspx page before <Body> tag. This will give you popup message box on page load


<script language=javascript>

/*@cc_on @*/
/*@if (@_win32 && @_jscript_version>=5)
function window.confirm(str)
{
execScript('n = msgbox("'+str+'","4132")', "vbscript");
return(n == 6);
}
@end @*/
var r = confirm("Do you think you can do it?");
alert(r);


</script>


If you want this popup message box on click of button then call this fucntion on button click like below.


<asp:Button runat="server" Text="Button" OnClientClick="confirm('Do you think you can do it?')" ></asp:Button>


Message box WITH JavaScript Message box WITHOUT JavaScript