Gli sviluppatori di creare applicazioni Web ASP.NET utilizzando un linguaggio come C #. I server Web convertono il codice ASP.NET in normale HTML che i browser utilizzano per visualizzare le pagine web. Queste pagine possono contenere controlli come pulsanti, elenchi a discesa e caselle di controllo. Se l'applicazione ASP.NET deve eseguire un'operazione sul lato client, come ad esempio il controllo tutte le caselle di controllo in una pagina Web, è possibile farlo utilizzando una funzione JavaScript.

istruzione

Crea Check Control Box

1 Creare un nuovo progetto C # ASP.NET utilizzando Visual Studio. Fare doppio clic sul file "Default.aspx" che si trova in Esplora soluzioni, quindi fare clic sul pulsante "Design" alla parte inferiore dell'interfaccia utente. Visual Studio passa alla visualizzazione struttura e visualizza il modulo Web.

2 Fai clic su "File" e poi su "Strumenti" per aprire la casella degli strumenti. Individuare il controllo "CheckedListBox" e fare doppio clic su di esso per aggiungere che il controllo al form. I nomi di Visual Studio questo controllo "CheckedListBox1". Questo nome è importante perché il codice JavaScript avrà bisogno di individuare questo controllo.

3 Right-click che il controllo e quindi fare clic su "Visualizza smart tag". Fai clic su "Modifica elementi" per aprire la "Editor dell'insieme ListItem."

4 Fare clic sul pulsante "Aggiungi" per due volte poi cliccare su "OK". Visual Studio aggiunge due caselle di controllo per il controllo.

5 Ritorna alla casella degli strumenti e fare doppio clic sul controllo "pulsante" per aggiungere un pulsante al form. nome del pulsante è "Button1".

6 Fare clic con il controllo "CheckListBox" del form e clicca su "Visualizza smart tag". Fai clic su "Modifica elementi" per visualizzare la "Editor dell'insieme ListItem."

Aggiungere caselle di controllo

7 Tasto destro del mouse di controllo "CheckListBox" del form quindi fare clic su "Visualizza smart tag". Fai clic su "Modifica elementi" per visualizzare la "Editor dell'insieme ListItem."

8 Fai clic su "Aggiungi" due volte per aggiungere due caselle di controllo per il controllo "CheckBoxList".

9 Doppio clic sulla barra del titolo del form. Una finestra di codice apparirà e visualizzerà il seguente metodo:

protetto void Page_Load (object sender, EventArgs e)

{

}

Questo codice viene eseguito quando il modulo Web viene caricato nel browser.

10 Sostituire il codice con questo codice:

protetto void Page_Load (object sender, EventArgs e)

{

stringa javaScriptLocation = "<script language = JavaScript src = 'JavaScriptHelper.js'>";

ClientScript.RegisterStartupScript (this.GetType (), "script", javaScriptLocation);

stringa javaScriptMethod = "checkall";

stringa clientID = CheckBoxList1.ClientID.ToString ();

stringa checkBoxCount = CheckBoxList1.Items.Count.ToString ();

System.Text.StringBuilder StringBuilder = new System.Text.StringBuilder ();

stringBuilder.Append (javaScriptMethod + "( '");

stringBuilder.Append (IDcliente);

stringBuilder.Append ( " ','" + checkBoxCount + " '");

stringBuilder.Append ( ")");

stringa callScript = "ritorno" + stringBuilder.ToString ();

Button1.Attributes.Add ( "onclick", callScript);

}

La prima riga di codice nel metodo crea una variabile denominata "javaScriptLocation." Esso contiene il nome del file JavaScript esterno. In questo esempio, che chiama "JavaScriptHelper.js."

La variabile "javaScriptMethod" contiene il nome della funzione JavaScript che elabora le caselle di controllo. La prossima riga di codice crea la variabile "IDcliente". Quella variabile contiene il ClientID del controllo CheckBoxList. Il nome di quel controllo è "CheckBoxList1" in questo esempio. Se tu avessi dato il controllo di un nome diverso, si dovrebbe sostituire "CheckBoxList1" con quel nome. Le righe di codice che utilizzano la classe "StringBuilder" creare una stringa che contiene una chiamata alla funzione JavaScript. L'ultima riga di codice aggiunge un "onclick" gestore di eventi al pulsante denominato "Button1". Quella linea di codice dice ASP.NET per chiamare la funzione JavaScript e passare il ClientID del controllo CheckListBox denominato "checkListBox1."

Aggiungere JavaScript

11 Fai clic su "sito, 'e poi cliccare su" Add New Item. "Individuare il" JScript file "icona nella finestra pop-up e fare clic su tale icona per selezionarla. Tipo" JavaScriptHelper "(senza le virgolette) nel" testo Nome " scatola. Fai clic su "Aggiungi". Visual Studio crea un nuovo file JavaScript e lo apre nella finestra del codice. si noti che il nome digitato corrisponde al nome del file JavaScript definito nel paragrafo precedente.

12 Incollare il seguente codice in quella finestra di codice.

Funzione checkall (id, numberOfCheckBoxes) {

for (var i = 0; i <numberOfCheckBoxes; i ++) {

var checkBoxObject = document.getElementById (id + "_" + i);

checkBoxObject.checked = 'true';

}

return false;

}

Questo file JavaScript contiene la funzione denominata "checkall" menzionato nella sezione precedente. Questa funzione accetta il nome del ClientID del controllo CheckBoxList e il numero di caselle di controllo in tale controllo. La funzione di loop poi attraverso gli elementi nel controllo e imposta la proprietà "controllato" scatola di ogni controllo a "true".

13 Premere il tasto "F5" per eseguire il progetto. Il modulo si apre nel browser e visualizza il controllo CheckBoxList che contiene due caselle di controllo.

14 Fare clic sul pulsante del form. La funzione JavaScript viene eseguito e aggiunge segni di spunta alle caselle di controllo.

Consigli e avvertenze

• Si noti l'ultima riga di codice nella funzione JavaScript che dice "return false". Questa linea è opzionale. Se si include nel codice, il tuo browser non emetterà un post al server Web. Eliminando un post indietro, si posiziona meno domanda sul server e gli utenti non devono aspettare che il proprio browser per comunicare con il server prima di aggiungere segni di spunta alle caselle di controllo. Se si desidera che il browser di emettere un palo, rimuovere l'ultima riga di codice.