Javascript code block formatting

For those who develop applications using C# or Javascript, but I think Java too, (I’m not a Java developer and then I don’t know if what I’m going to say is true for them as well) ,  there are two kind of writing styles for indentation and code’s blocks formatting .

These styles, known as K&R (Kernighan & Ritchie) style and Allman style, concern the way the opening curly brace is opened, when defining a block of code.

The former places the brace in the same line as the preceding line of code, as you can see in this example:

return {
   name: "Joe"
};

the latter places the curly brace in its own line, as shown here:

return
      {
        name: "Joe"
      };

So, the question is:

Can I use both of these styles or not when writing code ?

The answer is: yes, except for Javascript code.

In Javascript you must always use the K&R style if you want to avoid some subtle bugs that may be very difficult to identify.

For example, if you used the code in Allman style showed below

the return value would be “undefined” and not an object as expected, because the browser insert a semicolon after the word “return”.

If the code below had written in K&R (Kernighan & Ritchie) style:

as shown in first example, the return value would have been an object as expected.

Tag di Technorati: ,

Invocazione di metodo remoto da Javascript

A partire da ASP .NET 3.5 è possibile da JavaScript richiamare un metodo esterno, implementato nella stessa pagina aspx che invoca il codice Javascript, oppure in un ASP .NET XML Web Services (per intenderci, quello in formato .asmx), oppure in un WCF Services (in formato .svc), tutto questo senza passare attraverso il normale ciclo di vita della pagina, ma invocando semplicemente un metodo pubblico di una classe, visto che la pagina aspx è una classe a tutti gli effetti.

Al metodo è possibile passare dei parametri e ricevere indietro un valore di ritorno, che sarà serializzato / deserializzato in modalità JSON.

Se si ha la necessità di eseguire codice lato server senza passare dall’intero ciclo di vita della pagine, invocare un metodo pubblico della pagina è sicuramente la soluzione più veloce da implementare, poichè non necessita di creare una applicazione a sè stante (il web service o il WCF Service), e quindi è anche più facile da installare e da manutenere, ma non è esente da limitazioni, la maggiore delle quali è l’impossibilità di richiamare il metodo pubblico da parte di pagine diverse rispetto a quella in cui lo stesso è dichiarato (in tal caso è necessario creare un servizio web, ASP .NET XML Web Service oppure WCF Service).

Di seguito i passi necessari per richiamare un metodo pubblico esposto dalla classe che genera la pagina aspx, da codice Javascript:

  • E’ necessario creare un metodo pubblico e statico all’interno della classe che identifica la pagina aspx e decorarlo con l’attributo System.Web.Services.WebMethodAttribute;
[WebMethod]
public static string GetValueFromServer(string param1, string param2)
{
    return "TEST_RETURN_VALUE";
}
    • E’ necessario assegnare True alla proprietà  EnablePageMethods dell’oggetto ScriptManager ospitato dalla pagina in questione (il valore di default è False), per abilitare l’invocazione di metodi di pagina;
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />
  • I due passaggi precedenti fanno in modo che nella pagina aspx sia iniettato del codice di script (inline) che permette di richiamare il “Web Method”. Questo codice di script comprende essenzialmente un oggetto chiamato “PageMethods“, il cui nome è hardcoded e quindi non modificabile, avente metodi statici con lo stesso nome dei metodi statici di pagina, mediante cui è possibile richiamare questi ultimi passando gli opportuni parametri, e indicando una funzione di callback che sarà automaticamente richiamata al termine dell’invocazione del metodo remoto e che conterrà il valore di ritorno di quest’ultimo, piu un metodo di callback opzionale che sarà automaticamente richiamato in caso di errore del metodo remoto.
function Function1 {
    PageMethods.GetValueFromServer( param1, param2, onSuccessfullCall, onErrorCall);
}
  • La funzione di callback richiamata in caso di errore è opzionale. Occorre tener presente che l’invocazione del metodo remoto è asincrona, quindi il controllo tornerà immediatamente al codice Javascript chiamante. Al termine della invocazione del metodo sarà invocata automaticamente la funzione di callback opportuna (chiamata conlusa con successo o con errore). Nel caso di chiamata conclusa con esito positivo, la funzione di callback conterrà anche il valore di ritorno del metodo remoto invocato.
function onSuccessfullCall(results, userContext, methodName) {
    alert(results);
}
 
function onErrorCall(error, userContext, methodName) {
    if (error !== null)
        alert(error.get_message());
}
  • Il parametro results della funzione di callback richiamata in caso di invocazione riuscita conterrà il valore di ritorno del metodo remoto

Aggiornare in JavaScript la pagina chiamante in partial-rendering

Mediante JavaScript è possibile eseguire programmaticamente un post della pagina mediante il richiamo della funzione

 __doPostBack( 'EventName', 'EventArgs' );

In questo caso il post generato è sincrono, ma, come ben spiegato in questo post, è anche possibile effettuarlo asincrono mediante l’utilizzo di un array della classe PageRequestmanager, in questo modo:

function doPostBackAsync( eventTargetName, eventArgs )
{
     var prm = Sys.WebForms.PageRequestManager.getInstance();
     if( !Array.contains( prm._asyncPostBackControlIDs, eventTargetName) )
     {
         prm._asyncPostBackControlIDs.push(eventTargetName);
     }
     if( !Array.contains( prm._asyncPostBackControlClientIDs, eventTargetName) )   
     {
         prm._asyncPostBackControlClientIDs.push(eventTargetName);
     }

    __doPostBack( eventTargetName, eventArgs );    
}

Mediante poi l’utilizzo dell’UpdatePanel otteniamo che a livello programmatico (quindi senza necessariamente l’interazione dell’utente mediante un controllo), possiamo generare un post asincrono con refresh parziale della pagina, mediante il richiamo esplicito della funzione di cui sopra.

Inoltre, poichè in Javascript è anche possibile, richiamare esplicitamente una funzione definita dall’utente in una pagina mentre ci si trova in un altra pagina (esempio popup), mediante il seguente costrutto:

window.opener.nomeFunzioneCustom(parametri); 

otteniamo che, stando un una pagina secondaria come un popup, riusciamo ad aggiornare con il partial rendering la pagina chiamante.