WebMatrix: come sviluppare una pagina per l'eliminazione dei record dal database

Proseguiamo lo sviluppo di una semplice applicazione web ricorrendo a WebMatrix, il nuovo strumento rilasciato pubblicamente da Microsoft all’inizio di gennaio 2011. WebMatrix è una piattaforma per Windows, distribuita a titolo completamente gratuito, che permette di creare applicazioni web “ex novo” utilizzando anche una base dati SQL Server Compact, pienamente compatibile con il motore del “fratello maggiore” SQL Server.
Le applicazioni web in corso di sviluppo possono essere provate in ambito locale grazie al server web (IIS Express 7.5) che WebMatrix provvede ad installare automaticamente. Lo strumento di sviluppo di Microsoft è stato concepito anche per “testare” e personalizzare come meglio si crede il funzionamento di tutte le applicazioni web opensource realizzate in ASP.NET oppure in PHP.

<!– –>Nelle precedenti puntate abbiamo già visto come installare WebMatrix, si è iniziato ad acquisire familiarità con l’ambiente di lavoro, a sviluppare la prima applicazione d’esempio (scoprendo anche Razor) ed a collegarla con una base dati SQL Server mettendo anche a punto una pagina web per l’inserimento di nuovi record nel database:

Prima di proseguire, quindi, vi invitiamo a rileggere il contenuto delle precedenti puntate.

L’ultimo tassello mancante consiste nello sviluppo di un meccanismo che permetta di procedere all’eliminazione delle informazioni precedentemente salvate nella base dati.

Per cominciare, è necessario aprire il progetto WebMatrix sin qui sviluppato quindi aggiungervi (clic sul pulsante Nuovo della barra degli strumenti), un nuovo file battezzandolo dbelimina.cshtml:

A questo punto, è necessario eliminare il contenuto aggiunto in modo predefinito da WebMatrix all’interno della pagina dbelimina.cshtml ed inserirvi invece quanto segue:

@{
    var id=0;
    if (Request["id"].IsInt()) {
        id = Request["id"].AsInt();
    } else {
        Response.Redirect(@Href("~/catalogo.cshtml"));    
    }
    if (id < 1) {
        Response.Redirect(@Href("~/catalogo.cshtml"));    
    }
    
    var db = Database.Open("Catalogo");
    var NomeProdotto="";
    var NomeScientifico="";
    var Descrizione="";
    
    if(IsPost){        
        
     } else {
        var sqlquery = "SELECT * FROM Piante WHERE id=@0";
        var record = db.QuerySingle(sqlquery,id);
        if (record == null) {
            Response.Redirect(@Href("~/catalogo.cshtml"));
        }
        NomeProdotto=record.Nome;
        NomeScientifico=record.Nome_scientifico;
        Descrizione=record.Descrizione;
    }
    
}

<h1>Eliminazione di una scheda prodotto</h1>
<p>Sei sicuro di voler eliminare il prodotto <strong>@NomeProdotto</strong>?</p>

<form action="" method="post">
    <input type="submit" value="Sì" />
    <input type="button" value="No" onclick="window.location = 'catalogo.cshtml'" />
</form>

Come nel caso del file dinamico per la modifica del contenuto del database (dbmodifica.cshtml), visto nella precedente puntata (ved. questo articolo), il file per l’eliminazione delle informazioni dal database dovrà essere richiamato indicando, in input, l’indetificativo corrispondente al record da cancellare (esempio: dbelimina.cshtml?id=10 consentirà di rimuovere il record dotato dell’identificativo “10”).

Le prime righe (da 2 a 10) si occupano di controllare che in ingresso venga inserito un valore numerico e che questo non sia negativo. In caso contrario, viene semplicemente effettuato un reindirizzamento verso la home page dell’applicazione web (catalogo.cshtml) senza proseguire ulteriormente (Response.Redirect(@Href("~/catalogo.cshtml"));).

Quando la pagina viene richiamata direttamente, senza cliccare su alcun pulsante della successiva form HTML, ad essere eseguito è il codice racchiuso nel blocco else (linee 20-27). Tale codice è lo stesso utilizzato nella pagina dbmodifica.cshtml ed è impiegato per recuperare il contenuto dei vari campi del database (colonne), corrispondenti al record avente come ID quello specificato (il valore dell’identificativo ricevuto in input dalla pagina dbelimina.cshtml, viene salvato nella variabile id con l’assegnamento alla riga 4).

Il nome del prodotto corrispondente all’identificativo, viene memorizzato nella variabile NomeProdotto (riga 25) quindi recuperato per la visualizzazione nel codice HTML della pagina web (riga 33):

<p>Sei sicuro di voler eliminare il prodotto <strong>@NomeProdotto</strong>?</p>

Resta da definire come la pagina dovrà reagire allorquando l’utente confermi l’eliminazione del prodotto indicato. La form (righe 35-38) mostra due pulsanti: nel caso in cui la rimozione del record non venisse confermata (pressione del pulsante No), come si vede, viene effettuato un semplice redirect utilizzando codice JavaScript (onclick="window.location = 'catalogo.cshtml'"). Diversamente (pressione del pulsante Sì), verrà effettuata un’operazione di POST verso la stessa pagina dbelimina.cshtml (<form action="" method="post">).

Per completare lo script, quindi, è necessario indicare – all’interno del blocco if(IsPost){ } – quanto segue:

var sqldelete = "DELETE FROM Piante WHERE ID=@0";
db.Execute(sqldelete,id);
Response.Redirect(@Href("~/catalogo.cshtml"));

In questo modo, alla pressione del pulsante Sì, verrà cancellato il record avente come ID quello specificato in ingresso (sarà eseguita, sul database, la query SQL DELETE).

Il codice finale di dbelimina.cshtml diventa quindi il seguente:

@{
    var id=0;
    if (Request["id"].IsInt()) {
        id = Request["id"].AsInt();
    } else {
        Response.Redirect(@Href("~/catalogo.cshtml"));    
    }
    if (id < 1) {
        Response.Redirect(@Href("~/catalogo.cshtml"));    
    }
    
    var db = Database.Open("Catalogo");
    var NomeProdotto="";
    var NomeScientifico="";
    var Descrizione="";
    
    if(IsPost){        
        var sqldelete = "DELETE FROM Piante WHERE ID=@0";
        db.Execute(sqldelete,id);
        Response.Redirect(@Href("~/catalogo.cshtml"));
     } else {
        var sqlquery = "SELECT * FROM Piante WHERE id=@0";
        var record = db.QuerySingle(sqlquery,id);
        if (record == null) {
            Response.Redirect(@Href("~/catalogo.cshtml"));
        }
        NomeProdotto=record.Nome;
        NomeScientifico=record.Nome_scientifico;
        Descrizione=record.Descrizione;
    }
    
}

<h1>Eliminazione di una scheda prodotto</h1>
<p>Sei sicuro di voler eliminare il prodotto <strong>@NomeProdotto</strong>?</p>

<form action="" method="post">
    <input type="submit" value="Sì" />
    <input type="button" value="No" onclick="window.location = 'catalogo.cshtml'" />
</form>

Per concludere, è necessario modificare la pagina catalogo.cshtml in modo che sia presente un link per l’eventuale eliminazione di ciascun record. Dopo aver aperto tale file, è necessario sostituire la riga <li><a href="//www.ilsoftware.it/dbmodifica.cshtml?id=@row.id">@row.Nome (<i>@row.Nome_scientifico</i>)</a></li> con ciò che segue:

<li><a href="//www.ilsoftware.it/dbmodifica.cshtml?id=@row.id">@row.Nome (<i>@row.Nome_scientifico</i>)</a> 
    <a href="//www.ilsoftware.it/dbelimina.cshtml?id=@row.id"><img src="ico_elimina.gif" alt="Elimina" border="0" /></a>
</li>

L’icona ico_elimina.gif può essere scaricata da qui. Tale immagine deve essere salvata, con lo stesso nome, nella cartella del progetto WebMatrix sul quale si sta lavorando.
Ecco come apparirà l’elenco dei prodotti (pagina catalogo.cshtml nel browser web):

Cliccando sulle varie croci rosse si accederà alla pagina per l’eliminazione di ciascun prodotto:

L’applicazione di prova sin qui realizzata può essere adesso, ad esempio, trasportata online appoggiandosi a provider Internet che mettono a disposizione servizi di hosting ASP.NET. <!– –>