Désolé kiboost je n’ai pas compris, je ne maitrise pas du tout le js.
A quel endroit faudrait-il faire un trigger ?
J’ai trouvé cette ligne dans un fichier : $(‹ body ›).trigger(‹ jeedom_page_load ›)
Là où tu change de design en appuyant sur ton bouton
J l’utilise aussi le menu mais cela fonctionne, mais c’est vrai quand tu change sur le menu page cela n’est pas prix en compte a part de faire le rafraîchissement celle-ci. Tu utilise la version du menu JSON ou pas ? j’utilise le menu F$B33 qui a été remodeler et plus simple à appliquer. menuJsonFsb33Frame sur ce site https://github.com/noodom/jeedom_menus/tree/master/menuJsonFsb33Frame
en cours de création :
Je n’ai pas encore essayé le menu à base de JSON non.
Enfin il faut trouver une solution, tu confirmes que ça ne fonctionne pas juste en cliquant sur un bouton donc ce n’est pas « encore » une solution définitive.
Je confirme,quand on clique sur le menu changement de plan celui-ci n’est pas prix en compte à moins de rafraîchir la page F5. justement je viens tester la pour voir, et je vois cela comme toi, le menu F$B33 viens de @Salvialf et modifier par @noodom en json on va arriver ça serait top.
Bon, voila on tient la « solution finale » :
Ce Javascript dans la Personnalisation avancée (j’ai mis un timeout 100ms pour que ça aille plus vite à resize lors du chargement du design) :
function addColspan(_tabObjects) {
if (!_tabObjects) return
var nbtd
_tabObjects.each(function() {
if ($(this).css("column-span") != undefined)
{
if ($(this).css("column-span") === 'all')
{
nbtd = $(this).siblings().length + 1
$($(this).siblings()).remove()
$(this).attr('colspan', nbtd)
}
}
})
}
$(function() {
$('body').on('jeedom_page_load', function (event) {
setTimeout(function() {
addColspan($("TD"))
}, 100)
})
})
Une modification des onglets du Design F$B33 pour déclencher le pageload lors du clique sur le bouton de menu en ajoutant $('body').trigger('jeedom_page_load'); après le displayPan(); :
<a onClick="planHeader_id=10; displayPlan(); $('body').trigger('jeedom_page_load');"><li class="monmenu selected"><div class="imagette"><img src="montheme/images/icon_home.png" height=50px width=50px></div></br></li></a>
Et bien sur la mise en place du css column-span:all sur l’une des cellules :
Merci à @olivvv59 pour son code d’origine !
Merci à @kiboost pour son intervention miraculeuse et l’idée du jeedom_page_load
Il y a surement mieux, mais c’est plus cher 
1 « J'aime »
Ok moi je l’ai modifier dans le html du menu dans une partis du code de @noodom a cette adresse : jeedom_menus/menuJsonFsb33Frame at master · noodom/jeedom_menus · GitHub et timeOut mis comme toi aussi.
if (frameDestination == null) {
// no frame : page redirection
planHeader_id = id;
displayPlan();
$('body').trigger('jeedom_page_load');
et cela fonctionne aussi.
Merci a vous.
1 « J'aime »
Bonjour à toi comme promis, je confirme que cela fonctionne donc je récapitule :
Le code à mettre dans paramètre avancée JavaScript :
function addColspan(_tabObjects) {
if (!_tabObjects) return
var nbtd
_tabObjects.each(function() {
if ($(this).css("column-span") != undefined)
{
if ($(this).css("column-span") === 'all')
{
nbtd = $(this).siblings().length + 1
$($(this).siblings()).remove()
$(this).attr('colspan', nbtd)
}
}
})
}
$(function() {
$('body').on('jeedom_page_load', function (event) {
setTimeout(function() {
addColspan($("TD"))
}, 100)
})
})
Rajouter dans configuration de l’équipement Disposition sélectionner tableau et mettre column-span:all;
sur la ligne qu’on veux fusionner.
Résultat dashboard ou vues:
Résultat Design :
Attention ceux qui utilise le menu F$B33 de @Salvialf faut rajouter ceci dans le lien du menu
$(‹ body ›).trigger(‹ jeedom_page_load ›);
Exemple :
<a onClick="planHeader_id=10; displayPlan(); $('body').trigger('jeedom_page_load');"><li class="monmenu selected"><div class="imagette"><img src="montheme/images/icon_home.png" height=50px width=50px></div></br></li></a>
Pour ceux qui utilise le menu F$B33 de @noodom menu json Frame, dans le fichier html a inserer dans html Display dans la partis menu rajouter cela $(‹ body ›).trigger(‹ jeedom_page_load ›); dans cette partis du code ci-dessous :
if (frameDestination == null) {
// no frame : page redirection
planHeader_id = id;
displayPlan();
$('body').trigger('jeedom_page_load');
Le code $(‹ body ›).trigger(‹ jeedom_page_load ›); peut-être mieux le positionner.
Merci beaucoup à @olivvv59 pour son code d’origine !
Merci beaucoup à @kiboost pour son intervention et aide.
Merci à @salvitaf et @noodom pour leur exellent menu.
Merci à tous.
J’espère que j’oublie rien.
Sa serait bien que ce code sois présent dans jeedom ou une option pour le faire dessus cela serait peut être beaucoup mieux.
1 « J'aime »
Merci pour le récapitulatif.
J’ai contacté un admin ce matin pour la maj de Youdom.
Y a plus qu’a trouver un créneau avec lui
Bonjour à tous,
J’ai lu attentivement vos explications et j’ai appliqué ça sur mes titres… Au top!
J’ai voulu aller un peu plus loin en essayant de bidouiller le javascript mais sans succès, pensez vous que l’on pourrait faire un « else » qui permettrait d’appliquer un nombre pour par exemple ne fusionner que deux cellules?
Bonne journée!
Hello,
je suis trop fatigué ce soir.
Je regarderais demain, pour trouver une solution, si tu n’as pas trouvé d’ici la 
Et ce qui serait sympa aussi c’est de fusionner en vertical 
Hello,
voila, j’ai ajouté un bloc pour gérer la fusion en mettant les cellules :
if ($(this).css("grid-column-start") != undefined)
{
var nb = $(this).css("grid-column-start");
if ($(this).css("grid-column-start") != 'auto' && $(this).css("grid-column-start") != '')
{
for(let i=1;i<nb;i++)
{
//debugger
$($(this).next()).remove();
}
$(this).attr('colspan',nb);
}
}
on passe maintenant par la propriété : grid-column-start
(dans la propriété column-span , on ne peut pas passer de chiffres)
Par contre, c’est toujours de la bidouille. on détourne des attributs css de leur utilisation.
Mais ça devrait fonctionner.
dit moi, si c’est ok de ton coté.
EDIT : au final, c’est plus flexible que la première méthode.
Je regarde mais c’est plus compliqué à gérer.
ajoute cette condition dans le code précèdent (celui d'origine) :
if ($(this).css("grid-row-start") != undefined)
{
var nb = $(this).css("grid-row-start");
var idTD = $(this).index();
if ($(this).css("grid-row-start") != 'auto' && $(this).css("grid-row-start") != '')
{
var elt = $(this).parent('tr');
for(let i=1;i<nb;i++)
{
elt = elt.next();
elt.children()[idTD].remove();
}
$(this).attr('rowspan',nb);
}
}
j’ai utilisé grid-row-start
sans :
avec :
dit moi, si c’est ok de ton coté.
voila le code avec les 2 ajouts :
function addColspan(Tabobjets) {
//console.log('fonction');
Tabobjets.each(function(objet) {
if ($(this).css("column-span") != undefined)
{
//console.log('column-span');
if ($(this).css("column-span") === 'all')
{
//console.log('column-span== all');
var nbtd = $(this).siblings().length + 1;
$($(this).siblings()).remove();
$(this).attr('colspan',nbtd);
}
}
if ($(this).css("grid-column-start") != undefined)
{
var nb = $(this).css("grid-column-start");
if ($(this).css("grid-column-start") != 'auto' && $(this).css("grid-column-start") != '')
{
for(let i=1;i<nb;i++)
{
//debugger
$($(this).next()).remove();
}
$(this).attr('colspan',nb);
}
}
if ($(this).css("grid-row-start") != undefined)
{
var nb = $(this).css("grid-row-start");
var idTD = $(this).index();
if ($(this).css("grid-row-start") != 'auto' && $(this).css("grid-row-start") != '')
{
var elt = $(this).parent('tr');
for(let i=1;i<nb;i++)
{
elt = elt.next();
elt.children()[idTD].remove();
}
$(this).attr('rowspan',nb);
}
}
});
};
Je prends en bloc ce code dans la perso et je fais le test
Je ne comprends pas mais quand je colle ton code dans la partie Javascrip du Dashboard et bien rien ne se passe du tout
Mais il en est de même pour le bout de code CSS !
Je ne comprends pas on dirait que la personnalisation avancé ne fonctionne pas
1 « J'aime »
il faut que tu appelles ta fonction javascript
$(function() {
$('body').on('jeedom_page_load', function (event) {
setTimeout(function() {addColspan($('TD'))}, 300)
})
})
au chargement de Jeedom, on lance la fonction au bout de 300ms (le temps que jeedom charge ses modules. si ca fonctionne pas bien, on peut augmenter ce délai).
pour ton css, peux tu tester
border-radius : 50 px !important;
Tu utilises bien dans ton exemple grid-row-start mais ça marche à moitié chez moi.
Je ne suis pas sûr de comprendre pour fusionner en vertical ou horizontal. C’est du relatif ou de l’absolu ?
Dans ton exemple, tu mets 4. Ca marche sur la première cellule pour moi. Mais si j’en ai d’autres, marche pas !
Par exemple :
grid-row-start:2;
Me permet de fusionner la 3e colonne, 3e ligne avec la 3e colonne, 4e ligne vide.
qui donne :
mais si je fais la même chose sur la 3e ligne de la 4e colonne avec le même code pour fusionner avec la 4e ligne, 4e colonne… comme tu le vois, ça ne marche pas.
