翻訳への提案を行います
 
他のユーザーによる提案:

progress indicator
他の提案はありません。
 印刷用ページ       送信     
クリックして評価とフィードバックをお寄せください
MSDN
MSDN ライブラリ
すべて縮小/すべて展開 すべて縮小
コンテンツの表示:   英語と日本語を並べて表示コンテンツの表示: 英語と日本語を並べて表示
このページは、ベータ版用に機械翻訳されたものです。翻訳者による翻訳は、製品の正規版で提供される予定です。詳細についてはよくある質問 を参照してください。またぜひこちら からアンケートにもご協力ください。
Walkthrough: Filtering Data in a Web Page Using Declarative Syntax

[This documentation is for preview only, and is subject to change in later releases. Blank topics are included as placeholders.]

The QueryExtender control is used to create filters for data that is retrieved from a data source, without having to create explicit queries in the data source. The QueryExtender control has the following benefits:

  • Provides richer expressions for filtering than writing a Where clause.

  • Provides a common query language for the LinqDataSource and EntityDataSource control. For example, if you use the QueryExtender with these data source controls, you can provide searching capability in a Web page without writing a model-specific Where clause or eSQL statement.

  • Can be used with LinqDataSource or EntityDataSource controls, or with third-party data sources.

  • Supports a variety of filtering options that can be used individually or together.

You can use the QueryExtender control in the markup of a Web page to filter data by using only declarative syntax.

This walkthrough illustrates data filtering by selecting values from the Products table in the AdventureWorks sample database.

During this walkthrough, you will accomplish the following tasks:

  • Create a data-driven ASP.NET Web site.

  • Add data to the Web site using Visual Studio 2010 or Visual Web Developer 2010 Express.

  • Use the LinqDataSource control to access the data.

  • Use the filter options to create filtered queries that display only selected records.

  • Display data with the GridView control.

In order to complete this walkthrough, you will need the following:

  • Visual Studio 2010 or Visual Web Developer 2010 Express.

  • SQL Server Express. If you have SQL Server installed, you can use that, but you must make small adjustments to some of the procedures.

  • The AdventureWorks sample database. In this walkthrough you will add the database file to the Web site and connect to the .mdf file. For information about how to connect to the database in Visual Studio, see How to: Connect to the AdventureWorksLT Database using an .MDF File. You can also download the AdventureWorks sample database and connect to it in Visual Studio. For information about how to install AdventureWorks and create a connection to it in Visual Studio, see How to: Set up an AdventureWorksLT Sample Database for ASP.NET Development.

To begin, you will create a Web site. If you have already created an ASP.NET Web site, you can use that site in this walkthrough.

To create an ASP.NET Web site

  1. Start Visual Studio or Visual Web Developer.

  2. In the File menu, click New Web Site. (If you do not see this option, click New, and then click Web Site.)

    The New Web Site dialog box is displayed.

  3. Under Installed templates, click Visual Basic or Visual C# and select ASP.NET Web Site.

  4. In the Web Location box, select File System and enter the name of the folder where you want to keep the pages of the Web site. For example, enter the folder name C:\Websites\FilterDemo then click OK.

    Visual Studio creates the folder and a new page named Default.aspx. You will the use the default name but you can use any name.

  5. Save the Web site.

In this section, you will add the AdventureWorks sample database to your Web site. If your Web site is already connected to the AdventureWorks database, you do not need to perform this procedure.

To add a database file to the project

  • Add the AdventureWorks.mdf sample database file to the Web site and connection to it in Visual Studio.

    For information about how to install AdventureWorks and create a connection to it in Visual Studio, see How to: Connect to the AdventureWorksLT Database using an .MDF File.

    Note Note

    The procedure for installing the AdventureWorks.mdf and the AdventureWorksLT.mdf sample database file is similar. During the installation, you will select the AdventureWorks sample database instead of the AdventureWorksLT.

The next step is to create the data model. You can use the use LINQ to SQL or Entity Data model. In this walkthrough, you use the use LINQ to SQL data model.

To create a data model using LINQ to SQL

  1. Right-click the root folder of the Web site and then click Add New Item.

  2. Under Installed templates, select LINQ to SQL Classes.

  3. In the Name box, enter a name for the database model. For example, you can enter the name AdventureWorks.dbml and then click Add.

  4. If the Visual Studio dialog box appears, click Yes to put the file in the App_Code folder. The Object Relational Designer is displayed.

  5. Click the Server Explorer link to switch to the Server Explorer view.

  6. In Server Explorer, click the AdventureWorks database, expand the Tables node, and drag the Product table into the designer window.

    The table and its columns are represented as entities in the designer window.

The next step is to add a data source control to the page and configure it to work with the database. The QueryExtender control, which enables filtering, supports the LinqDataSource and the EntityDataSource controls. In this walkthrough, you will use the LinqDataSource control.

To add the data source control

  1. Switch to Design view.

  2. In the Toolbox, expand Data and then drag a LinqDataSource control onto the Default.aspx page.

  3. Build the Web site.

  4. Click the smart tag and then click Configure Data Source.

  5. Select Show only DataContext objects.

  6. Under Choose your context object, select AdventureWorksDataContext and then click Next.

  7. Under Table, select Products (Table<Product>).

  8. Under GroupBy, select None.

  9. Under Select, select all the columns and then click Finish.

    Note Note

    To select all the columns, you can check the * check box. You must build the Web site for the table and columns to be populated.

  10. In the Properties window, set the ContextTypeName property to AdventureWorksDataContext.

  11. In the Properties window, set the TableName property to "Products". The markup will resemble the following example:

    <asp:LinqDataSource ID="LinqDataSource1" runat="server"
        ContextTypeName="AdventureWorksDataContext" EntityTypeName=""  
        TableName="Products" >
    </asp:LinqDataSource>
    

In this section, you will add search capability to the Web page. To do so, you will add controls that accept user input. You will also use the QueryExtender control and set its filter options based on user input. The QueryExtender control lets you do this by using declarative syntax. For this walkthrough, you will use the following filter option to provide search capability in the Web site:

  • SearchExpression , which you will use to search for product names that match a specified string value.

  • RangeExpression , which you will use to search for products whose ReorderPoint column value is in a specified range.

  • PropertyExpression , which you will use to search for products that are classified as finished goods.

  • CustomExpression , which you will use to execute a user-defined LINQ query.

The results of the filtered data will be displayed in a GridView control.

To add the filtering control

  1. Switch to Source view.

  2. In the body tag, after the closing tag of the LinqDataSource control, add the following markup to the page:

    <asp:QueryExtender runat="server" TargetControlID="LinqDataSource1">
    </asp:QueryExtender>
    

    This adds the QueryExtender control to the page and sets its associated data source control to be the LinqDataSource control that you added earlier.

Searching for Strings

Next, you will add the SearchExpression option and configure it to perform a "starts with" search using the value in a text box.

To search for a string

  1. From the Toolbox, in the Standard node, drag a TextBox control onto the page.

  2. In front of the opening tag of the TextBox, enter Search: to provide a caption.

  3. Set the ID property to SearchTextBox.

    The markup for the text box control resembles the following example.

    Search: <asp:TextBox ID="SearchTextBox" runat="server" />
    
  4. Between the opening and closing tags of the QueryExtender control, add the following SearchExpression filter:

    <asp:SearchExpression SearchType="StartsWith" DataFields="Name">
      <asp:ControlParameter ControlID="SearchTextBox" />
    </asp:SearchExpression>
    

    The search expression searches the Name column for products that start with the string that is entered in the SearchTextBox control.

  5. If you use Visual Studio 2010 Beta1, do the following:

    1. Open the Web.config file.

    2. In the pages element, locate the controls element and add the following element:

      <add tagPrefix="asp"
          namespace="System.Web.UI.WebControls.Expressions" 
          assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
      
    3. Close the Web.config file.

    4. Build the Web site

  6. From the Toolbox, drag a Button control onto the page and set its Text property to Search.

    The markup for the button will resemble the following:

    <asp:Button ID="Button1" runat="server" Text="Search" />
    
  7. From the Toolbox, drag a GridView control onto the page and set its properties as shown in the following example:

    <asp:GridView ID="GridView1" runat="server"  
        DataSourceID="LinqDataSource1"   
        DataKeyNames="ProductID"  AllowPaging="True">
    </asp:GridView>
    

    The result of the search will be displayed in the GridView control.

You can now test the search filter you have created.

To test the search filter

  1. Press CTRL+F5 to run the page.

  2. Enter a string in the search text box and then click Search.

    For example, enter Ch and then click Search. Notice that results that are shown in the GridView control contain only product names that start with "Ch".

    Note Note

    The LINQ data provider is not case sensitive. However, if you use a data provider that supports the ComparisonType property, you can use it to change the case sensitivity.

  3. Close the browser.

Searching a Range of Values

Next, you will use the RangeExpression object to search the ReorderPoint column for products that have the ReorderPoint in the range specified by values in two text boxes.

To search a range

  1. Switch to Design view.

  2. From the Toolbox, drag two TextBox controls onto the page. You can position the text boxes under the search text box.

    You will use the text boxes to specify the range to start from and end at.

  3. In front of the opening tag of the first TextBox, enter From: and enter To: in front of the second TextBox.

  4. Set the ID of the first text box to FromTextBox and set the ID of the second text box to ToTextBox.

    The markup for the text box controls resembles the following example.

    From: <asp:TextBox ID="FromTextBox" runat="server" ></asp:TextBox>
    To: <asp:TextBox ID="ToTextBox" runat="server" ></asp:TextBox>
    
  5. Between the opening and closing tags of the QueryExtender control, add the following RangeExpression filter:

    <asp:RangeExpression DataField="ReorderPoint" MinType="Inclusive"  
        MaxType="Inclusive">
    </asp:RangeExpression>
    

    This searches the ReorderPoint column and includes the values that you specify in the text boxes in the search.

  6. Between the opening and closing tags of the RangeExpression filter, add the following markup:

    <asp:ControlParameter ControlID="FromTextBox" />
    <asp:ControlParameter ControlID="ToTextBox" />
    

    This configures the text boxes to provide the parameter values for the filter. The markup for the completed RangeExpression filter resembles the following example:

    <asp:RangeExpression DataField="ReorderPoint" MinType="Inclusive"  
        MaxType="Inclusive">
      <asp:ControlParameter ControlID="FromTextBox"/>
      <asp:ControlParameter ControlID="ToTextBox"/>
    </asp:RangeExpression>
    

You can now test the Range filter you have created.

To test the range filter

  1. Press CTRL+F5 to run the page.

  2. Enter a value in the From and To text boxes and then click Search.

    For example, enter a range from 300 to 400 and click the Search button. The data that is returned includes product names that have a reorder point between 300 and 400. Notice that the results that are shown in the GridView control contain only product names with Reorder values between 300 and 400.

  3. Close the browser.

Searching Based on a Boolean Value

Next, you will configure the page PropertyExpression to filter the data based on a Boolean value. The Boolean value is specified in a check box control.

To search based on a Boolean value

  1. Switch to Design view.

  2. From the Toolbox, drag a CheckBox control onto the page and set the ID property to MakeCheckBox. You can position the check box under the To and From text boxes.

  3. In front of the opening tag of the CheckBox control, enter Make More to provide a caption for the check box.

    The markup resembles the following example.

    Make More: <asp:CheckBox ID="MakeCheckBox" runat="server" />
    
  4. Between the opening and closing tags of the QueryExtender control, under the range expression, add the following markup:

    <asp:PropertyExpression></asp:PropertyExpression>
    

    This adds the property expression filter option to the page.

  5. Between the opening and closing tags of the PropertyExpression filter, add a ControlParameter control.

  6. Set the ID of the control ControlParameter parameter to the MakeCheckBox.

  7. Set the Name property of the ControlParameter parameter to MakeFlag, which is the column to filter by.

    The markup will resemble the following:

    <asp:PropertyExpression>
        <asp:ControlParameter ControlID="MakeCheckBox" Name="MakeFlag" />
    </asp:PropertyExpression>
    

You can now test the Boolean filter you have created.

To test the Boolean filter

  1. Press CTRL+F5 to run the page.

  2. Select the Make More check box and then click Search.

    The data that is returned includes only product names that have the value in the MakeFlag column set to true (the column is checked.)

  3. Close the browser.

You can use multiple filters at the same time. If you use multiple filters, the query generates AND clauses for the filters. In this section, you will test all the filters together.

To test multiple filters

  1. Press CTRL+F5 to run the page

  2. In the SearchTextBox, enter Ch.

  3. Select the Make MoreCheckBox.

  4. In the From text box, enter 500 to 1000.

  5. In the To text box, enter 1000 and click the Search button.

    The data that is returned includes products names that starts with "Ch", that have the Makeflag column checked, and that have ReorderPoint value between 500 and 1000.

In this section, you will filter the data by using a custom LINQ query. To do so, you will do the following:

  • Create a custom LINQ query in the class file for the page.

  • Add a data source control and a QueryExtender control to the page.

  • Add a custom expression to the QueryExtender control to execute the custom LINQ query.

  • Add a GridView control to display the results of the query.

You can use either the CustomExpression or the MethodExpression filter to execute the query. The behavior of these filters is similar. In this walkthrough, you will use the CustomExpression filter. For information about how to use the method expression filter, see MethodExpression.

Note Note

If you use the CustomExpression or the MethodExpression in the same page as the other filter options, it must be the first filter to execute in QueryExtender controls.

The next step is to create the custom LINQ query.

To create a custom LINQ query

  1. Right-click the root folder of the Web site and then click Add New Item.

  2. Under Installed Templates, select Web Form. You can use the default name of Default2.aspx for the page.

  3. Check Place code in separate file and then click Add.

  4. Switch to the Default2.aspx.cs or Default2.aspx.vb file of the page you just created.

  5. Add the following namespaces to by using the using (C#) or Imports (Visual Basic) directives.

    Visual Basic
    Imports System.Web.UI.WebControls.Expressions
    Imports System.Data.Linq

    C#
    Using System.Web.UI.WebControls.Expressions;
    using System.Linq;
  6. Add the following method to the partial class.

    The query searches the ListPrice column for products that have a list price of 3500 or more.

    Visual Basic
    Protected Sub FilterProducts(ByVal sender As Object, ByVal e As CustomExpressionEventArgs)
            e.Query = From p In e.Query.Cast(Of Product)() _
                      Where p.ListPrice >= 3500 _
                      Select p
        End Sub

    [C#]

    protected void FilterProducts(object sender, CustomExpressionEventArgs e)
    {
            e.Query = from p in e.Query.Cast<Product>()
                      where p.ListPrice >= 3500
                      select p;
    }
    

The next step is to add the data source control to the page and configure it to work with the data model. In this walkthrough, you will use the LinqDataSource control.

To add the data source control

  1. Switch to Design view.

  2. In the Toolbox, expand Data and then drag a LinqDataSource control onto the page.

  3. Build the Web site.

  4. Click the smart tag and then click Configure Data Source.

  5. Select Show only DataContext objects.

  6. Under Choose your context object, select AdventureWorksDataContext and then click Next.

  7. Under Table, select Products (Table<Product>).

  8. Under GroupBy, select None.

  9. Under Select, select all the columns and then click Finish.

    Note Note

    To select all the columns, you can check the * check box. You must build the Web site for the table and columns to be populated.

  10. In the Properties window, set the ContextTypeName property to AdventureWorksDataContext.

  11. In the Properties window, set the TableName property to "Products". The markup will resemble the following example:

    <asp:LinqDataSource ID="LinqDataSource1" runat="server"
        ContextTypeName="AdventureWorksDataContext" EntityTypeName=""  
        TableName="Products" >
    </asp:LinqDataSource>
    

Executing the Custom filter

In this section, you will add will add the filtering controls that will enable you to execute the custom query.

To add the filtering control

  1. Switch to Source view.

  2. In the body element, after the closing tag of the LinqDataSource control, add the following markup to the page:

    <asp:QueryExtender runat="server" TargetControlID="LinqDataSource1">
    </asp:QueryExtender>
    

    This adds the QueryExtender control to the page and sets its associated data source control to be the LinqDataSource control that you added earlier.

  3. Between the opening and closing tags of the QueryExtender control, add a CustomExpression filter and set its OnQuerying event to FilterProducts.

    The markup will resemble the following:

    <asp:CustomExpression OnQuerying="FilterProducts"></asp:CustomExpression>
    
  4. From the Toolbox, drag a GridView control onto the page and set its properties as shown in the following example:

    <asp:GridView ID="GridView1" runat="server"  
        DataSourceID="LinqDataSource1"   
        DataKeyNames="ProductID"  AllowPaging="True">
    </asp:GridView>
    

    The result of filtered the data will be displayed in the GridView control.

You can now test the custom filter.

To test the Web site

  • Press CTRL+F5 to run the page.

    The data that is returned includes only product that have a list price of 3500 or more.

After you have completed this walkthrough, the markup for the Default.aspx page of the Web site will resemble the following example.

<html  >
<head runat="server">
    <title>Filter Demo</title>
</head>
<body>
    <form id="form1" runat="server">
    Search:<asp:TextBox ID="SearchTextBox" runat="server" />
    <p>
    
        Make More:<asp:CheckBox ID="MakeCheckBox" runat="server" />
    <p>
        From:<asp:TextBox ID="FromTextBox" runat="server" ></asp:TextBox>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        To:<asp:TextBox ID="ToTextBox" runat="server" ></asp:TextBox>
    </p>
    <p>
    <asp:Button ID="Button1" runat="server" Text="Search" />
    </p>
    <asp:LinqDataSource ID="LinqDataSource1"  
        ContextTypeName="FilterDemo.AdventureWorksDataContext"  
        TableName="Products" runat="server"> 
    </asp:LinqDataSource>
    <asp:QueryExtender runat="server" TargetControlID="LinqDataSource1">
    
    <asp:SearchExpression SearchType="StartsWith" DataFields="Name" >
    <asp:ControlParameter ControlID="SearchTextBox" />
    </asp:SearchExpression>
    
    <asp:RangeExpression DataField="ReorderPoint" MinType="Inclusive" MaxType="Inclusive">
    <asp:ControlParameter  ControlID="FromTextBox" />
    <asp:ControlParameter  ControlID="ToTextBox" />
    </asp:RangeExpression>
    
<asp:PropertyExpression>
    <asp:ControlParameter ControlID="MakeCheckBox" Name="MakeFlag" />
    </asp:PropertyExpression>
    </asp:QueryExtender>
    
<asp:GridView ID="GridView1" runat="server"  
     DataSourceID="LinqDataSource1" AllowPaging="True"    
     DataKeyNames="ProductID>
</asp:GridView>
    </form>
    
    </body>
    </html>

After you have completed this walkthrough, the markup for the Deafault2.aspx page of the Web site will resemble the following example.

<html >
<head runat="server">
    <title>Custom Filter</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    <asp:LinqDataSource ID="LinqDataSource1" runat="server" 
        ContextTypeName="AdventureWorksDataContext" EntityTypeName="" 
        TableName="Products">
    </asp:LinqDataSource>
    
    <asp:QueryExtender ID="QueryExtender1" runat="server" TargetControlID="LinqDataSource1">
        <asp:CustomExpression OnQuerying="FilterProducts"></asp:CustomExpression>
    </asp:QueryExtender>

    <asp:GridView ID="GridView1" runat="server"  
        DataSourceID="LinqDataSource1"   
        DataKeyNames="ProductID"  AllowPaging="True">
    </asp:GridView>
    </form>
</body>
</html>

After you have completed this walkthrough, the code for the custom LINQ query in the Default2.aspx.vb or Default2.aspx.cs file will resemble the following example.

Visual Basic
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.Expressions
Imports System.Data.Linq

Partial Class CustomVB
    Inherits System.Web.UI.Page

    Protected Sub FilterProducts(ByVal sender As Object, ByVal e As CustomExpressionEventArgs)
        e.Query = From p In e.Query.Cast(Of Product)() _
            Where p.ListPrice >= 3500 _
            Select p
    End Sub

[C#]

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.Expressions;
using System.Linq;

public partial class _Default : System.Web.UI.Page 
{
    protected void FilterProducts(object sender, CustomExpressionEventArgs e)
    {
        e.Query = from p in e.Query.Cast<Product>()
                  where p.ListPrice >= 3500
                  select p;
    }
}

In this walkthrough, you used the QueryExtender control to filter data by using declarative syntax. The QueryExtender control provides more filter options than have been illustrated in this walkthrough. You might want to try the following:

チュートリアル: 宣言型構文を使用して Web ページのデータをフィルタリングする

[このドキュメントはプレビュー版であり、後のリリースで変更されることがあります。 空白のトピックは、プレースホルダーとして挿入されています。]

QueryExtender コントロールはデータ ソース内の明示的なクエリを作成することがなく、データ ソースから取得されるデータのフィルターを作成を使用します。 QueryExtender コントロールが、次のような利点があります。

  • Where 句を記述するよりもフィルターについての豊富な式を示します。

  • LinqDataSource EntityDataSource コントロールとための一般的なクエリ言語を提供します。 たとえば場合、QueryExtender でこれらのデータ ソース コントロールを使用することができます検索機能を Web ページで、機種に固有の場所を記述せず句または eSQL ステートメント。

  • LinqDataSource EntityDataSource コントロール、またはサード パーティ製のデータ ソースで使用できます。

  • さまざまな個別または一緒に使用できるフィルターのオプションをサポートします。

宣言構文だけを使用してデータのフィルター処理する Web ページのマークアップで QueryExtender コントロールを使用することができます。

このチュートリアルでは商品] テーブルでは、AdventureWorks サンプル データベースから値を選択してフィルター データを示します。

このチュートリアルでは、次のタスクを行います。

  • データ ドリブン ASP.NET Web サイトを作成します。

  • Visual Studio 2010 または Visual Web Developer 2010 Express を使用して Web サイトにデータを追加します。

  • LinqDataSource コントロールをデータにアクセスを使用します。

  • フィルター オプションを使用して表示のみレコード選択されているフィルターのクエリを作成をします。

  • データと GridView コントロールを表示します。

このチュートリアルを完了するための要件を次に示します。

開始するには、Web サイトは作成します。 ASP.NET Web サイトを既に作成した場合はそのサイトこのチュートリアルで使用できます。

ASP.NET Web サイトを作成するには

  1. Visual Studio または Visual Web Developer を起動します。

  2. [ファイル] メニューの [新しい Web サイト] をクリックします。 このオプションが表示されない場合、は新しいをクリックし、 の Web サイト] をクリックします。

    [新しい Web サイト] ダイアログ ボックスが表示されます。

  3. インストールされているテンプレート、 の Visual Basic または Visual C# をクリックし、 の ASP.NET の Web サイトを選択します。

  4. Web の場所 ] ボックスに、 のファイル システムを選択し、Web サイトのページを格納するフォルダーの名前を入力します。 たとえば、C:\Websites\FilterDemo で、フォルダー名 を入力し、[OK] の をクリックします。

    Visual Studio によりフォルダーが作成され、Default.aspx という名前の新しいページが作成されます。 既定の名前を使用するが任意の名前を使用することができます。

  5. Web サイトを保存します。

このセクションでは、AdventureWorks サンプル データベースを Web サイトに追加します。 Web サイトが、AdventureWorks データベースに既に接続されている場合はこの手順を実行する必要はありません。

データベース ファイルをプロジェクトに追加するには

  • AdventureWorks.mdf サンプル データベース ファイル、Web サイトと Visual Studio で接続を追加します。

    AdventureWorks をインストールして Visual Studioで、接続の作成については、 方法 : .MDF ファイルを使用して、AdventureWorksLT データベースへの接続します。 を参照してください。

    メモ メモ

    AdventureWorks.mdf と AdventureWorksLT.mdf サンプル データベース ファイルをインストールする手順は同様です。 インストール中には、AdventureWorksLT ではなく、AdventureWorks サンプル データベースを選択します。

次に、データ モデルを作成します。 SQL またはエンティティ データ モデルに LINQ を使用してを使用できます。 このチュートリアルでは SQL データ モデルに LINQ を使用してを使用します。

LINQ to SQL を使用してデータ モデルを作成するには

  1. Web サイトのルート フォルダーを右クリックし、[新しい項目の追加 を実行します。

  2. インストールされているテンプレート LINQ SQL クラス にします。

  3. [名前] ボックスに、データベース モデルの名前を入力します。 たとえば、AdventureWorks.dbml を入力し、 の追加] をクリックできます。

  4. Visual Studio ダイアログ ボックスが表示されたら、[クリックして [はい] App_Code フォルダーにファイルを挿入します。 [オブジェクト リレーショナル デザイナー] が表示されます。

  5. サーバー エクスプローラー リンク サーバー エクスプローラーのビューに切り替えるをクリックします。

  6. のサーバー エクスプローラー] で、AdventureWorks データベースをクリックを テーブル ノードを展開して、Product テーブル デザイナー ウィンドウにドラッグします。

    テーブルとその列は、デザイナー ウィンドウ内のエンティティとして表されます。

今度は、データ ソース コントロールをページに追加し、データベースを使用するよう構成します。 フィルター処理できる QueryExtender コントロールが LinqDataSourceEntityDataSource コントロールとをサポートします。 このチュートリアルでは LinqDataSource コントロールを使用します。

データ ソース コントロールを追加するには

  1. デザイン ビューに切り替えます。

  2. のツールボックスで のデータを展開して、 LinqDataSource コントロール Default.aspx ページ上にドラッグします。

  3. Web サイトを構築します。

  4. スマート タグをクリックし、 のデータ ソースの構成を実行します。

  5. 表示のみ DataContext オブジェクト を選択します。

  6. 選択、コンテキスト オブジェクト[AdventureWorksDataContext を選択し、[次へ] を しています。

  7. の表、製品 (テーブル < 製品 >) します。

  8. の GroupBy、する なし

  9. を選択すべての列を選択し、 の完了] をクリックします。

    メモ メモ

    選択するすべての列には、をチェックできます * チェック ボックスをオンします。 Web サイト用に、テーブルを格納する列を作成する必要があります。

  10. ウィンドウで、プロパティContextTypeName プロパティを AdventureWorksDataContext を設定します。

  11. ウィンドウで、プロパティTableName プロパティ「製品」を設定します。 マークアップは次の使用例ようになります。

    <asp:LinqDataSource ID="LinqDataSource1" runat="server"
        ContextTypeName="AdventureWorksDataContext" EntityTypeName=""  
        TableName="Products" >
    </asp:LinqDataSource>
    

このセクションでは、検索機能、Web ページに追加します。 これを行うは、ユーザー入力を受け付けるコントロールを追加します。 QueryExtender コントロールを使用し、ユーザー入力に基づいて、フィルター オプションを設定するはもします。 QueryExtender コントロールでは宣言の構文を使用したことができます。 このチュートリアルでは、Web サイト内の検索機能に、次のフィルター オプションを使用します。

  • SearchExpression 製品の検索に使用されます名と一致する指定した文字列値を指定します。

  • RangeExpression ReorderPoint 列値を持つが、指定した範囲内の製品検索に使用されます。

  • PropertyExpression 、完成品として分類されている製品の検索に使用されます。

  • CustomExpression 、ユーザー定義の LINQ クエリを実行に使用されます。

フィルター処理されたデータの結果が GridView コントロールに表示されます。

フィルター コントロールを追加するには

  1. ソース ビューに切り替えます。

  2. body タグ、内での LinqDataSource コントロールの終了タグの後、次のマークアップをページに追加します。

    <asp:QueryExtender runat="server" TargetControlID="LinqDataSource1">
    </asp:QueryExtender>
    

    この、QueryExtender コントロール、ページに追加され、その関連付けられたデータ ソース コントロールを追加した LinqDataSource コントロールを設定します。

文字列の検索

次を SearchExpression オプションを追加し、構成を「で始まる」を実行します。検索テキスト ボックス内の値を使用します。

文字列を検索するには

  1. ツールボックス の標準ノードのTextBox コントロールをページ上にドラッグします。

  2. TextBox の開始タグの前に入力 検索:図表番号を提供します。

  3. ID プロパティは SearchTextBox を設定します。

    テキスト ボックス コントロールのマークアップには次の使用例似ています。

    Search: <asp:TextBox ID="SearchTextBox" runat="server" />
    
  4. タグと終了タグ、QueryExtender コントロールの間には、次の SearchExpression フィルターを追加します。

    <asp:SearchExpression SearchType="StartsWith" DataFields="Name">
      <asp:ControlParameter ControlID="SearchTextBox" />
    </asp:SearchExpression>
    

    プロパティが示す検索式列を対象にしてが検索されます名 SearchTextBox コントロールに入力されている文字列で始まる製品。

  5. Visual Studio 2010 Beta1 を使用している場合は、以下の行いますです。

    1. Web.config ファイルを開きます。

    2. pages 要素に、 controls 要素を探して、次の要素を追加します。

      <add tagPrefix="asp"
          namespace="System.Web.UI.WebControls.Expressions" 
          assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
      
    3. Web.config ファイルを閉じます。

    4. Web サイトを構築します。

  6. のツールボックスから Button コントロールをページにドラッグし、 Text に、 Search プロパティを設定します。

    ボタンのマークアップは次のようになります。

    <asp:Button ID="Button1" runat="server" Text="Search" />
    
  7. のツールボックスから GridView コントロールをページにドラッグし、次の例のようには、そのプロパティを設定します。

    <asp:GridView ID="GridView1" runat="server"  
        DataSourceID="LinqDataSource1"   
        DataKeyNames="ProductID"  AllowPaging="True">
    </asp:GridView>
    

    検索の結果は、GridView コントロールに表示されます。

ここで作成した検索フィルターをテストできます。

検索フィルターをテストするには

  1. Ctrl キーを押しながら F5 キーを押してページを実行します。

  2. 検索テキスト ボックスに文字列を入力し、 の検索を実行します。

    たとえば、Ch を入力して の検索] をクリックします。 GridView コントロールに表示される結果に"ch"で始まる製品名だけが含まれることに注目してください。

    メモ メモ

    LINQ データ プロバイダーは大文字と小文字が区別されません。 ただし、ComparisonType プロパティをサポートするデータ プロバイダーを使用する場合、大文字小文字の変更を使用することができます。

  3. ブラウザーを閉じます。

値の範囲を検索

次に、製品 2 つのテキスト ボックス内の値で指定された範囲内で、ReorderPoint を ReorderPoint 列検索に RangeExpression オブジェクトを使用します。

範囲を検索するには

  1. デザイン ビューに切り替えます。

  2. のツールボックスからには、ページに 2 つの TextBox コントロールをドラッグします。 検索テキスト ボックスの下の [テキスト ボックスを配置することができます。

    使用して、テキスト ボックスから開始して終了範囲を指定します。

  3. 最初の TextBox の開始タグの前にから入力します。入力します。2 番目の TextBox の前に。

  4. FromTextBox に最初のテキスト ボックスの ID を設定し、 ToTextBox を 2 番目のテキスト ボックスの ID を設定します。

    テキスト ボックス コントロールのマークアップには次の使用例似ています。

    From: <asp:TextBox ID="FromTextBox" runat="server" ></asp:TextBox>
    To: <asp:TextBox ID="ToTextBox" runat="server" ></asp:TextBox>
    
  5. タグと終了タグ、QueryExtender コントロールの間には、次の RangeExpression フィルターを追加します。

    <asp:RangeExpression DataField="ReorderPoint" MinType="Inclusive"  
        MaxType="Inclusive">
    </asp:RangeExpression>
    

    これは、ReorderPoint 列を検索し、検索テキスト ボックスで指定した値を含みます。

  6. タグと終了タグの RangeExpression フィルター、間には、次のマークアップに追加します。

    <asp:ControlParameter ControlID="FromTextBox" />
    <asp:ControlParameter ControlID="ToTextBox" />
    

    これは、構成、テキスト ボックス、フィルターのパラメーター値を提供します。 完成した RangeExpression フィルターのマークアップよう次の使用例。

    <asp:RangeExpression DataField="ReorderPoint" MinType="Inclusive"  
        MaxType="Inclusive">
      <asp:ControlParameter ControlID="FromTextBox"/>
      <asp:ControlParameter ControlID="ToTextBox"/>
    </asp:RangeExpression>
    

ここで作成した Range フィルターをテストできます。

範囲のフィルターをテストするには

  1. Ctrl キーを押しながら F5 キーを押してページを実行します。

  2. テキスト ボックスに、 での値を 送信者入力し、 の検索] をクリックします。

    たとえば、400 300 から範囲を入力し、検索 をクリックします。 返されるデータには、300 ~ 400 ポイント発注が製品名が含まれます。 GridView コントロールに表示される結果に 300 と 400 の間での並べ替え値を持つ唯一の製品名が含まれることに注意してください。

  3. ブラウザーを閉じます。

ブール型 (Boolean) の値に基づく検索

次に、ブール型 (Boolean) の値に基づいてデータをフィルターには、ページ PropertyExpression 構成します。 ブール型 (Boolean) 値は、チェック ボックス コントロールで指定します。

ブール型 (Boolean) の値をに基づいて検索するには

  1. デザイン ビューに切り替えます。

  2. のツールボックスから CheckBox コントロールをページにドラッグし、 IDMakeCheckBox プロパティを設定します。 およびテキスト ボックスの [チェック ボックスを配置できます。

  3. CheckBox コントロールの開始タグの前に 作成他 チェック ボックスのキャプションを提供するを入力します。

    マークアップには次の使用例似ています。

    Make More: <asp:CheckBox ID="MakeCheckBox" runat="server" />
    
  4. タグと終了タグ、範囲の式では、QueryExtender コントロールの間には、次のマークアップを追加します。

    <asp:PropertyExpression></asp:PropertyExpression>
    

    プロパティ式のフィルター オプションはこのページに追加します。

  5. タグと終了タグの PropertyExpression フィルター、間 ControlParameter コントロールを追加します。

  6. ControlParameter をコントロール MakeCheckBox パラメーターの ID を設定します。

  7. Name 、フィルターを適用する列であるには、 ControlParameter パラメーターには、 MakeFlag プロパティを設定します。

    マークアップは次のようになります。

    <asp:PropertyExpression>
        <asp:ControlParameter ControlID="MakeCheckBox" Name="MakeFlag" />
    </asp:PropertyExpression>
    

ここで作成した、ブール型 (Boolean) のフィルターをテストできます。

ブール型 (Boolean) のフィルターをテストするには

  1. Ctrl キーを押しながら F5 キーを押してページを実行します。

  2. 作成他 チェック ボックスをオンし、 の検索を実行します。

    返されるデータに MakeFlag (列オンです)。 設定 true 列に値を持っている製品名だけが含まれます

  3. ブラウザーを閉じます。

同時に複数のフィルターを使えます。 複数のフィルターを使用して、クエリは、フィルターの AND 句。 ここはテストのすべてのフィルター化します。

複数のフィルターをテストするには

  1. キーを押して、ページを実行するには、Ctrl キーを押しながら F5

  2. In the SearchTextBox, enter Ch.

  3. Select the Make MoreCheckBox.

  4. 500 ~ 1000年、 テキスト ボックスから、入力します。

  5. テキスト ボックスの に「1000」と入力し、、クリックして 検索

    返されるデータには製品名"ch"で始まるオンにすると、Makeflag 列にある 500 ~ 1000年の ReorderPoint 値を持つことが含まれます。

ここでは、カスタム LINQ クエリを使用してデータがフィルターされます。 このために、次の操作を実行します。

  • ページのクラス ファイルに、カスタムの LINQ クエリを作成します。

  • ページへのデータ ソース コントロールと QueryExtender コントロールを追加します。

  • カスタム LINQ クエリを実行する QueryExtender コントロールに、カスタム式を追加します。

  • クエリの結果を表示する GridView コントロールを追加します。

使用して CustomExpression または MethodExpression フィルター クエリを実行します。 これらのフィルターの動作は似ています。 このチュートリアルでは、CustomExpression フィルターを使用してください。 メソッド式フィルターを使用する方法については、MethodExpression を参照してください。

メモ メモ

その他のフィルター オプションと同じページで、CustomExpression または MethodExpression を使用する場合、 QueryExtender コントロールで実行する最初のフィルターになりません。

今度は、カスタムの LINQ クエリを作成します。

カスタムの LINQ クエリを作成するには

  1. Web サイトのルート フォルダーを右クリックし、[新しい項目の追加 を実行します。

  2. のインストールされているテンプレート] の [Web フォーム します。 ページの既定 Default2.aspx の名前を使えます。

  3. の別のファイルでコードを書き込むかを確認し、 の追加を実行します。

  4. 作成したページの Default2.aspx.cs または Default2.aspx.vb ファイルに切り替えます。

  5. using ( Imports ) ディレクティブ、Visual Basic (C#) を使用して、次の名前空間を追加します。

    Visual Basic
    Imports System.Web.UI.WebControls.Expressions
    Imports System.Data.Linq

    C#
    Using System.Web.UI.WebControls.Expressions;
    using System.Linq;
  6. 部分クラスに次のメソッドを追加します。

    プロパティが示すクエリ列を対象にしてが検索されます ListPrice 3500 の価格を以上搭載した製品。

    Visual Basic
    Protected Sub FilterProducts(ByVal sender As Object, ByVal e As CustomExpressionEventArgs)
            e.Query = From p In e.Query.Cast(Of Product)() _
                      Where p.ListPrice >= 3500 _
                      Select p
        End Sub

    [C#]

    protected void FilterProducts(object sender, CustomExpressionEventArgs e)
    {
            e.Query = from p in e.Query.Cast<Product>()
                      where p.ListPrice >= 3500
                      select p;
    }
    

今度は、データ ソースをページにコントロールとのデータ モデルを使用するよう構成を追加します。 このチュートリアルでは LinqDataSource コントロールを使用します。

データ ソース コントロールを追加するには

  1. デザイン ビューに切り替えます。

  2. のツールボックス、 のデータを展開して、 LinqDataSource コントロール ページ上にドラッグします。

  3. Web サイトを構築します。

  4. スマート タグをクリックし、 のデータ ソースの構成を実行します。

  5. 表示のみ DataContext オブジェクト を選択します。

  6. 選択、コンテキスト オブジェクト[AdventureWorksDataContext を選択し、[次へ] を しています。

  7. のテーブル、 製品 (テーブル < 製品 >) します。

  8. の GroupBy、する なし

  9. を選択すべての列を選択し、 の完了] をクリックします。

    メモ メモ

    選択するすべての列には、をチェックできます * チェック ボックスをオンします。 Web サイト用に、テーブルを格納する列を作成する必要があります。

  10. ウィンドウで、プロパティContextTypeName プロパティを AdventureWorksDataContext を設定します。

  11. ウィンドウで、プロパティTableName プロパティ「製品」を設定します。 マークアップは次の使用例ようになります。

    <asp:LinqDataSource ID="LinqDataSource1" runat="server"
        ContextTypeName="AdventureWorksDataContext" EntityTypeName=""  
        TableName="Products" >
    </asp:LinqDataSource>
    

ユーザー設定フィルターの実行

このセクションを追加しますカスタム クエリを実行できるフィルター コントロールを追加します。

フィルター コントロールを追加するには

  1. ソース ビューに切り替えます。

  2. body 要素内の LinqDataSource コントロールの終了タグの後、次のマークアップをページに追加します。

    <asp:QueryExtender runat="server" TargetControlID="LinqDataSource1">
    </asp:QueryExtender>
    

    この、QueryExtender コントロール、ページに追加され、その関連付けられたデータ ソース コントロールを追加した LinqDataSource コントロールを設定します。

  3. タグと終了タグ、QueryExtender コントロールの間 CustomExpression フィルター追加し、FilterProducts OnQueryingその イベントを設定します。

    マークアップは次のようになります。

    <asp:CustomExpression OnQuerying="FilterProducts"></asp:CustomExpression>
    
  4. のツールボックスから GridView コントロールをページにドラッグし、次の例のようには、そのプロパティを設定します。

    <asp:GridView ID="GridView1" runat="server"  
        DataSourceID="LinqDataSource1"   
        DataKeyNames="ProductID"  AllowPaging="True">
    </asp:GridView>
    

    結果のデータをフィルター処理、GridView コントロールに表示されます。

ここで、カスタム フィルターをテストできます。

Web サイトをテストするには

  • Ctrl キーを押しながら F5 キーを押してページを実行します。

    返されるデータには 3500 の価格をしている製品のみ以上が含まれます。

このチュートリアルが完了したら後の次の使用例表示、Web サイトの Default.aspx ページのマークアップの例は。

<html  >
<head runat="server">
    <title>Filter Demo</title>
</head>
<body>
    <form id="form1" runat="server">
    Search:<asp:TextBox ID="SearchTextBox" runat="server" />
    <p>
    
        Make More:<asp:CheckBox ID="MakeCheckBox" runat="server" />
    <p>
        From:<asp:TextBox ID="FromTextBox" runat="server" ></asp:TextBox>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        To:<asp:TextBox ID="ToTextBox" runat="server" ></asp:TextBox>
    </p>
    <p>
    <asp:Button ID="Button1" runat="server" Text="Search" />
    </p>
    <asp:LinqDataSource ID="LinqDataSource1"  
        ContextTypeName="FilterDemo.AdventureWorksDataContext"  
        TableName="Products" runat="server"> 
    </asp:LinqDataSource>
    <asp:QueryExtender runat="server" TargetControlID="LinqDataSource1">
    
    <asp:SearchExpression SearchType="StartsWith" DataFields="Name" >
    <asp:ControlParameter ControlID="SearchTextBox" />
    </asp:SearchExpression>
    
    <asp:RangeExpression DataField="ReorderPoint" MinType="Inclusive" MaxType="Inclusive">
    <asp:ControlParameter  ControlID="FromTextBox" />
    <asp:ControlParameter  ControlID="ToTextBox" />
    </asp:RangeExpression>
    
<asp:PropertyExpression>
    <asp:ControlParameter ControlID="MakeCheckBox" Name="MakeFlag" />
    </asp:PropertyExpression>
    </asp:QueryExtender>
    
<asp:GridView ID="GridView1" runat="server"  
     DataSourceID="LinqDataSource1" AllowPaging="True"    
     DataKeyNames="ProductID>
</asp:GridView>
    </form>
    
    </body>
    </html>

このチュートリアルが完了したら後の次の使用例表示、Web サイトの [Deafault2.aspx] ページのマークアップの例は。

<html >
<head runat="server">
    <title>Custom Filter</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    <asp:LinqDataSource ID="LinqDataSource1" runat="server" 
        ContextTypeName="AdventureWorksDataContext" EntityTypeName="" 
        TableName="Products">
    </asp:LinqDataSource>
    
    <asp:QueryExtender ID="QueryExtender1" runat="server" TargetControlID="LinqDataSource1">
        <asp:CustomExpression OnQuerying="FilterProducts"></asp:CustomExpression>
    </asp:QueryExtender>

    <asp:GridView ID="GridView1" runat="server"  
        DataSourceID="LinqDataSource1"   
        DataKeyNames="ProductID"  AllowPaging="True">
    </asp:GridView>
    </form>
</body>
</html>

このチュートリアルが完了したら後の次の使用例表示、カスタムの LINQ クエリ Default2.aspx.vb または Default2.aspx.cs ファイル内のコードの例は。

Visual Basic
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.Expressions
Imports System.Data.Linq

Partial Class CustomVB
    Inherits System.Web.UI.Page

    Protected Sub FilterProducts(ByVal sender As Object, ByVal e As CustomExpressionEventArgs)
        e.Query = From p In e.Query.Cast(Of Product)() _
            Where p.ListPrice >= 3500 _
            Select p
    End Sub

[C#]

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.Expressions;
using System.Linq;

public partial class _Default : System.Web.UI.Page 
{
    protected void FilterProducts(object sender, CustomExpressionEventArgs e)
    {
        e.Query = from p in e.Query.Cast<Product>()
                  where p.ListPrice >= 3500
                  select p;
    }
}

このチュートリアルでは、QueryExtender コントロール データのフィルターを使用して宣言構文を使用しています。 QueryExtender コントロールには複数のフィルター オプションがこのチュートリアルで説明されたよりも用意されています。 場合は、次の試してください。

  • OrderByExpression ThenBy フィルターは、Web ページへの追加によってには、データを並べ替えます。

  • MethodExpression フィルターを使用してカスタム フィルターを作成します。 詳細については、「MethodExpression」を参照してください。

    メモ メモ

    QueryExtender コントロールは、 DynamicFilterControlFilterExpression コントロール追加フィルタリングを提供する ASP.NET データの動的な Web サイトで使用できる提供されます。 これらのフィルターは、ASP.NET データの動的な Web サイトでのみサポートされます。 詳細については、「QueryExtender」を参照してください。

© 2009 Microsoft Corporation. All rights reserved. 使用条件 | 商標 | プライバシー
Page view tracker