Redimensionnement d'un div sur un clic de bouton, devrait-il être fait avec AJAX?

Question

Je veux redimensionner un div de côté client, il est la valeur par défaut est la hauteur: 500px, en cliquant sur mon bouton, il fixe à la hauteur: 700px.

C'est un site web asp.net.

Je suis invité à le faire en utilisant AJAX et je ne sais pas si cela signifie d'utiliser le javascript côté client de la bibliothèque Microsoft AJAX, ou si cela signifie d'utiliser AJAX côté serveur faire une publication partielle.

La grille peut être ajustée très bien si j'ouvre les outils de développement IE et régler la hauteur de css en ligne: 500px attribut de l'élément div.

<div id="myDiv" style="position: relative; width: 100%; height: 500px; overflow: hidden;"> 

Si cela est fait avec AJAX, quelles sont les options? JavaScript, JQuery, tout avantage d'utiliser l'un ou l'autre?

Edit: merci

Answer 1

Vous pouvez faire Javascript pur pour cela, ou vous pouvez utiliser jQuery ou d'une autre bibliothèque côté client. Un aller-retour au serveur serait un gaspillage de ressources. Ajax (Javascript asynchrone et XML) semble être un gâchis ici quand le Javascript côté client ferait l'affaire.

En utilisant jQuery votre code serait:

$("#button").click(function() { 
    $("#myDiv").style('height','700px'); 
}); 

Sinon, vos styles devrait vraiment être dans un fichier CSS externe. Dans ce fichier, vous auriez:

#myDiv { 
    position: relative; 
    width: 100%; 
    overflow: hidden; 
} 
.myDivStartHeight { 
    height: 500px; 
} 
.myDivNewHeight { 
    height: 700px; 
} 

Votre HTML assignerait d'abord une classe de myDivStartHeight (en utilisant un nom plus sémantique) à myDiv. Ensuite, vous pouvez faire:

$("#button").click(function() { 
    $("#myDiv").removeClass("myDivStartHeight").addClass("myDivNewHeight"); 
}); 

Cela peut aussi être fait dans le plus pur Javascript sans jQuery si vous avez pas d'autre besoin de jQuery. Sans jQuery vous vous ouvrez à la gestion de plus de différences de navigateur, ce qui ne sera pas très amusant. Cependant, jQuery ajoute des bits à votre code et il y a des moments où cela peut être exagéré!

Answer 2

Que ce que vous parlez est tout javascript, et oui, il doit être fait en utilisant javascript.

Vous pouvez écrire directement javascript ligne dans votre élément div, ou vous pouvez écrire la fonction de le faire pour vous et appelez-onclick.