ASP.NET & Javascript: Aprire un'popup e ottenere il valore selezionato

Aprire un popup è un'operazione che deve essere effettuata lato client. E' necessario quindi integrare codice javascript alla nostra pagina asp.net.

<script language="javascript" type="text/javascript">

    function selezionaCategoria() {

        window.open('selcat.aspx', 'SelezionaCategoria', '', '');

    }

</script>

possiamo utilizzare la funzione selezionaCategoria() per aprire la pagina selcat.aspx in una finestra popup :

<asp:HyperLink ID="selcatHyperLink" runat="server" NavigateUrl="javascript:selezionaCategoria()">Seleziona</asp:HyperLink>

Con queste istruzioni abbiamo creato una pagina che apre un popup in cui l'utente dovrebbe selezionare la categoria di interesse. Ma per completare l'operazione abbiamo bisogno che la finestra popup restituisca un valore, nel nostro caso in codice della categoria selezionata.

L'oggetto javascript window.opener è quello di cui abbiamo bisogno affinchè la finestra chiamata abbia accesso alla finestra chiamante. Nella pagina selcat.aspx dobbiamo quindi specificare di richiamare una funzione javascript presente nella finestra chimante:

window.opener.setCategoria('AA'); window.close();

setCategoria è una funzione javascript implementata in precedenza nella finestra chiamante. Molto probabilmente il codice della categoria selezionata dovrà essere inserito in un controllo server di asp.net che potrebbe avere un id client generato dinamicamente dal server. Questo ci obbliga a inserire il codice javascript nel codice gestito all'evento page_load :

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    If Not IsPostBack Then

        Dim scr As String = "<script language='javascript'> function setCategoria(cat) {document.getElementById('" & categoriaTextBox.ClientID & "').innerText = cat;} </script>"

        ClientScript.RegisterClientScriptBlock(Me.GetType, "SettaCategoria", scr)

   End If

End Sub

In questo modo garantiamo che l'id client di categoriaTextBox sia quello esatto.

Allo stesso modo nella pagina selcat.aspx il controllo che richiama setCategoria potrebbe essere un controllo server come ad esempio un TreeView o un button che effettua un postback. Per permettere al server di eseguire sul client codice javascript, possiamo utilizzare ClientScript.RegisterStartupScript che esegue uno script di avvio sul client, in più abbiamo la possibilità di generare o ottenere il codice categoria sul server.

Protected Sub CategorieTreeView_SelectedNodeChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles CategorieTreeView.SelectedNodeChanged

    ClientScript.RegisterStartupScript(Me.GetType, "RitorvaValore", "<script language='javascript'> window.opener.setCategoria('" & CategorieTreeView.SelectedValue & "'); window.close(); </script>")

End Sub