DotNet JQuery (DNJ) : un framework pour integrer JQuery à Visual Studio et Microsoft .Net


     2


Alaa-eddine

Cet article présente un framework .Net que je suis entrain de développer, et dont le but est d’intégrer JQuery à l’IDE Visual Studio.

DNJ est l’abréviation de .Net JQuery (dot net JQuery), c’est un framework Open source sous licence LGPL

  • Pour le développeur .Net qui ne connais pas JQuery : lui permettre d’exploiter la puissance de cette librairie (JQuery) sans se poser trop de question et sans coder en JQuery, et ce à travers des webcontrols .Net, des ajax extenders, des http handlers …etc
  • Pour les développeurs .Net connaissant déjà JQuery : DNJ leur offrira toutes les possibilités ci-dessus tout en préservant leur habitudes de développeurs, ils pourront utiliser les webcontrols offerts tel quel, ou alors les étendre pour y injecter leur propres fonctionnalité.
  • Pour tous les deux types de développeur : DNJ s’intègre complètement à visual studio et permet de faire du JQuery en transparence.

Le framework est actuellement en version 0.4.1 beta, cette version inclue JQuery 1.4 et JQueryUI 1.8rc1.

Du RPC transparent avec DNJRPC

DNJ fournis tout d’abord une implémentation du standard JSON-RPC qui permet d’appeler vos méthodes .Net (codées en C#, VB.Net …etc) à partir de javascript en préservant les namespaces .Net .

Ainsi, vous pouvez définir une classe C#:

namespace MyNameSpace
{
    public class ServerSideMethods
    {
        public static string SayHello()
        {
            return "Hello World ";
        }
        public string Say(string something)
        {
            return something;
        }
        public int Add(int a, int b)
        {
            return a + b;
        }
        public double Add(double a, double b)
        {
            return a + b;
        }
        public void ServerProcess()
        {
            //Server side process code
        }
    }
}

Avec DNJ vous pouvez appeler ces méthode avec une syntaxe Javascript/JQuery du style :

<script>
$.DNJRPC.MyNameSpace.ServerSideMethods.ServerProcess();
</script>

Ou encore de manière plus avancées :

<script>
     $(document).ready(function(){
       $('#Button1').bind('click', function(){
            $.DNJRPC('#target').MyNameSpace.ServerSideMethods.SayHello();
       });

       $('#Button2').bind('click', function(){
            $.DNJRPC('#target').MyNameSpace. ServerSideMethods.Say('Some string here');
       });

       $('#Button3').bind('click', function(){
            var a = GetSomeValueForA();
            var b = GetSomeValueForB();
            $.DNJRPC('#result').MyNameSpace.ServerSideMethods.Add(a , b);
       });
     });
</script>

ci-dessus, #target et #result sont des éléments de votre document HTML (des DIV par exemple). Dans ce cas, DNJRPC fait appel à la méthode serveur en question, récupère le résultat et le copie dans le div passé en paramètre.

D’autres options sont disponibles pour faire des callback en cas de succès, d’echec …etc

Les appels DNJRPC se font via ajax, les requêtes/réponses respectent le protocole JSON-RPC

De nouveaux Web controls pour Visual Studio avec DNJUI

La plupart des widgets JQueryUI sont implémentés par cette version, à savoir : Tabs, Accordion, DatePicker, Slider, Dialog, Button

En plus de ca, DNJ fournis :

  • Une implémentation du themeroller JQuery en web control.
  • Des implémentations de divers plugins JQuery en Web Controls, ces Web controls s’enrichiront au fur et à mesure de l’avancement du projet. A terme, il y aura un web control pour les plugins JQuery les plus utilisés.
  • Un ajax extender (DNJ Panel) qui permet de transformer n’importe quel web control .Net existant en Web Control Ajax sans aucune modification, un peu comme le panel Ajax du framework Microsoft mais avec des possibilités plus étendues : callbacks, effets JQueryUI …etc
  • Un httpmodule permettant de gérer les ressources (fichier js, css, images) nécessaires par jquery et ces plugins.
  • Une API pour implémenter n’importe quel plugin JQuery en Web control .Net très facilement.

Démos et aperçus

Une démo de quelques modules de ce framework est disponible en ligne : DNJ demos

Ci-dessous un aperçu de l’intégration de DNJ à Visual Studio :

Cliquez pour agrandir les images

Webcontrols DNJ v0.4.0
DNJTabs : web control pour créer des onglets
DNJTabs : ce webcontrol permet de créer des onglets
DNJDatePicker : Ce webcontrol permet d’insérer un calendrier Ajax

Si vous souhaitez utiliser DNJ ou le tester, vous pouvez télécharger la dernière version en cliquant ici

L’installeur windows permet d’ajouter automatiquement les webcontrols DNJ à VisualStudio, il Ajoute également un template de projet Web qui intègre tout ce qui est nécessaire pour créer un site ou application web utilisant DNJ, ainsi qu’une solution de démonstration.

Pour plus d’informations :

Site officiel : http://dnj.eurekaa.org/

Dépôt projet : http://dnj.codeplex.com/

Articles sur CodeProject à propos de DNJ :

* A codeproject article about DNJ 0.3.5-beta (first public release)
* A codeproject article about DNJ 0.4.0-beta (new features : events …etc )



 

A lire également

 
  • BEZRHOUD

    Alaa, tu déchires! 😉

  • Alaa-eddine

    hum hum … Merci Merci 🙂