Discussion :

[Darkaurora]

J'ai besoin d'aide et de conseil pour développer proprement une appli web.

J'ai une page qui contient un container menu, un container d'affichage de résultat et de pagination et un container pour afficher les résultats sous forme d'un tableau html

chaque résultat correspond à une ligne du tableau.

Et une panoplie d'événement permet de gérer l'ensemble:
option d'impression, de suppression, d'édition, déplacement...

L'édition charge un modal via AJAX et contient un formulaire permettant la saisie d'un devis. A chaque enregistrement ou fermeture du modal je rafraîchis ma page car j'ai constaté qu'au bout de plusieurs création, modification ma page ramé.

Je souhaite re développer cette page afin d'y incorporer une synchronisation des données et empêcher ces rafraîchissement qui frêne l'utilisation de l'application.

Je pense que le chargement des différents éléments (HTML, CSS, JS) restent dans le scope du navigateur et le font ramer au fil du temps.

Ma question est comment détruire complètement le contenu d'un élément chargé via AJAX?

[NoSmoking]

Bonjour,

Ma question est comment détruire complètement le contenu d'un élément chargé via AJAX?

autant lire la documentation officielle de l'API et notamment sur la méthode .html().

[Darkaurora]

Sur l'hidden du modal j'utilise <codeinline>.empty()</codeinline>
et pourtant ça n'empêche pas le système de ramé au bout d'un moment...

Je pense que cela vient plutôt des scripts jquery qui son loader en même temps que le contenu du modal

[danielhagnoul]

Bonsoir

L'édition charge un modal via AJAX et contient un formulaire permettant la saisie d'un devis. A chaque enregistrement ou fermeture du modal je rafraîchis ma page car j'ai constaté qu'au bout de plusieurs création, modification ma page ramé.

D'après ce que vous dites, je pense que vous créez plusieurs dialogues.

Si le contenu du dialogue et sa gestion diffèrent peu d'une utilisation à l'autre :

1. Il faut créer un seul dialogue (modal ou non, peu importe) par page web.
2. Il faut montrer et cacher le dialogue en fonction des événements générés par l'utilisateur.
3. Il faut modifier le contenu du dialogue avant de le montrer à l'utilisateur.
4. Il faut gérer la sauvegarde du contenu du dialogue après l'avoir caché à l'utilisateur.

Si le contenu du dialogue, sa gestion ou son apparence diffère beaucoup à chaque utilisation, il faut détruire l'ancien dialogue avant d'en créer un nouveau. Pour jQuery UI Dialog, il faut utiliser la méthode destroy.

[Darkaurora]

Ok merci, j'utilise les modal bootstrap qui ne peuvent se détruire que si on set la data à null.

Une autre interrogation me pèse je souhaite fonctionner sur un modèle de synchronisation

L'utilisateur se log ==> chargement de toutes les données ==> mise en page des données et navigation, tri, filtre, sont opéré en JS ==> AJAX pour la synchronisation des données entre le client et le serveur

Cependant je ne suis pas sûr de cette solution pour des questions de sécurités principalement.

Ma question : Comment feriez vous pour créer une tel application sachant que vous devez gérer plusieurs millier de clients, de contact, de produits...

[danielhagnoul]

Pour le cas d'un seul dialogue, j'oubliais un point capital !

Il ne faut pas confondre les méthodes empty() (vider) et remove() (détruire).

Pour des modifications importantes, il faut éviter au maximum de manipuler le DOM directement. Il faut détacher l'élément parent avec la méthode detach(), vider ou détruire des éléments enfants avant d'apporter les modifications nécessaires, créer de nouveaux éléments enfants si nécessaire, puis remettre l'élément parent en place avec une méthode append() ou similaire.

Je n'ai pas utilisé cette technique pour un cas similaire à celui que tu décris.

Je l'ai utilisé avec succès pour un dialogue qui pouvait changer son contenu en fonction des choix de l'utilisateur, il y avait tout de même plusieurs dizaines de possibilités, sans problème avec la gestion mémoire des navigateurs. Mais il faut faire très attention et aider le navigateur à libérer la mémoire, tout élément qui ne sert plus doit être immédiatement détruit par un remove().