Yeni Kayıt Eklerken Karşıya Dosya Yükleme Seçeneği Ekleme (C#)Including a File Upload Option When Adding a New Record (C#)

Scott Mitchell tarafındanby Scott Mitchell

Örnek uygulamayı indirin veya PDF 'yi indirinDownload Sample App or Download PDF

Bu öğreticide, kullanıcının metin verileri girmesine ve ikili dosyaları yüklemesine izin veren bir Web arabirimi oluşturma işleminin nasıl yapılacağı gösterilmektedir.This tutorial shows how to create a Web interface that allows the user to both enter text data and upload binary files. İkili verileri depolamak için kullanılabilen seçenekleri göstermek için, diğeri dosya sisteminde depolanırken bir dosya veritabanına kaydedilir.To illustrate the options available to store binary data, one file will be saved in the database while the other is stored in the file system.

GirişIntroduction

Önceki iki öğreticide, uygulama veri modeliyle ilişkili ikili verileri depolama tekniklerini araştırırken, dosyaları istemciden Web sunucusuna göndermek için dosya yükleme denetiminin nasıl kullanılacağı ve bu ikili verilerin bir veri W 'da nasıl görüntüleneceği gördünüz. EB denetimi.In the previous two tutorials we explored techniques for storing binary data that is associated with the application s data model, looked at how to use the FileUpload control to send files from the client to the web server, and saw how to present this binary data in a data Web control. Yine de karşıya yüklenen verileri veri modeliyle ilişkilendirme hakkında konuşuyoruz, ancak.We ve yet to talk about how to associate uploaded data with the data model, though.

Bu öğreticide, yeni bir kategori eklemek için bir Web sayfası oluşturacağız.In this tutorial we will create a web page to add a new category. Kategori adı ve açıklaması için metin kutularına ek olarak, bu sayfanın yeni kategori s resmi ve bir broşür için bir tane olmak üzere iki dosya yükleme denetimini içermesi gerekir.In addition to TextBoxes for the category s name and description, this page will need to include two FileUpload controls one for the new category s picture and one for the brochure. Karşıya yüklenen resim, yeni kayıt s Picture sütununda doğrudan depolanacak, ancak broşür yeni kayıt s BrochurePath sütununda kaydedilen dosyanın yoluyla ~/Brochures klasöre kaydedilir.The uploaded picture will be stored directly in the new record s Picture column, whereas the brochure will be saved to the ~/Brochures folder with the path to the file saved in the new record s BrochurePath column.

Bu yeni Web sayfasını oluşturmadan önce mimariyi güncelleştirmeniz gerekir.Before creating this new web page, we'll need to update the architecture. CategoriesTableAdapter s ana sorgusu Picture sütununu almaz.The CategoriesTableAdapter s main query does not retrieve the Picture column. Sonuç olarak, otomatik olarak oluşturulan Insert yönteminin yalnızca CategoryName, Descriptionve BrochurePath alanları için girişleri vardır.Consequently, the auto-generated Insert method only has inputs for the CategoryName, Description, and BrochurePath fields. Bu nedenle, TableAdapter 'ta dört Categories alanı için istemde bulunan ek bir yöntem oluşturuyoruz.Therefore, we need to create an additional method in the TableAdapter that prompts for all four Categories fields. Iş mantığı katmanındaki CategoriesBLL sınıfının de güncellenmesi gerekir.The CategoriesBLL class in the Business Logic Layer will also need to be updated.

1. Adım:CategoriesTableAdapter``InsertWithPictureyöntemi eklemeStep 1: Adding anInsertWithPictureMethod to theCategoriesTableAdapter

Veri erişim katmanı oluşturma öğreticisinde geri CategoriesTableAdapter oluşturduğumuz, bunu ana sorguya göre otomatik olarak INSERT, UPDATEve DELETE deyimlerini oluşturacak şekilde yapılandırdık.When we created the CategoriesTableAdapter back in the Creating a Data Access Layer tutorial, we configured it to automatically generate INSERT, UPDATE, and DELETE statements based on the main query. Üstelik, TableAdapter 'ın Insert, Updateve Delete' i oluşturan VERITABANı doğrudan yaklaşımını benimseme konusunda talimat verdik.Moreover, we instructed the TableAdapter to employ the DB Direct approach, which created the methods Insert, Update, and Delete. Bu yöntemler, otomatik olarak oluşturulan INSERT, UPDATEve DELETE deyimlerini yürütür ve sonuç olarak ana sorgu tarafından döndürülen sütunlara göre giriş parametrelerini kabul eder.These methods execute the auto-generated INSERT, UPDATE, and DELETE statements and, consequently, accept input parameters based on the columns returned by the main query. Dosyaları karşıya yükleme öğreticisinde, BrochurePath sütununu kullanmak için CategoriesTableAdapter s ana sorgusunu genişlettik.In the Uploading Files tutorial we augmented the CategoriesTableAdapter s main query to use the BrochurePath column.

CategoriesTableAdapter s ana sorgusu Picture sütununa başvurmadığından, yeni bir kayıt eklememiz veya mevcut bir kaydı Picture sütunu için bir değer ile güncelleştirebiliriz.Since the CategoriesTableAdapter s main query does not reference the Picture column, we can neither add a new record nor update an existing record with a value for the Picture column. Bu bilgileri yakalamak için, TableAdapter 'ta ikili verilerle bir kayıt eklemek için kullanılan yeni bir yöntem oluşturabilir ya da otomatik olarak oluşturulan INSERT ifadesini özelleştirebiliriz.In order to capture this information, we can either create a new method in the TableAdapter that is used specifically to insert a record with binary data or we can customize the auto-generated INSERT statement. Otomatik olarak oluşturulan INSERT deyimin özelleştirilmesi sorunu, özelleştirmelerimizin üzerine, sihirbaz tarafından geçersiz kılınmasından risklidir.The problem with customizing the auto-generated INSERT statement is that we risk having our customizations overwritten by the wizard. Örneğin, Picture sütununun kullanımını dahil etmek için INSERT ifadesini özelleştirdiğinizi düşünün.For example, imagine that we customized the INSERT statement to include use of the Picture column. Bu, TableAdapter s Insert yöntemini, kategori s Picture s ikili verileri için ek bir giriş parametresi içerecek şekilde güncelleştirir.This would update the TableAdapter s Insert method to include an additional input parameter for the category s picture s binary data. Daha sonra bu DAL yöntemini kullanmak için Iş mantığı katmanında bir yöntem oluşturabilir ve bu BLL metodunu sunum katmanı üzerinden çağırabilirsiniz ve her şey wonderfully çalışacaktır.We could then create a method in the Business Logic Layer to use this DAL method and invoke this BLL method through the Presentation Layer, and everything would work wonderfully. Diğer bir deyişle, TableAdapter Yapılandırma Sihirbazı aracılığıyla TableAdapter 'ı yapılandırdığımızda.That is, until the next time we configured the TableAdapter through the TableAdapter Configuration wizard. Sihirbaz tamamlandıktan hemen sonra, INSERT deyimindeki özelleştirmelerimiz üzerine yazılır, Insert yöntemi eski biçimine döndürülür ve kodumuz artık derlenmeyebilir!As soon as the wizard completed, our customizations to the INSERT statement would be overwritten, the Insert method would revert to its old form, and our code would no longer compile!

Note

Bu annoyance, ad-hoc SQL deyimleri yerine saklı yordamlar kullanılırken bir sorun değildir.This annoyance is a non-issue when using stored procedures instead of ad-hoc SQL statements. Gelecekteki bir öğreticide, veri erişim katmanında geçici SQL deyimleri yerine saklı yordamlar kullanılarak araştırılacak.A future tutorial will explore using stored procedures in lieu of ad-hoc SQL statements in the Data Access Layer.

Bunun yerine, otomatik olarak oluşturulan SQL deyimlerini özelleştirmek yerine, bu olası headache 'i önlemek için TableAdapter için yeni bir yöntem oluşturun.To avoid this potential headache, rather than customizing the auto-generated SQL statements let s instead create a new method for the TableAdapter. InsertWithPictureadlı bu yöntem, CategoryName, Description, BrochurePathve Picture sütunlarının değerlerini kabul eder ve tüm dört değeri yeni bir kayıtta depolayan bir INSERT ifadesini yürütür.This method, named InsertWithPicture, will accept values for the CategoryName, Description, BrochurePath, and Picture columns and execute an INSERT statement that stores all four values in a new record.

Türü belirtilmiş veri kümesini açın ve tasarımcıdan CategoriesTableAdapter s başlığına sağ tıklayıp bağlam menüsünden sorgu Ekle ' yi seçin.Open the Typed DataSet and, from the Designer, right-click on the CategoriesTableAdapter s header and choose Add Query from the context menu. Bu, TableAdapter sorgusunun veritabanına nasıl erişmesi gerektiğini bize sorarak başlayan TableAdapter sorgu Yapılandırma Sihirbazı 'nı başlatır.This launches the TableAdapter Query Configuration Wizard, which begins by asking us how the TableAdapter query should access the database. SQL deyimlerini kullan ' ı seçin ve Ileri ' ye tıklayın.Choose Use SQL statements and click Next. Sonraki adım, oluşturulacak sorgu türünü sorar.The next step prompts for the type of query to be generated. Categories tabloya yeni bir kayıt eklemek için bir sorgu oluşturduğumuz için, Ekle ' yi seçin ve Ileri ' ye tıklayın.Since we re creating a query to add a new record to the Categories table, choose INSERT and click Next.

Ekle seçeneğini belirleyinSelect the INSERT Option

Şekil 1: Ekle seçeneğini belirleyin (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 1: Select the INSERT Option (Click to view full-size image)

Artık INSERT SQL ifadesini belirtmemiz gerekir.We now need to specify the INSERT SQL statement. Sihirbaz, TableAdapter s ana sorgusuna karşılık gelen bir INSERT ifadesini otomatik olarak önerir.The wizard automatically suggests an INSERT statement corresponding to the TableAdapter s main query. Bu durumda, CategoryName, Descriptionve BrochurePath değerlerini ekleyen bir INSERT deyimidir.In this case, it s an INSERT statement that inserts the CategoryName, Description, and BrochurePath values. Picture sütunun bir @Picture parametresiyle birlikte dahil edilmesini sağlamak için ifadeyi güncelleştirin, örneğin:Update the statement so that the Picture column is included along with a @Picture parameter, like so:

INSERT INTO [Categories] 
    ([CategoryName], [Description], [BrochurePath], [Picture]) 
VALUES 
    (@CategoryName, @Description, @BrochurePath, @Picture)

Sihirbazın son ekranında yeni TableAdapter metodunu adlandırma bize sorulur.The final screen of the wizard asks us to name the new TableAdapter method. InsertWithPicture girin ve son ' a tıklayın.Enter InsertWithPicture and click Finish.

yeni TableAdapter metodunu ınsertwithpicture olarak adlandırınName the New TableAdapter Method InsertWithPicture

Şekil 2: yeni TableAdapter metodunu adlandırma InsertWithPicture (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 2: Name the New TableAdapter Method InsertWithPicture (Click to view full-size image)

2. Adım: Iş mantığı katmanını güncelleştirmeStep 2: Updating the Business Logic Layer

Sunum katmanı yalnızca veri erişim katmanına doğrudan gitmek yerine yalnızca Iş mantığı katmanıyla arabirim gerektirdiğinden, yeni oluşturduğumuz DAL yöntemini (InsertWithPicture) çağıran bir BLL yöntemi oluşturuyoruz.Since the Presentation Layer should only interface with the Business Logic Layer rather than bypassing it to go directly to the Data Access Layer, we need to create a BLL method that invokes the DAL method we just created (InsertWithPicture). Bu öğreticide, giriş üç string ve bir byte dizisi olarak kabul eden InsertWithPicture adlı CategoriesBLL sınıfında bir yöntem oluşturun.For this tutorial, create a method in the CategoriesBLL class named InsertWithPicture that accepts as input three string s and a byte array. string giriş parametreleri, kategori s adı, açıklaması ve broşür dosya yolu için, byte dizisi ise kategori s resminin ikili içeriğine yöneliktir.The string input parameters are for the category s name, description, and brochure file path, while the byte array is for the binary contents of the category s picture. Aşağıdaki kodda gösterildiği gibi, bu BLL yöntemi karşılık gelen DAL yöntemini çağırır:As the following code shows, this BLL method invokes the corresponding DAL method:

[System.ComponentModel.DataObjectMethodAttribute
    (System.ComponentModel.DataObjectMethodType.Insert, false)] 
public void InsertWithPicture(string categoryName, string description, 
    string brochurePath, byte[] picture)
{
    Adapter.InsertWithPicture(categoryName, description, brochurePath, picture);
}

Note

InsertWithPicture metodunu BLL 'e eklemeden önce, yazılan veri kümesini kaydettiğinizden emin olun.Make sure that you have saved the Typed DataSet before adding the InsertWithPicture method to the BLL. CategoriesTableAdapter sınıfı kodu, türü belirtilmiş veri kümesine göre otomatik olarak oluşturulduğundan, yaptığınız değişiklikleri ilk olarak yazılan veri kümesine kaydedemezsiniz Adapter özelliği InsertWithPicture yöntemi hakkında bilgi vermez.Since the CategoriesTableAdapter class code is auto-generated based on the Typed DataSet, if you don t first save your changes to the Typed DataSet the Adapter property won't know about the InsertWithPicture method.

3. Adım: mevcut kategorileri ve bunların Ikili verilerini listelemeStep 3: Listing the Existing Categories and their Binary Data

Bu öğreticide, son kullanıcının sisteme yeni bir kategori eklemesine izin veren bir sayfa oluşturacak ve yeni kategori için bir resim ve broşür sağlamamız gerekir.In this tutorial we will create a page that allows an end user to add a new category to the system, providing a picture and brochure for the new category. Önceki öğreticide , her bir kategorinin adını, açıklamasını, resmini ve bir bağlantıyı, onun broşürini indirmek için bir bağlantı görüntüleyecek bir TemplateField ve ImageField Içeren bir GridView kullandık.In the preceding tutorial we used a GridView with a TemplateField and ImageField to display each category s name, description, picture, and a link to download its brochure. Bu öğreticide, her iki mevcut kategoriyi listeleyen ve yenilerini oluşturulmasına izin veren bir sayfa oluşturmak için bu işlevselliği çoğaltmasına izin verin.Let s replicate that functionality for this tutorial, creating a page that both lists all existing categories and allows for new ones to be created.

BinaryData klasöründen DisplayOrDownload.aspx sayfasını açarak başlayın.Start by opening the DisplayOrDownload.aspx page from the BinaryData folder. Kaynak görünümüne gidin ve GridView ve ObjectDataSource öğelerinin bildirime dayalı sözdizimini kopyalayın ve UploadInDetailsView.aspx``<asp:Content> öğesi içinde yapıştırın.Go to the Source view and copy the GridView and ObjectDataSource s declarative syntax, pasting it within the <asp:Content> element in UploadInDetailsView.aspx. Ayrıca, DisplayOrDownload.aspx arka plan kod sınıfından UploadInDetailsView.aspx``GenerateBrochureLink yöntemi kopyalamayı unutmayın.Also, don t forget to copy over the GenerateBrochureLink method from the code-behind class of DisplayOrDownload.aspx to UploadInDetailsView.aspx.

DisplayOrDownload. aspx konumundan Uploadındetailsview. aspx ' e bildirim temelli sözdizimini kopyalayıp yapıştırınCopy and Paste the Declarative Syntax from DisplayOrDownload.aspx to UploadInDetailsView.aspx

Şekil 3: DisplayOrDownload.aspx bildirime dayalı sözdizimini kopyalayıp UploadInDetailsView.aspx yapıştırın (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 3: Copy and Paste the Declarative Syntax from DisplayOrDownload.aspx to UploadInDetailsView.aspx (Click to view full-size image)

Bildirim temelli sözdizimini ve GenerateBrochureLink yöntemini UploadInDetailsView.aspx sayfasına kopyaladıktan sonra, her şeyin doğru şekilde kopyalandığından emin olmak için sayfayı bir tarayıcı üzerinden görüntüleyin.After copying the declarative syntax and GenerateBrochureLink method over to the UploadInDetailsView.aspx page, view the page through a browser to ensure that everything was copied over correctly. Broşür ve kategori s resmini indirmek için bir bağlantı içeren sekiz kategorinin listelendiği bir GridView görmeniz gerekir.You should see a GridView listing the eight categories that includes a link to download the brochure as well as the category s picture.

her kategoriyi Ikili verilerle birlikte görmeniz gerekirYou Should Now See Each Category Along with Its Binary Data

Şekil 4: artık her kategoriyi Ikili verilerle birlikte görmeniz gerekir (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 4: You Should Now See Each Category Along with Its Binary Data (Click to view full-size image)

4. Adım: eklemeyi desteklemek içinCategoriesDataSourceyapılandırmaStep 4: Configuring theCategoriesDataSourceto Support Inserting

Categories GridView tarafından kullanılan CategoriesDataSource ObjectDataSource Şu anda veri ekleme özelliği sağlamıyor.The CategoriesDataSource ObjectDataSource used by the Categories GridView currently does not provide the ability to insert data. Bu veri kaynağı denetimini eklemeyi desteklemek için, Insert yöntemini temel alınan nesnesindeki bir yönteme eşliyoruz gerekir, CategoriesBLL.In order to support inserting through this data source control, we need to map its Insert method to a method in its underlying object, CategoriesBLL. Özellikle, bu dosyayı adım 2 ' de geri eklediğimiz CategoriesBLL yöntemiyle eşlemek istiyoruz InsertWithPicture.In particular, we want to map it to the CategoriesBLL method we added back in Step 2, InsertWithPicture.

Başlat ' ın akıllı etiketinden veri kaynağını Yapılandır bağlantısına tıklayarak başlayın.Start by clicking the Configure Data Source link from the ObjectDataSource s smart tag. İlk ekranda, veri kaynağının ile birlikte çalışmak üzere yapılandırıldığı nesne gösterilir CategoriesBLL.The first screen shows the object the data source is configured to work with, CategoriesBLL. Bu ayarı olduğu gibi bırakın ve veri yöntemlerini tanımla ekranına ilerlemek için Ileri ' ye tıklayın.Leave this setting as-is and click Next to advance to the Define Data Methods screen. Ekle sekmesine gidin ve açılan listeden InsertWithPicture yöntemini seçin.Move to the INSERT tab and pick the InsertWithPicture method from the drop-down list. Sihirbazı tamamladığınızda son ' a tıklayın.Click Finish to complete the wizard.

ınsertwithpicture metodunu kullanmak için ObjectDataSource 'ı yapılandırmaConfigure the ObjectDataSource to use the InsertWithPicture Method

Şekil 5: InsertWithPicture yöntemini kullanmak için ObjectDataSource 'ı yapılandırın (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 5: Configure the ObjectDataSource to use the InsertWithPicture Method (Click to view full-size image)

Note

Sihirbaz tamamlandıktan sonra Visual Studio, veri Web denetimleri alanlarını yeniden oluşturacak alanları ve anahtarları yenilemek isteyip istemediğinizi sorabilir.Upon completing the wizard, Visual Studio may ask if you want to Refresh Fields and Keys, which will regenerate the data Web controls fields. Evet ' i seçmek, yapmış olduğunuz tüm alan özelleştirmelerinin üzerine yazacak şekilde Hayır ' ı seçin.Choose No, because choosing Yes will overwrite any field customizations you may have made.

Sihirbazı tamamladıktan sonra, ObjectDataSource artık InsertMethod özelliği için bir değer ve dört Kategori sütunu için InsertParameters ve aşağıdaki bildirime dayalı biçimlendirme gösterilmektedir:After completing the wizard, the ObjectDataSource will now include a value for its InsertMethod property as well as InsertParameters for the four category columns, as the following declarative markup illustrates:

<asp:ObjectDataSource ID="CategoriesDataSource" runat="server" 
    OldValuesParameterFormatString="original_{0}" SelectMethod="GetCategories" 
    TypeName="CategoriesBLL" InsertMethod="InsertWithPicture">
    <InsertParameters>
        <asp:Parameter Name="categoryName" Type="String" />
        <asp:Parameter Name="description" Type="String" />
        <asp:Parameter Name="brochurePath" Type="String" />
        <asp:Parameter Name="picture" Type="Object" />
    </InsertParameters>
</asp:ObjectDataSource>

5. Adım: ekleme arabirimi oluşturmaStep 5: Creating the Inserting Interface

Veri ekleme, güncelleştirme ve silme konusunda genel bakışkapsamında, DetailsView denetimi, eklemeyi destekleyen bir veri kaynağı denetimiyle çalışırken kullanılabilecek bir yerleşik ekleme arabirimi sağlar.As first covered in the An Overview of Inserting, Updating, and Deleting Data, the DetailsView control provides a built-in inserting interface that can be utilized when working with a data source control that supports inserting. Ekleme arabirimini kalıcı olarak işleyecek GridView 'un bu sayfaya bir DetailsView denetimi ekleyelim, böylece bir kullanıcının kolayca yeni bir kategori eklemesine izin verilir.Let s add a DetailsView control to this page above the GridView that will permanently render its inserting interface, allowing a user to quickly add a new category. DetailsView 'a yeni bir kategori eklendiğinde, bunun altındaki GridView otomatik olarak yenilenir ve yeni kategoriyi görüntüler.Upon adding a new category in the DetailsView, the GridView beneath it will automatically refresh and display the new category.

Araç kutusundan GridView 'un üzerindeki tasarımcı üzerine bir DetailsView sürükleyip ID özelliğini NewCategory ve Height ve Width özellik değerlerini temizleyerek başlatın.Start by dragging a DetailsView from the Toolbox onto the Designer above the GridView, setting its ID property to NewCategory and clearing out the Height and Width property values. DetailsView 'un akıllı etiketinde, mevcut CategoriesDataSource bağlayın ve sonra eklemeyi etkinleştir onay kutusunu işaretleyin.From the DetailsView s smart tag, bind it to the existing CategoriesDataSource and then check the Enable Inserting checkbox.

DetailsView öğesini Kategorilerverikaynağına bağlamak ve ekleme özelliğini etkinleştirmek Bind the DetailsView to the CategoriesDataSource and Enable Inserting

Şekil 6: DetailsView 'ı CategoriesDataSource bağlayın ve eklemeyi etkinleştirin (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 6: Bind the DetailsView to the CategoriesDataSource and Enable Inserting (Click to view full-size image)

DetailsView 'u ekleme arabiriminde kalıcı olarak işlemek için DefaultMode özelliğini Insertolarak ayarlayın.To permanently render the DetailsView in its inserting interface, set its DefaultMode property to Insert.

DetailsView 'un BrochurePath özelliği CategoryID olarak ayarlandığı için, InsertVisible BoundField CategoryID, CategoryName, Description, NumberOfProductsve falsebeş BoundFields olduğunu unutmayın.Note that the DetailsView has five BoundFields CategoryID, CategoryName, Description, NumberOfProducts, and BrochurePath although the CategoryID BoundField is not rendered in the inserting interface because its InsertVisible property is set to false. Bu BoundFields, ObjectDataSource 'un verileri almak için çağırdığı GetCategories() yöntemi tarafından döndürülen sütunlar olduklarından oluşur.These BoundFields exists because they are the columns returned by the GetCategories() method, which is what the ObjectDataSource invokes to retrieve its data. Bununla birlikte, ekleme için kullanıcının NumberOfProductsbir değer belirtmesini istiyorum.For inserting, however, we don t want to let the user specify a value for NumberOfProducts. Üstelik, bu kullanıcıların yeni kategori için bir resim yüklemesine ve broşür için bir PDF 'YI karşıya yüklemesine izin vermemiz gerekir.Moreover, we need to allow them to upload a picture for the new category as well as upload a PDF for the brochure.

DetailsView NumberOfProducts BoundField öğesini tamamen kaldırın ve ardından CategoryName ve BrochurePath BoundFields HeaderText özelliklerini sırasıyla kategori ve broşür olarak güncelleştirin.Remove the NumberOfProducts BoundField from the DetailsView altogether and then update the HeaderText properties of the CategoryName and BrochurePath BoundFields to Category and Brochure, respectively. Sonra, BrochurePath BoundField öğesini TemplateField öğesine dönüştürün ve resme yeni bir TemplateField ekleyin, bu yeni TemplateField değerini bir resim HeaderText olarak verir.Next, convert the BrochurePath BoundField into a TemplateField and add a new TemplateField for the picture, giving this new TemplateField a HeaderText value of Picture. Picture TemplateField alanını BrochurePath TemplateField ve CommandField arasında olacak şekilde taşıyın.Move the Picture TemplateField so that it is between the BrochurePath TemplateField and CommandField.

DetailsView 'u Kategorilerverikaynağına bağlayın ve eklemeyi etkinleştirin

Şekil 7: DetailsView 'ı CategoriesDataSource bağlayın ve eklemeyi etkinleştirinFigure 7: Bind the DetailsView to the CategoriesDataSource and Enable Inserting

Alanları Düzenle iletişim kutusu aracılığıyla BrochurePath BoundField öğesini bir TemplateField 'a dönüştürdüyseniz, TemplateField bir ItemTemplate, EditItemTemplateve InsertItemTemplateiçerir.If you converted the BrochurePath BoundField into a TemplateField through the Edit Fields dialog box, the TemplateField includes an ItemTemplate, EditItemTemplate, and InsertItemTemplate. Ancak yalnızca InsertItemTemplate gereklidir, bu nedenle diğer iki şablonu kaldırmayı ücretsiz olarak hissetmekten çekinmeyin.Only the InsertItemTemplate is needed, however, so feel free to remove the other two templates. Bu noktada, DetailsView 'un bildirime dayalı sözdizimi aşağıdaki gibi görünmelidir:At this point your DetailsView s declarative syntax should look like the following:

<asp:DetailsView ID="NewCategory" runat="server" AutoGenerateRows="False" 
    DataKeyNames="CategoryID" DataSourceID="CategoriesDataSource" 
    DefaultMode="Insert">
    <Fields>
        <asp:BoundField DataField="CategoryID" HeaderText="CategoryID" 
            InsertVisible="False" ReadOnly="True" 
            SortExpression="CategoryID" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category" 
            SortExpression="CategoryName" />
        <asp:BoundField DataField="Description" HeaderText="Description" 
            SortExpression="Description" />
        <asp:TemplateField HeaderText="Brochure" SortExpression="BrochurePath">
            <InsertItemTemplate>
                <asp:TextBox ID="TextBox1" runat="server"
                    Text='<%# Bind("BrochurePath") %>'></asp:TextBox>
            </InsertItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Picture"></asp:TemplateField>
        <asp:CommandField ShowInsertButton="True" />
    </Fields>
</asp:DetailsView>

Broşür ve resim alanları için dosya yükleme denetimleri eklemeAdding FileUpload Controls for the Brochure and Picture Fields

Şu anda BrochurePath TemplateField InsertItemTemplate bir TextBox içerir, ancak Picture TemplateField herhangi bir şablon içermez.Presently, the BrochurePath TemplateField s InsertItemTemplate contains a TextBox, while the Picture TemplateField does not contain any templates. Bu iki TemplateField s InsertItemTemplate, dosya yükleme denetimlerini kullanacak şekilde güncelleştirmemiz gerekiyor.We need to update these two TemplateField s InsertItemTemplate s to use FileUpload controls.

DetailsView 'un akıllı etiketinde Şablonları Düzenle seçeneğini belirleyin ve ardından açılan listeden BrochurePath TemplateField InsertItemTemplate ' ı seçin.From the DetailsView s smart tag, choose the Edit Templates option and then select the BrochurePath TemplateField s InsertItemTemplate from the drop-down list. TextBox ' ı kaldırın ve ardından araç kutusundan bir dosya yükleme denetimini şablona sürükleyin.Remove the TextBox and then drag a FileUpload control from the Toolbox into the template. Dosya karşıya yükleme denetim s ID BrochureUploadolarak ayarlayın.Set the FileUpload control s ID to BrochureUpload. Benzer şekilde, Picture TemplateField s InsertItemTemplatebir dosya karşıya yükleme denetimi ekleyin.Similarly, add a FileUpload control to the Picture TemplateField s InsertItemTemplate. Bu dosya yükleme denetim s ID PictureUploadolarak ayarlayın.Set this FileUpload control s ID to PictureUpload.

InsertItemTemplate 'e dosya yükleme denetimi ekleme Add a FileUpload Control to the InsertItemTemplate

Şekil 8: InsertItemTemplate bir dosya yükleme denetimi ekleme (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 8: Add a FileUpload Control to the InsertItemTemplate (Click to view full-size image)

Bu eklemeleri yaptıktan sonra, iki TemplateField bildirim sözdizimi şu şekilde olur:After making these additions, the two TemplateField s declarative syntax will be:

<asp:TemplateField HeaderText="Brochure" SortExpression="BrochurePath">
    <InsertItemTemplate>
        <asp:FileUpload ID="BrochureUpload" runat="server" />
    </InsertItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Picture">
    <InsertItemTemplate>
        <asp:FileUpload ID="PictureUpload" runat="server" />
    </InsertItemTemplate>
</asp:TemplateField>

Bir Kullanıcı yeni bir kategori eklediğinde, broşür ve resmin doğru dosya türünde olduğundan emin olmak istiyoruz.When a user adds a new category, we want to ensure that the brochure and picture are of the correct file type. Broşür için kullanıcının bir PDF sağlaması gerekir.For the brochure, the user must supply a PDF. Resimde, kullanıcının bir resim dosyasını karşıya yüklemesi gerekir, ancak herhangi bir görüntü dosyası ya da yalnızca belirli bir türdeki (örneğin, GIF 'Ler veya jpgs) görüntü dosyaları izin veririz.For the picture, we need the user to upload an image file, but do we allow any image file or only image files of a particular type, such as GIFs or JPGs? Farklı dosya türlerine izin vermek için, Categories şemayı, bu türün DisplayCategoryPicture.aspxiçindeki Response.ContentType aracılığıyla istemciye gönderilebilmesi için dosya türünü yakalayan bir sütun içerecek şekilde genişletmemiz gerekir.In order to allow for different file types, we d need to extend the Categories schema to include a column that captures the file type so that this type can be sent to the client through Response.ContentType in DisplayCategoryPicture.aspx. Böyle bir sütun olmadığı için, kullanıcıların yalnızca belirli bir görüntü dosyası türü sağlaması için akıllıca olur.Since we don t have such a column, it would be prudent to restrict users to only providing a specific image file type. Categories tablo var olan görüntüler bit eşlemlerdir, ancak JPGs Web üzerinden sunulan görüntüler için daha uygun bir dosya biçimidir.The Categories table s existing images are bitmaps, but JPGs are a more appropriate file format for images served over the web.

Bir Kullanıcı yanlış bir dosya türünü karşıya yüklediğinde, eklemeyi iptal etmemiz ve sorunu belirten bir ileti görüntülemesi gerekir.If a user uploads an incorrect file type, we need to cancel the insert and display a message indicating the problem. DetailsView 'un altına bir etiket Web denetimi ekleyin.Add a Label Web control beneath the DetailsView. ID özelliğini UploadWarningolarak ayarlayın, Text özelliğini temizleyin, CssClass özelliğini uyarı olarak ayarlayın ve Visible ve EnableViewState özelliklerini false.Set its ID property to UploadWarning, clear out its Text property, set the CssClass property to Warning, and the Visible and EnableViewState properties to false. Warning CSS sınıfı Styles.css tanımlanır ve metni büyük, kırmızı, italik, kalın yazı tipiyle işler.The Warning CSS class is defined in Styles.css and renders the text in a large, red, italicized, bold font.

Note

İdeal olarak, CategoryName ve Description BoundFields alanları TemplateFields 'e, eklenen arabirimleri de özelleştirilmiş olarak dönüştürülür.Ideally, the CategoryName and Description BoundFields would be converted to TemplateFields and their inserting interfaces customized. Örneğin, Description ekleme arabirimi, büyük olasılıkla çok satırlı bir metin kutusuyla daha uygun olabilir.The Description inserting interface, for example, would likely be better suited through a multi-line textbox. CategoryName sütunu NULL değerlerini kabul etmediğinden, kullanıcının yeni kategori s adı için bir değer sağladığından emin olmak için bir RequiredFieldValidator eklenmelidir.And since the CategoryName column does not accept NULL values, a RequiredFieldValidator should be added to ensure the user provides a value for the new category s name. Bu adımlar, okuyucuya bir alıştırma olarak kalır.These steps are left as an exercise to the reader. Veri değiştirme arabirimlerini genişletmekten derinlemesine bir bakış için veri değiştirme arabirimini özelleştirmek üzere geri bakın.Refer back to Customizing the Data Modification Interface for an in-depth look at augmenting the data modification interfaces.

6. Adım: karşıya yüklenen broşürü Web sunucusu s dosya sistemine kaydetmeStep 6: Saving the Uploaded Brochure to the Web Server s File System

Kullanıcı yeni bir kategorinin değerlerini girdiğinde ve Ekle düğmesine tıkladığında, bir geri gönderme gerçekleşir ve iş akışı kaldırılıyor.When the user enters the values for a new category and clicks the Insert button, a postback occurs and the inserting workflow unfolds. İlk olarak, DetailsView ItemInserting olayı ateşlenir.First, the DetailsView s ItemInserting event fires. Ardından, ObjectDataSource s Insert() yöntemi çağrılır ve bu, Categories tablosuna yeni bir kaydın eklenmesine neden olur.Next, the ObjectDataSource s Insert() method is invoked, which results in a new record being added to the Categories table. Bundan sonra, DetailsView ItemInserted olayı ateşlenir.After that, the DetailsView s ItemInserted event fires.

ObjectDataSource Insert() yöntemi çağrılmadan önce, önce uygun dosya türlerinin Kullanıcı tarafından karşıya yüklendiğinden emin olunması ve sonra Broşür PDF 'YI Web sunucusu s dosya sistemine kaydetmeniz gerekir.Before the ObjectDataSource s Insert() method is invoked, we must first ensure that the appropriate file types were uploaded by the user and then save the brochure PDF to the web server s file system. DetailsView ItemInserting olayı için bir olay işleyicisi oluşturun ve aşağıdaki kodu ekleyin:Create an event handler for the DetailsView s ItemInserting event and add the following code:

// Reference the FileUpload control
FileUpload BrochureUpload = 
    (FileUpload)NewCategory.FindControl("BrochureUpload");
if (BrochureUpload.HasFile)
{
    // Make sure that a PDF has been uploaded
    if (string.Compare(System.IO.Path.GetExtension
        (BrochureUpload.FileName), ".pdf", true) != 0)
    {
        UploadWarning.Text = 
            "Only PDF documents may be used for a category's brochure.";
        UploadWarning.Visible = true;
        e.Cancel = true;
        return;
    }
}

Olay işleyicisi, DetailsView 'un şablonlarından BrochureUpload FileUpload denetimine başvurulduğunda başlar.The event handler starts by referencing the BrochureUpload FileUpload control from the DetailsView s templates. Daha sonra, bir broşür karşıya yüklenmişse karşıya yüklenen dosya uzantıları incelenir.Then, if a brochure has been uploaded, the uploaded file s extension is examined. Uzantı yoksa. PDF, sonra bir uyarı görüntülenir, ekleme iptal edilir ve olay işleyicisinin yürütülmesi sona erer.If the extension is not .PDF, then a warning is displayed, the insert is cancelled, and the execution of the event handler ends.

Note

Karşıya yüklenen dosya uzantısına bağlı olarak, karşıya yüklenen dosyanın bir PDF belgesi olduğundan emin olmak için bir,-Fire yöntemi değildir.Relying on the uploaded file s extension is not a sure-fire technique for ensuring that the uploaded file is a PDF document. Kullanıcının uzantısı .Brochuregeçerli bir PDF belgesi olabilir ya da PDF olmayan bir belge alınmış ve bir .pdf uzantısı vermiş olabilir.The user could have a valid PDF document with the extension .Brochure, or could have taken a non-PDF document and given it a .pdf extension. Dosya türünü daha yaratacağı doğrulamak için dosyanın ikili içeriğinin programlı bir şekilde incelenmesi gerekir.The file s binary content would need to be programmatically examined in order to more conclusively verify the file type. Ancak, bu tür kapsamlı yaklaşımlar genellikle fazla sonlandırılmalıdır; uzantının çoğu senaryo için yeterli olup olmadığı denetleniyor.Such thorough approaches, though, are often overkill; checking the extension is sufficient for most scenarios.

Dosyaları karşıya yükleme öğreticisinde açıklandığı gibi, bir kullanıcının karşıya yüklenmesi başka bir veritabanının üzerine yazılmaması için dosyaları dosya sistemine kaydederken dikkatli olunmalıdır.As discussed in the Uploading Files tutorial, care must be taken when saving files to the file system so that one user s upload does not overwrite another s. Bu öğretici için karşıya yüklenen dosyayla aynı adı kullanmayı deneyeceğiz.For this tutorial we will attempt to use the same name as the uploaded file. ~/Brochures dizininde aynı dosya adıyla bir dosya zaten varsa, benzersiz bir ad bulunana kadar sonuna bir sayı eklenir.If there already exists a file in the ~/Brochures directory with that same file name, however, we'll append a number at the end until a unique name is found. Örneğin, Kullanıcı Meats.pdfadlı bir broşür dosyasını karşıya yüklediğinde, ancak ~/Brochures klasöründe Meats.pdf adında bir dosya zaten varsa, kaydedilen dosya adını Meats-1.pdfolarak değiştireceksiniz.For example, if the user uploads a brochure file named Meats.pdf, but there is already a file named Meats.pdf in the ~/Brochures folder, we'll change the saved file name to Meats-1.pdf. Bu varsa, benzersiz bir dosya adı bulunana kadar Meats-2.pdf, vb. deneyeceğiz.If that exists, we'll try Meats-2.pdf, and so on, until a unique file name is found.

Aşağıdaki kod, belirtilen dosya adına sahip bir dosyanın zaten mevcut olup olmadığını anlamak için File.Exists(path) yöntemini kullanır.The following code uses the File.Exists(path) method to determine if a file already exists with the specified file name. Bu durumda, çakışma bulunana kadar broşür için yeni dosya adları denemeye devam eder.If so, it continues to try new file names for the brochure until no conflict is found.

const string BrochureDirectory = "~/Brochures/";
string brochurePath = BrochureDirectory + BrochureUpload.FileName;
string fileNameWithoutExtension = 
    System.IO.Path.GetFileNameWithoutExtension(BrochureUpload.FileName);
int iteration = 1;
while (System.IO.File.Exists(Server.MapPath(brochurePath)))
{
    brochurePath = string.Concat(BrochureDirectory, 
        fileNameWithoutExtension, "-", iteration, ".pdf");
    iteration++;
}

Geçerli bir dosya adı bulunduğunda, dosyanın dosya sistemine kaydedilmesi gerekir ve bu dosya adının veritabanına yazılması için ObjectDataSource s brochurePath``InsertParameter değerinin güncelleştirilmesi gerekir.Once a valid file name has been found, the file needs to be saved to the file system and the ObjectDataSource s brochurePath``InsertParameter value needs to be updated so that this file name is written to the database. Karşıya yükleme dosyaları öğreticisinde geri döndüğünüzde dosya, FileUpload denetim s SaveAs(path) yöntemi kullanılarak kaydedilebilir.As we saw back in the Uploading Files tutorial, the file can be saved using the FileUpload control s SaveAs(path) method. ObjectDataSource s brochurePath parametresini güncelleştirmek için e.Values koleksiyonunu kullanın.To update the ObjectDataSource s brochurePath parameter, use the e.Values collection.

// Save the file to disk and set the value of the brochurePath parameter
BrochureUpload.SaveAs(Server.MapPath(brochurePath));
e.Values["brochurePath"] = brochurePath;

7. Adım: karşıya yüklenen resmi veritabanına kaydetmeStep 7: Saving the Uploaded Picture to the Database

Karşıya yüklenen resmi yeni Categories kaydına depolamak için, karşıya yüklenen ikili içeriği, DetailsView s ItemInserting olayında ObjectDataSource s picture parametresine atamamız gerekir.To store the uploaded picture in the new Categories record, we need to assign the uploaded binary content to the ObjectDataSource s picture parameter in the DetailsView s ItemInserting event. Ancak, bu atamayı yapmadan önce karşıya yüklenen resmin başka bir görüntü türü değil, bir JPG olduğundan emin olmanız gerekir.Before we make this assignment, however, we need to first make sure that the uploaded picture is a JPG and not some other image type. Adım 6 ' da olduğu gibi, ' ın türünü belirlemek için karşıya yüklenen resim dosyası uzantısını kullanmasına izin verin.As in Step 6, let s use the uploaded picture s file extension to ascertain its type.

Categories tablosu Picture sütunu için NULL değerlere izin verdiğinden, tüm kategorilerin Şu anda bir resmi vardır.While the Categories table allows NULL values for the Picture column, all categories currently have a picture. Bu sayfa aracılığıyla yeni bir kategori eklerken kullanıcıya bir resim sağlamaya izin verin.Let s force the user to provide a picture when adding a new category through this page. Aşağıdaki kod, bir resmin karşıya yüklenmiş ve uygun bir uzantıya sahip olduğundan emin olmak için kontrol eder.The following code checks to ensure that a picture has been uploaded and that it has an appropriate extension.

// Reference the FileUpload controls
FileUpload PictureUpload = (FileUpload)NewCategory.FindControl("PictureUpload");
if (PictureUpload.HasFile)
{
    // Make sure that a JPG has been uploaded
    if (string.Compare(System.IO.Path.GetExtension(PictureUpload.FileName), 
            ".jpg", true) != 0 &&
        string.Compare(System.IO.Path.GetExtension(PictureUpload.FileName), 
            ".jpeg", true) != 0)
    {
        UploadWarning.Text = 
            "Only JPG documents may be used for a category's picture.";
        UploadWarning.Visible = true;
        e.Cancel = true;
        return;
    }
}
else
{
    // No picture uploaded!
    UploadWarning.Text = 
        "You must provide a picture for the new category.";
    UploadWarning.Visible = true;
    e.Cancel = true;
    return;
}

Bu kod 6. adımdaki koddan önce yerleştirilmelidir, böylece resim karşıya yükleme ile ilgili bir sorun varsa, broşür dosyası dosya sistemine kaydedilmeden önce olay işleyicisi sonlandırılır.This code should be placed before the code from Step 6 so that if there is a problem with the picture upload, the event handler will terminate before the brochure file is saved to the file system.

Uygun bir dosyanın karşıya yüklendiğini varsayarak, karşıya yüklenen ikili içeriği resim parametresi s değerine aşağıdaki kod satırıyla atayın:Assuming that an appropriate file has been uploaded, assign the uploaded binary content to the picture parameter s value with the following line of code:

// Set the value of the picture parameter
e.Values["picture"] = PictureUpload.FileBytes;

TümItemInsertingolay IşleyicisiThe CompleteItemInsertingEvent Handler

Tamamlanma için, ItemInserting olay işleyicisi tamamen aşağıda verilmiştir:For completeness, here is the ItemInserting event handler in its entirety:

protected void NewCategory_ItemInserting(object sender, DetailsViewInsertEventArgs e)
{
    // Reference the FileUpload controls
    FileUpload PictureUpload = (FileUpload)NewCategory.FindControl("PictureUpload");
    if (PictureUpload.HasFile)
    {
        // Make sure that a JPG has been uploaded
        if (string.Compare(System.IO.Path.GetExtension(PictureUpload.FileName), 
                ".jpg", true) != 0 &&
            string.Compare(System.IO.Path.GetExtension(PictureUpload.FileName), 
                ".jpeg", true) != 0)
        {
            UploadWarning.Text = 
                "Only JPG documents may be used for a category's picture.";
            UploadWarning.Visible = true;
            e.Cancel = true;
            return;
        }
    }
    else
    {
        // No picture uploaded!
        UploadWarning.Text = 
            "You must provide a picture for the new category.";
        UploadWarning.Visible = true;
        e.Cancel = true;
        return;
    }
    // Set the value of the picture parameter
    e.Values["picture"] = PictureUpload.FileBytes;
    
    
    // Reference the FileUpload controls
    FileUpload BrochureUpload = 
        (FileUpload)NewCategory.FindControl("BrochureUpload");
    if (BrochureUpload.HasFile)
    {
        // Make sure that a PDF has been uploaded
        if (string.Compare(System.IO.Path.GetExtension(BrochureUpload.FileName), 
            ".pdf", true) != 0)
        {
            UploadWarning.Text = 
                "Only PDF documents may be used for a category's brochure.";
            UploadWarning.Visible = true;
            e.Cancel = true;
            return;
        }
        const string BrochureDirectory = "~/Brochures/";
        string brochurePath = BrochureDirectory + BrochureUpload.FileName;
        string fileNameWithoutExtension = 
            System.IO.Path.GetFileNameWithoutExtension(BrochureUpload.FileName);
        int iteration = 1;
        while (System.IO.File.Exists(Server.MapPath(brochurePath)))
        {
            brochurePath = string.Concat(BrochureDirectory, fileNameWithoutExtension, 
                "-", iteration, ".pdf");
            iteration++;
        }
        // Save the file to disk and set the value of the brochurePath parameter
        BrochureUpload.SaveAs(Server.MapPath(brochurePath));
        e.Values["brochurePath"] = brochurePath;
    }
}

8. Adım:DisplayCategoryPicture.aspxsayfasını DüzeltmeStep 8: Fixing theDisplayCategoryPicture.aspxPage

Son birkaç adımda oluşturulan ekleme arabirimini ve ItemInserting olay işleyicisini test etmek için bir süre bekleyin.Let s take a moment to test out the inserting interface and ItemInserting event handler that was created over the last few steps. UploadInDetailsView.aspx sayfasını bir tarayıcıda ziyaret edin ve bir kategori eklemeyi deneyin, ancak resmi atlayın veya JPG olmayan bir resim ya da PDF olmayan bir broşür belirtin.Visit the UploadInDetailsView.aspx page through a browser and attempt to add a category, but omit the picture, or specify a non-JPG picture or a non-PDF brochure. Bu durumların hiçbirinde, bir hata iletisi görüntülenir ve ekleme iş akışı iptal edilir.In any of these cases, an error message will be displayed and the insert workflow cancelled.

Geçersiz bir dosya türü karşıya yüklenirse bir uyarı Iletisi görüntülenirA Warning Message is Displayed If an Invalid File Type is Uploaded

Şekil 9: geçersiz bir dosya türü karşıya yüklenirse bir uyarı iletisi görüntülenir (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 9: A Warning Message is Displayed If an Invalid File Type is Uploaded (Click to view full-size image)

Sayfanın karşıya yükleneceğini ve PDF olmayan ya da JPG olmayan dosyaları kabul etmeyeceği doğrulandıktan sonra, geçerli bir JPG resmine sahip yeni bir kategori ekleyerek, broşür alanını boş bırakın.Once you have verified that the page requires a picture to be uploaded and won't accept non-PDF or non-JPG files, add a new category with a valid JPG picture, leaving the Brochure field empty. Ekle düğmesine tıkladıktan sonra, sayfa geri gönderilir ve yeni bir kayıt, Categories tablosuna doğrudan veritabanında depolanan karşıya yüklenen resim ikili içeriğiyle birlikte eklenir.After clicking the Insert button, the page will postback and a new record will be added to the Categories table with the uploaded image s binary contents stored directly in the database. GridView güncellenir ve yeni eklenen kategori için bir satır gösterir, ancak Şekil 10 ' un gösterdiği gibi, yeni kategorinin resmi doğru işlenmez.The GridView is updated and shows a row for the newly added category, but, as Figure 10 shows, the new category s picture is not rendered correctly.

Yeni kategorinin resim görüntülenmiyorThe New Category s Picture is not Displayed

Şekil 10: yeni kategori resmi görüntülenmiyor (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 10: The New Category s Picture is not Displayed (Click to view full-size image)

Yeni resmin görüntülenmediği nedeni, belirtilen bir kategori resmini döndüren DisplayCategoryPicture.aspx sayfasının, OLE üst bilgisi olan bit eşlemleri işleyecek şekilde yapılandırılmasının nedeni.The reason the new picture is not displayed is because the DisplayCategoryPicture.aspx page that returns a specified category s picture is configured to process bitmaps that have an OLE header. Bu 78 bayt üst bilgisi, istemciye geri gönderilmeden önce Picture sütundan ikili içeriklerden çıkarılır.This 78 byte header is stripped from the Picture column s binary contents before they are sent back to the client. Ancak yeni kategoride karşıya yüklediğiniz JPG dosyası bu OLE başlığına sahip değil; Bu nedenle, geçerli ve gerekli baytlar Image s binary verilerinden kaldırılıyor.But the JPG file we just uploaded for the new category does not have this OLE header; therefore, valid, necessary bytes are being removed from the image s binary data.

Categories tablosunda hem OLE üst bilgileri hem de JPGs olan bit eşlemler olduğundan, OLE üst bilgisinin orijinal sekiz kategoriye göre olması ve daha yeni kategori kayıtları için bu kadar bu kadar bu kadar bu kadar bu kadar bu kadar bu kadar bu kadar bu kadar bu kadar devam edebilmesi için DisplayCategoryPicture.aspx güncelleştirmeSince there are now both bitmaps with OLE headers and JPGs in the Categories table, we need to update DisplayCategoryPicture.aspx so that it does the OLE header stripping for the original eight categories and bypasses this stripping for the newer category records. Sonraki öğreticimizde, var olan bir kayıt görüntüsünü güncelleştirmeyi inceleyeceğiz ve tüm eski kategori resimlerini JPGs olacak şekilde güncelleştireceğiz.In our next tutorial we'll examine how to update an existing record s image, and we'll update all of the old category pictures so that they are JPGs. Şimdilik, yalnızca özgün sekiz kategori için OLE üstbilgilerini eklemek üzere DisplayCategoryPicture.aspx ' de aşağıdaki kodu kullanın:For now, though, use the following code in DisplayCategoryPicture.aspx to strip the OLE headers only for those original eight categories:

protected void Page_Load(object sender, EventArgs e)
{
    int categoryID = Convert.ToInt32(Request.QueryString["CategoryID"]);
    // Get information about the specified category
    CategoriesBLL categoryAPI = new CategoriesBLL();
    Northwind.CategoriesDataTable categories = 
        categoryAPI.GetCategoryWithBinaryDataByCategoryID(categoryID);
    Northwind.CategoriesRow category = categories[0];
    if (categoryID <= 8)
    {
        // For older categories, we must strip the OLE header... images are bitmaps
        // Output HTTP headers providing information about the binary data
        Response.ContentType = "image/bmp";
        // Output the binary data
        // But first we need to strip out the OLE header
        const int OleHeaderLength = 78;
        int strippedImageLength = category.Picture.Length - OleHeaderLength;
        byte[] strippedImageData = new byte[strippedImageLength];
        Array.Copy(category.Picture, OleHeaderLength, strippedImageData, 
            0, strippedImageLength);
        Response.BinaryWrite(strippedImageData);
    }
    else
    {
        // For new categories, images are JPGs...
        
        // Output HTTP headers providing information about the binary data
        Response.ContentType = "image/jpeg";
        // Output the binary data
        Response.BinaryWrite(category.Picture);
    }
}

Bu değişiklik ile, JPG görüntüsü artık GridView 'da doğru şekilde işlenir.With this change, the JPG image is now rendered correctly in the GridView.

Yeni kategoriler için JPG görüntülerinin doğru şekilde IşlendiğineThe JPG Images for New Categories are Correctly Rendered

Şekil 11: yeni KATEGORILER Için jpg resimleri doğru işlenir (tam boyutlu görüntüyü görüntülemek için tıklayın)Figure 11: The JPG Images for New Categories are Correctly Rendered (Click to view full-size image)

9. Adım: bir özel durum durumunda broşürü silmeStep 9: Deleting the Brochure in the Face of an Exception

Web sunucusu s dosya sisteminde ikili verileri depolamanın güçlüklerinden biri, veri modeli ve onun ikili verileri arasında bir bağlantı kesmeyi sunmakta.One of the challenges of storing binary data on the web server s file system is that it introduces a disconnect between the data model and its binary data. Bu nedenle, bir kayıt silindiğinde dosya sistemindeki karşılık gelen ikili verilerin de kaldırılması gerekir.Therefore, whenever a record is deleted, the corresponding binary data on the file system must also be removed. Bu, ekleme sırasında da oynatılmasına gelebilir.This can come into play when inserting, as well. Aşağıdaki senaryoyu göz önünde bulundurun: bir Kullanıcı, geçerli bir resim ve broşür belirten yeni bir kategori ekler.Consider the following scenario: a user adds a new category, specifying a valid picture and brochure. Ekle düğmesine tıklandıktan sonra, bir geri gönderme gerçekleşir ve DetailsView ItemInserting olay ateşlenir ve bu da broşür Web sunucusu s dosya sistemine kaydediliyor.Upon clicking the Insert button, a postback occurs and the DetailsView s ItemInserting event fires, saving the brochure to the web server s file system. Daha sonra, CategoriesTableAdapter s InsertWithPicture yöntemini çağıran CategoriesBLL sınıf s InsertWithPicture yöntemini çağıran ObjectDataSource s Insert() yöntemi çağrılır.Next, the ObjectDataSource s Insert() method is invoked, which calls the CategoriesBLL class s InsertWithPicture method, which calls the CategoriesTableAdapter s InsertWithPicture method.

Şimdi, veritabanı çevrimdışıysa veya INSERT SQL deyimindeki bir hata varsa ne olur?Now, what happens if the database is offline, or if there is an error in the INSERT SQL statement? Açıkça ekleme başarısız olur, bu nedenle veritabanına yeni bir kategori satırı eklenmez.Clearly the INSERT will fail, so no new category row will be added to the database. Ancak yine de karşıya yüklenen broşür dosyası Web sunucusu s dosya sisteminde oturduk!But we still have the uploaded brochure file sitting on the web server s file system! Bu dosyanın, ekleme iş akışı sırasında bir özel durum durumunda silinmesi gerekir.This file needs to be deleted in the face of an exception during the inserting workflow.

Daha önce bir ASP.NET sayfa öğreticisindeki BLL ve dal düzeyi özel durumları işleme konusunda anlatıldığı gibi, bir özel durum, mimarinin derinliğinden farklı katmanlar aracılığıyla kabarcıklanmasını.As discussed previously in the Handling BLL- and DAL-Level Exceptions in an ASP.NET Page tutorial, when an exception is thrown from within the depths of the architecture it is bubbled up through the various layers. Sunum katmanında, DetailsView ItemInserted olayından bir özel durumun oluşup oluşmadığını belirleyebiliriz.At the Presentation Layer, we can determine if an exception has occurred from the DetailsView s ItemInserted event. Bu olay işleyicisi, InsertParametersObjectDataSource 'un değerlerini de sağlar.This event handler also provides the values of the ObjectDataSource s InsertParameters. Bu nedenle, bir özel durum olup olmadığını denetleyen ItemInserted olayı için bir olay işleyicisi oluşturuyoruz ve bu durumda, ObjectDataSource s brochurePath parametresi tarafından belirtilen dosyayı siler:Therefore, we can create an event handler for the ItemInserted event that checks if there was an exception and, if so, deletes the file specified by the ObjectDataSource s brochurePath parameter:

protected void NewCategory_ItemInserted
    (object sender, DetailsViewInsertedEventArgs e)
{
    if (e.Exception != null)
    {
        // Need to delete brochure file, if it exists
        if (e.Values["brochurePath"] != null)
            System.IO.File.Delete(Server.MapPath(
                e.Values["brochurePath"].ToString()));
    }
}

ÖzetSummary

İkili veri içeren kayıtları eklemek için Web tabanlı bir arabirim sağlamak üzere gerçekleştirilmesi gereken birkaç adım vardır.There are a number of steps that must be performed in order to provide a web-based interface for adding records that include binary data. İkili veriler doğrudan veritabanına depolanıyorsa, bu durumda, ikili verilerin eklendiği durumu işlemek için belirli yöntemler ekleyerek mimariyi güncelleştirmeniz gerekir.If the binary data is being stored directly into the database, chances are you'll need to update the architecture, adding specific methods to handle the case where binary data is being inserted. Mimari güncelleştirildikten sonra, bir sonraki adım, her bir ikili veri alanı için bir dosya karşıya yükleme denetimi içerecek şekilde özelleştirilmiş bir DetailsView kullanılarak gerçekleştirilebilen ekleme arabirimini oluşturmaktır.Once the architecture has been updated, the next step is creating the inserting interface, which can be accomplished using a DetailsView that has been customized to include a FileUpload control for each binary data field. Karşıya yüklenen veriler daha sonra Web sunucusu s dosya sistemine kaydedilebilir veya DetailsView s ItemInserting olay işleyicisinde bir veri kaynağı parametresine atanabilir.The uploaded data can then be saved to the web server s file system or assigned to a data source parameter in the DetailsView s ItemInserting event handler.

İkili verileri dosya sistemine kaydetmek, verileri doğrudan veritabanına kaydetmeye kıyasla daha fazla planlama gerektirir.Saving binary data to the file system requires more planning than saving data directly into the database. Bir Kullanıcı yüklemesinin karşıya yüklenmesini önlemek için bir adlandırma düzeni seçilmelidir.A naming scheme must be chosen in order to avoid one user s upload overwriting another s. Ayrıca, veritabanı ekleme başarısız olursa karşıya yüklenen dosyayı silmek için ek adımların alınması gerekir.Also, extra steps must be taken to delete the uploaded file if the database insert fails.

Artık, bir broşür ve resimle sisteme yeni kategoriler ekleyebilme olanağı sunuyoruz, ancak mevcut bir kategorinin ikili verilerinin nasıl güncelleştireceğiz veya silinen bir kategorinin ikili verilerinin nasıl doğru şekilde kaldırılacağı hakkında daha fazla bakıyoruz.We now have the ability to add new categories to the system with a brochure and picture, but we ve yet to look at how to update an existing category s binary data or how to correctly remove the binary data for a deleted category. Sonraki öğreticide bu iki konuyu araştıracağız.We'll explore these two topics in the next tutorial.

Programlamanın kutlu olsun!Happy Programming!

Yazar hakkındaAbout the Author

4GuysFromRolla.com 'in, Scott Mitchell, yedi ASP/ASP. net books ve 'in yazarı, 1998 sürümünden bu yana Microsoft Web teknolojileriyle çalışmaktadır.Scott Mitchell, author of seven ASP/ASP.NET books and founder of 4GuysFromRolla.com, has been working with Microsoft Web technologies since 1998. Scott bağımsız danışman, Trainer ve yazıcı olarak çalışıyor.Scott works as an independent consultant, trainer, and writer. En son kitabı, 24 saat içinde ASP.NET 2,0 kendi kendinize eğitimister.His latest book is Sams Teach Yourself ASP.NET 2.0 in 24 Hours. mitchell@4GuysFromRolla.comadresinden erişilebilir .He can be reached at mitchell@4GuysFromRolla.com. ya da blog aracılığıyla http://ScottOnWriting.NETbulabilirsiniz.or via his blog, which can be found at http://ScottOnWriting.NET.

Özel olarak teşekkürlerSpecial Thanks To

Bu öğretici serisi birçok yararlı gözden geçirenler tarafından incelendi.This tutorial series was reviewed by many helpful reviewers. Bu öğreticide lider gözden geçirenler, Gardner, Teresa Murphy ve Bernadette Leigh.Lead reviewers for this tutorial were Dave Gardner, Teresa Murphy, and Bernadette Leigh. Yaklaşan MSDN makalelerimi gözden geçiriyor musunuz?Interested in reviewing my upcoming MSDN articles? Öyleyse, benimitchell@4GuysFromRolla.combir satır bırakın .If so, drop me a line at mitchell@4GuysFromRolla.com.