Introduzione all'uso di un database in siti di pagine Web ASP.NET (Razor)

di Tom FitzMacken

Questo articolo descrive come usare gli strumenti Di Microsoft WebMatrix per creare un database in un sito Web di pagine Web di ASP.NET (Razor) e come creare pagine che consentono di visualizzare, aggiungere, modificare ed eliminare dati.

Cosa si apprenderà:

• Come creare un database.
• Come connettersi a un database.
• Come visualizzare i dati in una pagina Web.
• Come inserire, aggiornare ed eliminare record di database.

Queste sono le funzionalità introdotte nell'articolo:

• Utilizzo di un database di Microsoft SQL Server Compact Edition.
• Uso delle query SQL.
• Classe Database .

Versioni software usate nell'esercitazione

• Pagine Web ASP.NET (Razor) 2
• WebMatrix 2

Questa esercitazione funziona anche con WebMatrix 3. È possibile usare ASP.NET Pagine Web 3 e Visual Studio 2013 (o Visual Studio Express 2013 for Web); Tuttavia, l'interfaccia utente sarà diversa.

Introduzione ai database

Si supponga di creare una tipica rubrica. Per ogni voce della rubrica ,ovvero per ogni persona, sono disponibili diverse informazioni, ad esempio nome, cognome, indirizzo, indirizzo di posta elettronica e numero di telefono.

Un modo tipico per creare un'immagine dei dati come questa è una tabella con righe e colonne. In termini di database, ogni riga viene spesso definita record. Ogni colonna (talvolta denominata campi) contiene un valore per ogni tipo di dati: nome, cognome e così via.

Per la maggior parte delle tabelle di database, la tabella deve avere una colonna contenente un identificatore univoco, ad esempio un numero cliente, un numero di conto e così via. Questa operazione è nota come chiave primaria della tabella e viene usata per identificare ogni riga della tabella. Nell'esempio, la colonna ID è la chiave primaria per la rubrica.

Con questa conoscenza di base dei database, è possibile imparare a creare un database semplice ed eseguire operazioni come l'aggiunta, la modifica e l'eliminazione di dati.

Creazione di un database

Questa procedura illustra come creare un database denominato SmallBakery usando lo strumento di progettazione del database SQL Server Compact incluso in WebMatrix. Anche se è possibile creare un database usando codice, è più tipico creare il database e le tabelle di database usando uno strumento di progettazione come WebMatrix.

1. Avviare WebMatrix e nella pagina Avvio rapido fare clic su Sito da modello.

2. Selezionare Sito vuoto e nella casella Nome sito immettere "SmallBakery" e quindi fare clic su OK. Il sito viene creato e visualizzato in WebMatrix.

3. Nel riquadro sinistro fare clic sull'area di lavoro Database .

4. Nella barra multifunzione fare clic su Nuovo database. Viene creato un database vuoto con lo stesso nome del sito.

5. Nel riquadro sinistro espandere il nodo SmallBakery.sdf e quindi fare clic su Tabelle.

6. Nella barra multifunzione fare clic su Nuova tabella. WebMatrix apre la finestra di progettazione tabelle.

   

7. Fare clic nella colonna Nome e immettere "Id".

8. Nella colonna Tipo di dati selezionare int.

9. Impostare le opzioni Is Primary Key? e Is Identify? (Chiave primaria) e Is Identify? (Identificazione? ) su Sì.

   Come suggerisce il nome, La chiave primaria indica al database che si tratta della chiave primaria della tabella. Is Identity indica al database di creare automaticamente un numero ID per ogni nuovo record e di assegnarlo al numero sequenziale successivo (a partire da 1).

10. Fare clic nella riga successiva. L'editor avvia una nuova definizione di colonna.

11. Per Il valore Name (Nome) immettere "Name".

12. Per Tipo di dati scegliere "nvarchar" e impostare la lunghezza su 50. La parte var di nvarchar indica al database che i dati per questa colonna saranno una stringa le cui dimensioni possono variare da record a record. Il prefisso n rappresenta un valore nazionale, che indica che il campo può contenere dati di tipo carattere che rappresentano qualsiasi sistema di alfabeto o scrittura, ovvero che il campo contiene dati Unicode.

13. Impostare l'opzione Consenti valori Null su No. In questo modo, la colonna Name non viene lasciata vuota.

14. Usando questo stesso processo, creare una colonna denominata Description. Impostare Tipo di dati su "nvarchar" e 50 per la lunghezza e impostare Consenti valori Null su false.

15. Creare una colonna denominata Price. Impostare Tipo di dati su "money" e impostare Consenti valori Null su false.

16. Nella casella in alto assegnare alla tabella il nome "Product".

    Al termine, la definizione sarà simile alla seguente:

    

17. Premere CTRL+S per salvare la tabella.

Aggiunta di dati al database

È ora possibile aggiungere alcuni dati di esempio al database che verranno usati più avanti nell'articolo.

1. Nel riquadro sinistro espandere il nodo SmallBakery.sdf e quindi fare clic su Tabelle.

2. Fare clic con il pulsante destro del mouse sulla tabella Product e quindi scegliere Dati.

3. Nel riquadro di modifica immettere i record seguenti:

   Nome	Descrizione	prezzo
   Pane	Al forno fresco ogni giorno.	2.99
   Shortcake fragola	Fatto con fragole organiche dal nostro giardino.	9.99
   Apple Pie	Second to your mom's pie.	12,99
   Torta pecan	Se ti piacciono i pecani, questo è per te.	10.99
   Torta limone	Fatto con i migliori limoni al mondo.	11.99
   Cupcakes	I tuoi figli e il bambino che ti piaceranno.	7,99

   Tenere presente che non è necessario immettere alcun elemento per la colonna ID . Quando è stata creata la colonna Id , la relativa proprietà Is Identity viene impostata su true, in modo che venga compilata automaticamente.

   Al termine dell'immissione dei dati, progettazione tabelle avrà un aspetto simile al seguente:

   

4. Chiudere la scheda contenente i dati del database.

Visualizzazione di dati da un database

Dopo aver creato un database con i dati, è possibile visualizzare i dati in una pagina Web ASP.NET. Per selezionare le righe della tabella da visualizzare, usare un'istruzione SQL, ovvero un comando passato al database.

1. Nel riquadro sinistro fare clic sull'area di lavoro File .

2. Nella radice del sito Web creare una nuova pagina CSHTML denominata ListProducts.cshtml.

3. Sostituire il markup esistente con quanto segue:

   @{
       var db = Database.Open("SmallBakery");
       var selectQueryString = "SELECT * FROM Product ORDER BY Name";
    }
   <!DOCTYPE html>
   <html>
    <head>
      <title>Small Bakery Products</title>
      <style>
          table, th, td {
            border: solid 1px #bbbbbb;
            border-collapse: collapse;
            padding: 2px;
          }
       </style>
    </head>
    <body>
      <h1>Small Bakery Products</h1>
      <table>
          <thead>
              <tr>
                  <th>Id</th>
                  <th>Product</th>
                  <th>Description</th>
          <th>Price</th>
              </tr>
          </thead>
          <tbody>
              @foreach(var row in db.Query(selectQueryString)){
               <tr>
                  <td>@row.Id</td>
                      <td>@row.Name</td>
                      <td>@row.Description</td>
                      <td>@row.Price</td>
               </tr>
              }
          </tbody>
      </table>
    </body>
   </html>
   

   Nel primo blocco di codice aprire il file SmallBakery.sdf (database) creato in precedenza. Il Database.Open metodo presuppone che il file con estensione sdf si trova nella cartella App_Data del sito Web. Si noti che non è necessario specificare l'estensione sdf , in realtà, se lo si fa, il Open metodo non funzionerà.

   Annotazioni

   La cartella App_Data è una cartella speciale in ASP.NET usata per archiviare i file di dati. Per altre informazioni, vedere Connessione a un database più avanti in questo articolo.

   Si effettua quindi una richiesta per eseguire una query sul database usando l'istruzione SQL Select seguente:

   SELECT * FROM Product ORDER BY Name
   

   Nell'istruzione Product identifica la tabella su cui eseguire la query. Il * carattere specifica che la query deve restituire tutte le colonne della tabella. È anche possibile elencare le colonne singolarmente, separate da virgole, se si desidera visualizzare solo alcune delle colonne. La Order By clausola indica la modalità di ordinamento dei dati, in questo caso in base alla colonna Name . Ciò significa che i dati vengono ordinati alfabeticamente in base al valore della colonna Name per ogni riga.

   Nel corpo della pagina, il markup crea una tabella HTML che verrà usata per visualizzare i dati. All'interno dell'elemento <tbody> si usa un foreach ciclo per ottenere singolarmente ogni riga di dati restituita dalla query. Per ogni riga di dati, si crea una riga di tabella HTML (<tr> elemento ). Si creano quindi celle di tabella HTML (<td> elementi) per ogni colonna. Ogni volta che si passa attraverso il ciclo, la riga successiva disponibile dal database si trova nella row variabile (questa operazione viene configurata nell'istruzione foreach ). Per ottenere una singola colonna dalla riga, è possibile usare row.Name o row.Description qualsiasi nome della colonna desiderata.

4. Eseguire la pagina in un browser. Assicurarsi che la pagina sia selezionata nell'area di lavoro File prima di eseguirla. Nella pagina viene visualizzato un elenco simile al seguente:

   

Inserimento di dati in un database

Questa sezione illustra come creare una pagina che consente agli utenti di aggiungere un nuovo prodotto alla tabella di database Product . Dopo l'inserimento di un nuovo record di prodotto, nella pagina viene visualizzata la tabella aggiornata usando la pagina ListProducts.cshtml creata nella sezione precedente.

La pagina include la convalida per assicurarsi che i dati immessi dall'utente siano validi per il database. Ad esempio, il codice nella pagina assicura che sia stato immesso un valore per tutte le colonne obbligatorie.

1. Nel sito Web creare un nuovo file CSHTML denominato InsertProducts.cshtml.

2. Sostituire il markup esistente con quanto segue:

   @{
       Validation.RequireField("Name", "Product name is required.");
       Validation.RequireField("Description", "Product description is required.");
       Validation.RequireField("Price", "Product price is required.");
   
       var db = Database.Open("SmallBakery");
       var Name = Request.Form["Name"];
       var Description = Request.Form["Description"];
       var Price = Request.Form["Price"];
   
       if (IsPost && Validation.IsValid()) {
           // Define the insert query. The values to assign to the
           // columns in the Product table are defined as parameters
           // with the VALUES keyword.
           if(ModelState.IsValid) {
               var insertQuery = "INSERT INTO Product (Name, Description, Price) " +
                   "VALUES (@0, @1, @2)";
               db.Execute(insertQuery, Name, Description, Price);
               // Display the page that lists products.
               Response.Redirect("~/ListProducts");
           }
       }
   }
   
   <!DOCTYPE html>
   <html>
   <head>
    <title>Add Products</title>
    <style type="text/css">
       label {float:left; width: 8em; text-align: right;
              margin-right: 0.5em;}
       fieldset {padding: 1em; border: 1px solid; width: 50em;}
       legend {padding: 2px 4px; border: 1px solid; font-weight:bold;}
       .validation-summary-errors {font-weight:bold; color:red;
              font-size: 11pt;}
    </style>
   </head>
   <body>
    <h1>Add New Product</h1>
   
    @Html.ValidationSummary("Errors with your submission:")
   
    <form method="post" action="">
      <fieldset>
        <legend>Add Product</legend>
        <div>
          <label>Name:</label>
          <input name="Name" type="text" size="50" value="@Name" />
        </div>
        <div>
          <label>Description:</label>
          <input name="Description" type="text" size="50"
              value="@Description" />
        </div>
        <div>
          <label>Price:</label>
          <input name="Price" type="text" size="50" value="@Price" />
        </div>
        <div>
          <label>&nbsp;</label>
          <input type="submit" value="Insert" class="submit" />
        </div>
      </fieldset>
    </form>
   </body>
   </html>
   

   Il corpo della pagina contiene un modulo HTML con tre caselle di testo che consentono agli utenti di immettere un nome, una descrizione e un prezzo. Quando gli utenti fa clic sul pulsante Inserisci , il codice nella parte superiore della pagina apre una connessione al database SmallBakery.sdf . Si ottengono quindi i valori inviati dall'utente usando l'oggetto Request e si assegnano tali valori alle variabili locali.

   Per verificare che l'utente ha immesso un valore per ogni colonna richiesta, registrare ogni <input> elemento da convalidare:

   Validation.RequireField("Name", "Product name is required.");
   Validation.RequireField("Description", "Product description is required.");
   Validation.RequireField("Price", "Product price is required.");
   

   L'helper Validation verifica che sia presente un valore in ognuno dei campi registrati. È possibile verificare se tutti i campi hanno superato la convalida controllando Validation.IsValid(), che in genere si esegue prima di elaborare le informazioni ottenute dall'utente:

   if (IsPost && Validation.IsValid()) {
       // Process information here
   }
   

   L'operatore && indica AND: questo test è Se si tratta di un invio di modulo E tutti i campi hanno superato la convalida.

   Se tutte le colonne convalidate (nessuna è vuota), procedere e creare un'istruzione SQL per inserire i dati e quindi eseguirla come illustrato di seguito:

   var insertQuery =
       "INSERT INTO Product (Name, Description, Price) VALUES (@0, @1, @2)";
   

   Per i valori da inserire, includere segnaposto dei parametri (@0, @1, @2).

   Annotazioni

   Come precauzione di sicurezza, passare sempre i valori a un'istruzione SQL usando i parametri, come illustrato nell'esempio precedente. In questo modo è possibile convalidare i dati dell'utente, oltre a proteggersi dai tentativi di inviare comandi dannosi al database (talvolta definiti attacchi SQL injection).

   Per eseguire la query, usare questa istruzione, passando le variabili che contengono i valori da sostituire con i segnaposto:

   db.Execute(insertQuery, Name, Description, Price);
   

   Dopo l'esecuzione dell'istruzione Insert Into , inviare l'utente alla pagina in cui sono elencati i prodotti usando questa riga:

   Response.Redirect("~/ListProducts");
   

   Se la convalida non è riuscita, ignorare l'inserimento. È invece disponibile un helper nella pagina che può visualizzare i messaggi di errore accumulati (se presenti):

   @Html.ValidationSummary("Errors with your submission:")
   

   Si noti che il blocco di stile nel markup include una definizione di classe CSS denominata .validation-summary-errors. Si tratta del nome della classe CSS usata per impostazione predefinita per l'elemento <div> che contiene eventuali errori di convalida. In questo caso, la classe CSS specifica che gli errori di riepilogo della convalida vengono visualizzati in rosso e in grassetto, ma è possibile definire la .validation-summary-errors classe per visualizzare qualsiasi formattazione desiderata.

Test della pagina Di inserimento

1. Visualizzare la pagina in un browser. Nella pagina viene visualizzato un modulo simile a quello illustrato nella figura seguente.

   

2. Immettere i valori per tutte le colonne, ma assicurarsi di lasciare vuota la colonna Price .

3. Fare clic su Inserisci. Nella pagina viene visualizzato un messaggio di errore, come illustrato nella figura seguente. Non viene creato alcun nuovo record.

   

4. Compilare completamente il modulo e quindi fare clic su Inserisci. Questa volta viene visualizzata la pagina ListProducts.cshtml e viene visualizzato il nuovo record.

Aggiornamento dei dati in un database

Dopo che i dati sono stati immessi in una tabella, potrebbe essere necessario aggiornarlo. Questa procedura illustra come creare due pagine simili a quelle create in precedenza per l'inserimento di dati. La prima pagina visualizza i prodotti e consente agli utenti di selezionarne uno da modificare. La seconda pagina consente agli utenti di apportare effettivamente le modifiche e salvarle.

1. Nel sito Web creare un nuovo file CSHTML denominato EditProducts.cshtml.

2. Sostituire il markup esistente nel file con quanto segue:

   @{
       var db = Database.Open("SmallBakery");
       var selectQueryString = "SELECT * FROM Product ORDER BY Name";
   
   }
   <!DOCTYPE html>
   <html>
   <head>
       <title>Edit Products</title>
       <style type="text/css">
           table, th, td {
             border: solid 1px #bbbbbb;
             border-collapse: collapse;
             padding: 2px;
           }
       </style>
   </head>
   <body>
       <h1>Edit Small Bakery Products</h1>
       <table>
         <thead>
           <tr>
             <th>&nbsp;</th>
             <th>Name</th>
             <th>Description</th>
             <th>Price</th>
           </tr>
         </thead>
         <tbody>
           @foreach (var row in db.Query(selectQueryString)) {
             <tr>
               <td><a href="@Href("~/UpdateProducts", row.Id)">Edit</a></td>
               <td>@row.Name</td>
               <td>@row.Description</td>
               <td>@row.Price</td>
             </tr>
           }
         </tbody>
       </table>
   </body>
   </html>
   

   L'unica differenza tra questa pagina e la pagina ListProducts.cshtml precedente è che la tabella HTML in questa pagina include una colonna aggiuntiva che visualizza un collegamento Modifica . Quando si fa clic su questo collegamento, viene visualizzata la pagina UpdateProducts.cshtml (che verrà creata successivamente) in cui è possibile modificare il record selezionato.

   Esaminare il codice che crea il collegamento Modifica :

   <a href="@Href("~/UpdateProducts", row.Id)">Edit</a></td>
   

   In questo modo viene creato un elemento HTML <a> il cui href attributo viene impostato in modo dinamico. L'attributo href specifica la pagina da visualizzare quando l'utente fa clic sul collegamento. Passa anche il Id valore della riga corrente al collegamento. Quando la pagina viene eseguita, l'origine della pagina potrebbe contenere collegamenti simili ai seguenti:

   <a href="UpdateProducts/1">Edit</a></td>
   <a href="UpdateProducts/2">Edit</a></td>
   <a href="UpdateProducts/3">Edit</a></td>
   

   Si noti che l'attributo href è impostato su UpdateProducts/n, dove n è un numero di prodotto. Quando un utente fa clic su uno di questi collegamenti, l'URL risultante sarà simile al seguente:

   http://localhost:18816/UpdateProducts/6

   In altre parole, il numero di prodotto da modificare verrà passato nell'URL.

3. Visualizzare la pagina in un browser. La pagina visualizza i dati in un formato simile al seguente:

   

   Successivamente, si creerà la pagina che consente agli utenti di aggiornare effettivamente i dati. La pagina di aggiornamento include la convalida per convalidare i dati immessi dall'utente. Ad esempio, il codice nella pagina assicura che sia stato immesso un valore per tutte le colonne obbligatorie.

4. Nel sito Web creare un nuovo file CSHTML denominato UpdateProducts.cshtml.

5. Sostituire il markup esistente nel file con il codice seguente.

   @{
       Validation.RequireField("Name", "Product name is required.");
       Validation.RequireField("Description", "Product description is required.");
       Validation.RequireField("Price", "Product price is required.");
   
       var Name = "";
       var Description = "";
       var Price = Decimal.Zero;
   
       var ProductId  = UrlData[0];
       if (ProductId.IsEmpty()) {
            Response.Redirect("~/EditProducts");
       }
   
       var db = Database.Open("SmallBakery");
   
       if (IsPost && Validation.IsValid()) {
           var updateQueryString =
               "UPDATE Product SET Name=@0, Description=@1, Price=@2 WHERE Id=@3" ;
           Name = Request["Name"];
           Description = Request["Description"];
           Price = Request["Price"].AsDecimal();
           db.Execute(updateQueryString, Name, Description, Price, ProductId);
           Response.Redirect(@Href("~/EditProducts"));
       }
       else {
           var selectQueryString = "SELECT * FROM Product WHERE Id=@0";
   
           var row = db.QuerySingle(selectQueryString, ProductId);
           Name = row.Name;
           Description = row.Description;
           Price = row.Price;
       }
   
   }
   
   <!DOCTYPE html>
   <html>
   <head>
     <title>Add Products</title>
     <style type="text/css">
        label { float: left; width: 8em; text-align: right;
                margin-right: 0.5em;}
        fieldset { padding: 1em; border: 1px solid; width: 35em;}
        legend { padding: 2px 4px;  border: 1px solid; font-weight: bold;}
        .validation-summary-errors {font-weight:bold; color:red; font-size:11pt;}
     </style>
   </head>
   <body>
     <h1>Update Product</h1>
      @Html.ValidationSummary("Errors with your submission:")
      <form method="post" action="">
        <fieldset>
          <legend>Update Product</legend>
          <div>
            <label>Name:</label>
            <input name="Name" type="text" size="50" value="@Name" />
          </div>
          <div>
            <label>Description:</label>
            <input name="Description" type="text" size="50"
               value="@Description" />
          </div>
          <div>
             <label>Price:</label>
             <input name="Price" type="text" size="50" value="@Price" />
          </div>
          <div>
             <label>&nbsp;</label>
             <input type="submit" value="Update" class="submit" />
          </div>
       </fieldset>
     </form>
   </body>
   </html>
   

   Il corpo della pagina contiene un modulo HTML in cui viene visualizzato un prodotto e dove gli utenti possono modificarlo. Per visualizzare il prodotto, usare questa istruzione SQL:

   SELECT * FROM Product WHERE Id=@0
   

   Verrà selezionato il prodotto il cui ID corrisponde al valore passato nel @0 parametro . Poiché ID è la chiave primaria e pertanto deve essere univoco, è possibile selezionare in questo modo un solo record di prodotto. Per ottenere il valore ID da passare a questa Select istruzione, è possibile leggere il valore passato alla pagina come parte dell'URL, usando la sintassi seguente:

   var ProductId  = UrlData[0];
   

   Per recuperare effettivamente il record del prodotto, si usa il QuerySingle metodo , che restituirà un solo record:

   var row = db.QuerySingle(selectQueryString, ProductId);
   

   La singola riga viene restituita nella row variabile . È possibile ottenere dati da ogni colonna e assegnarli a variabili locali come segue:

   var Name = row.Name;
   var Description = row.Description;
   var Price = row.Price;
   

   Nel markup per il modulo questi valori vengono visualizzati automaticamente in singole caselle di testo usando codice incorporato simile al seguente:

   <input name="Name" type="text" size="50" value="@Name" />
   

   Tale parte del codice visualizza il record del prodotto da aggiornare. Una volta visualizzato il record, l'utente può modificare singole colonne.

   Quando l'utente invia il modulo facendo clic sul pulsante Aggiorna , viene eseguito il codice nel if(IsPost) blocco. Ottiene i valori dell'utente dall'oggetto Request , archivia i valori nelle variabili e verifica che ogni colonna sia stata compilata. Se la convalida viene superata, il codice crea l'istruzione SQL Update seguente:

   UPDATE Product SET Name=@0, Description=@1, Price=@2, WHERE ID=@3
   

   In un'istruzione SQL Update specificare ogni colonna per aggiornare e il valore su cui impostarlo. In questo codice i valori vengono specificati usando i segnaposto @0dei parametri , @1, @2e così via. Come indicato in precedenza, per la sicurezza, è consigliabile passare sempre valori a un'istruzione SQL usando i parametri.

   Quando si chiama il db.Execute metodo , si passano le variabili che contengono i valori nell'ordine corrispondente ai parametri nell'istruzione SQL:

   db.Execute(updateQueryString, Name, Description, Price, ProductId);
   

   Dopo l'esecuzione dell'istruzione Update , chiamare il metodo seguente per reindirizzare l'utente alla pagina di modifica:

   Response.Redirect(@Href("~/EditProducts"));
   

   L'effetto è che l'utente vede un elenco aggiornato dei dati nel database e può modificare un altro prodotto.

6. Salva la pagina.

7. Eseguire la pagina EditProducts.cshtml (non la pagina di aggiornamento) e quindi fare clic su Modifica per selezionare un prodotto da modificare. Viene visualizzata la pagina UpdateProducts.cshtml , che mostra il record selezionato.

   

8. Apportare una modifica e fare clic su Aggiorna. L'elenco dei prodotti viene visualizzato di nuovo con i dati aggiornati.

Eliminazione di dati in un database

Questa sezione illustra come consentire agli utenti di eliminare un prodotto dalla tabella di database Product . L'esempio è costituito da due pagine. Nella prima pagina gli utenti selezionano un record da eliminare. Il record da eliminare viene quindi visualizzato in una seconda pagina che consente di confermare di voler eliminare il record.

1. Nel sito Web creare un nuovo file CSHTML denominato ListProductsForDelete.cshtml.

2. Sostituire il markup esistente con quanto segue:

   @{
     var db = Database.Open("SmallBakery");
     var selectQueryString = "SELECT * FROM Product ORDER BY Name";
   }
   <!DOCTYPE html>
   <html>
   <head>
       <title>Delete a Product</title>
       <style>
           table, th, td {
             border: solid 1px #bbbbbb;
             border-collapse: collapse;
             padding: 2px;
           }
        </style>
   </head>
   <body>
     <h1>Delete a Product</h1>
     <form method="post" action="" name="form">
       <table border="1">
         <thead>
           <tr>
             <th>&nbsp;</th>
             <th>Name</th>
             <th>Description</th>
             <th>Price</th>
           </tr>
         </thead>
         <tbody>
           @foreach (var row in db.Query(selectQueryString)) {
             <tr>
               <td><a href="@Href("~/DeleteProduct", row.Id)">Delete</a></td>
               <td>@row.Name</td>
               <td>@row.Description</td>
               <td>@row.Price</td>
             </tr>
           }
         </tbody>
       </table>
     </form>
   </body>
   </html>
   

   Questa pagina è simile alla pagina EditProducts.cshtml precedente. Tuttavia, invece di visualizzare un collegamento Modifica per ogni prodotto, viene visualizzato un collegamento Elimina . Il collegamento Elimina viene creato usando il codice incorporato seguente nel markup:

   <a href="@Href("~/DeleteProduct", row.Id)">Delete</a>
   

   In questo modo viene creato un URL simile al seguente quando gli utenti fanno clic sul collegamento:

   http://<server>/DeleteProduct/4

   L'URL chiama una pagina denominata DeleteProduct.cshtml (che verrà creata successivamente) e lo passa all'ID del prodotto da eliminare (qui, 4).

3. Salvare il file, ma lasciarlo aperto.

4. Creare un altro file CHTML denominato DeleteProduct.cshtml. Sostituire il contenuto esistente con quanto segue:

   @{
     var db = Database.Open("SmallBakery");
     var ProductId = UrlData[0];
     if (ProductId.IsEmpty()) {
       Response.Redirect("~/ListProductsForDelete");
     }
     var prod = db.QuerySingle("SELECT * FROM PRODUCT WHERE ID = @0", ProductId);
     if( IsPost && !ProductId.IsEmpty()) {
       var deleteQueryString = "DELETE FROM Product WHERE Id=@0";
       db.Execute(deleteQueryString, ProductId);
       Response.Redirect("~/ListProductsForDelete");
     }
   }
   
   <!DOCTYPE html>
   <html>
   <head>
       <title>Delete Product</title>
   </head>
   <body>
     <h1>Delete Product - Confirmation</h1>
     <form method="post" action="" name="form">
       <p>Are you sure you want to delete the following product?</p>
   
       <p>Name: @prod.Name <br />
          Description: @prod.Description <br />
          Price: @prod.Price</p>
       <p><input type="submit" value="Delete" /></p>
     </form>
   </body>
   </html>
   

   Questa pagina viene chiamata da ListProductsForDelete.cshtml e consente agli utenti di confermare che vogliono eliminare un prodotto. Per elencare il prodotto da eliminare, si ottiene l'ID del prodotto da eliminare dall'URL usando il codice seguente:

   var ProductId = UrlData[0];
   

   La pagina chiede quindi all'utente di fare clic su un pulsante per eliminare effettivamente il record. Si tratta di una misura di sicurezza importante: quando si eseguono operazioni sensibili nel sito Web, ad esempio l'aggiornamento o l'eliminazione di dati, queste operazioni devono essere sempre eseguite usando un'operazione POST, non un'operazione GET. Se il sito è configurato in modo che sia possibile eseguire un'operazione di eliminazione usando un'operazione GET, chiunque può passare un URL come http://<server>/DeleteProduct/4 ed eliminare qualsiasi elemento desiderato dal database. Aggiungendo la conferma e la codifica della pagina in modo che l'eliminazione possa essere eseguita solo usando un POST, si aggiunge una misura di sicurezza al sito.

   L'operazione di eliminazione effettiva viene eseguita usando il codice seguente, che conferma innanzitutto che si tratta di un'operazione post e che l'ID non è vuoto:

   if( IsPost && !ProductId.IsEmpty()) {
       var deleteQueryString = "DELETE FROM Product WHERE Id=@0";
       db.Execute(deleteQueryString, ProductId);
       Response.Redirect("~/ListProductsForDelete");
   }
   

   Il codice esegue un'istruzione SQL che elimina il record specificato e quindi reindirizza l'utente alla pagina di presentazione.

5. Eseguire ListProductsForDelete.cshtml in un browser.

   

6. Fare clic sul collegamento Elimina per uno dei prodotti. Viene visualizzata la pagina DeleteProduct.cshtml per confermare che si desidera eliminare il record.

7. Fare clic sul pulsante Elimina. Il record del prodotto viene eliminato e la pagina viene aggiornata con un elenco di prodotti aggiornato.

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <connectionStrings>
   <add
     name="SQLServerConnectionString"
     connectionString= "server=myServer;database=myDatabase;uid=username;$CREDENTIAL_PLACEHOLDER$"
     providerName="System.Data.SqlClient" />
  </connectionStrings>
</configuration>

@{
    var db = Database.Open("SQLServerConnectionString");
}

Risorse aggiuntive

• SQL Server Compact
• Connessione a un database SQL Server o MySQL in WebMatrix
• Convalida dell'input utente nelle pagine Web ASP.NET