WPF getting started tutorial Series 22 -- DataGrid example (2), wpfdatagrid

Source: Internet
Author: User
Tags datagrid example

WPF getting started tutorial Series 22 -- DataGrid example (2), wpfdatagrid

DataGridSample background code

1) read the city information data from the S_City table in the database (local)/Test through Entity Framework 6.1, and read the Province information from the S _ Province table, then, bind the data to a DataGrid in the Window of WPF. The Code is as follows.

Using System; using System. collections. generic; using System. collections. objectModel; using System. data. entity; using System. linq; using System. text; using System. threading. tasks; using System. windows; using System. windows. controls; using System. windows. data; using System. windows. documents; using System. windows. input; using System. windows. media; using System. windows. media. imaging; using System. windows. shapes; usi Ng WpfApp1.Models; namespace WpfApp1 {// <summary> // WindowGrid. interaction logic of xaml // </summary> public partial class WindowGrid: Window {public WindowGrid () {InitializeComponent (); Database. setInitializer <TestDBContext> (null);} private void btnRefresh_Click (object sender, RoutedEventArgs e) {BindDrp (); GetData ();} TestDBContext db = new TestDBContext (); protected void GetData () {List <S_City> l Ist = db. s_City.ToList <S_City> (); gridCitys. itemsSource = list;} protected void BindDrp () {List <S_Province> list = db. s_Province.ToList <S_Province> (); cboProvince. itemsSource = list; ProvinceList = list;} public List <S_Province> ProvinceList {get; set;} private void btnUpdate_Click (object sender, RoutedEventArgs e) {try {S_City city = (S_City) gridCitys. selectedItem; city. dateUpdated = DateT Ime. now; txtMsg. text = city. provinceID + "//" + city. cityName; S_City modifyCity = db. s_City.Find (city. cityID); modifyCity = city; db. saveChanges (); txtMsg. text + = "saved! ";}Catch (Exception ex) {txtMsg. Text + = ex. Message ;}}}}

 

2) After writing the above Code, press F5 to run the program and click "refresh ". You will see the following results. As shown in.

 

3) The DataGrid automatically generates some columns, but we do not need these columns. Therefore, set AutoGenerateColumns to False. Perform step 1. The following result is displayed.

 

 

 

4) Although the content in the drop-down box is displayed, there is a problem. The content that should be displayed is not displayed. After querying the network, we will know that we promise to make the following changes.

 

DataGridComboBox Column Binding method

 

DataGridComboBoxColumn has the following requirements on the Data source:

Use one of the following options. To fill in the drop-down list, first set the ItemsSource attribute of ComboBox:

  • 1. Static resources. For more information, see StaticResource tag extension.
  • 2. x: static code entity. For more information, see x: Static tag extension.
  • 3. ComboBoxItem inline set.

  

1) when using the DataGrid, you sometimes need to make some columns ComboBox. In this case, you naturally want to use the DataGridComboBoxColumn. However, if you are using the ItemsSource data to bind the background object, you will find that, this cannot be used at all.

2) After the default refresh button, there is no data in the drop-down box. I took a closer look at the Code. There was no data binding in the front-end code, and no binding statement was written in the background code. The front-end code is as follows. If.

<DataGridComboBoxColumn ClipboardContentBinding="{x:Null}" Header="ProvinceID" SelectedValueBinding="{x:Null}" SelectedItemBinding="{x:Null}" TextBinding="{x:Null}"/>

 

3) I made some modifications to the program, and the front-end code is not modified as follows.

<DataGridComboBoxColumn x:Name="cboProvince" ClipboardContentBinding="{x:Null}" Header="ProvinceID" SelectedValueBinding="{x:Null}" SelectedItemBinding="{x:Null}" TextBinding="{x:Null}"/>

 

 

The background code is as follows, and the drop-down box is bound.

 protected void BindDrp()        {            List<S_Province> list = db.S_Province.ToList<S_Province>();            cboProvince.ItemsSource = list;        }

 

The result is as follows. The binding is successful, but the value that I want to display is not displayed.


4) the front-end code is modified as follows. DataGridComboBoxColumn is bound. Then, run F5 and find that the display in the drop-down box is normal, but no matter how I change it, the "ProvinceID" in the DataGrid is only blank by default, and nothing is displayed, as shown in. The front-end code is as follows.

 

<DataGridComboBoxColumn x:Name="cboProvince" ClipboardContentBinding="{x:Null}" Header="ProvinceID" SelectedValuePath="ProvinceID" DisplayMemberPath="ProvinceName" SelectedItemBinding="{x:Null}" TextBinding="{Binding ProvinceName}"/>

 

 

 

5) but when I load data to the DataGrid, The ProvinceID column is still blank by default, and the data like the province name that I want to display is not displayed. After some searching and learning, I finally changed the front-end code to the following. In this way, after the data is bound to the DataGrid by default, the ProvinceID column reaches the desired result. For example.

<DataGridComboBoxColumn x:Name="cboProvince" ClipboardContentBinding="{x:Null}" Header="ProvinceID" SelectedValuePath="ProvinceID" SelectedValueBinding="{Binding Path=ProvinceID,UpdateSourceTrigger=PropertyChanged}"  DisplayMemberPath="ProvinceName" SelectedItemBinding="{x:Null}" >                </DataGridComboBoxColumn>

 

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.