tentative js table
This commit is contained in:
@@ -66,7 +66,7 @@ settings:
|
||||
language:
|
||||
language_list: un
|
||||
stylescombo:
|
||||
styles: "h4.title-niv4|title niv4\r\nh5.title-niv5|title niv5\r\nh6.title-niv6|title niv6\r\nh7.intertitre-niv7|Intertitre niv7\r\np.quote|Quote\r\np.psychologist-instruction|Psychologist Instruction\r\np.note | Note\r\np.note-title | Note Title\r\nh8.note-title | h8 Note Title\r\np.caution | Caution\r\nh9.caution-title | Caution Title\r\np.rowspan | Rowspan\r\np.liste-tiret | Liste tiret"
|
||||
styles: "h4.title-niv4|Title niv4\r\nh5.title-niv5|Title niv5\r\nh6.title-niv6|Title niv6\r\nh7.intertitre-niv7|Intertitre niv7\r\np.quote|Quote\r\np.psychologist-instruction|Psychologist Instruction\r\np.note | Note\r\np.note-title | Note Title\r\nh8.note-title | h8 Note Title\r\np.caution | Caution\r\nh9.caution-title | Caution Title\r\np.rowspan | Rowspan\r\np.liste-tiret | Liste tiret\r\np.cell-display-none | Display None\r\np.text-labor | Labor"
|
||||
drupallink:
|
||||
linkit_enabled: true
|
||||
linkit_profile: default
|
||||
|
||||
@@ -51,7 +51,7 @@ filters:
|
||||
status: false
|
||||
weight: -42
|
||||
settings:
|
||||
allowed_html: '<em> <strong> <cite> <blockquote cite> <code> <ul type> <ol type start> <li> <dl> <dt> <dd> <u> <a href hreflang !href accesskey id rel target title data-entity-type data-entity-uuid data-entity-substitution> <pre> <table> <caption> <tbody> <thead> <tfoot> <th> <td> <tr> <sub> <sup> <span dir lang> <img src alt data-entity-type data-entity-uuid data-entity-substitution data-align data-caption> <fn> <h1 class="title-part title-part-niv1"> <h2 id class="title-part-niv2"> <h3 id class="title-part-niv3"> <h4 id class="inter-titre title-part-niv4 title-niv4"> <h5 id class="inter-titre title-niv5"> <h6 id class="title-part-niv6 title-niv6"> <h7 class="title-part-niv7 title-niv7 intertitre-niv7"> <h8 class="note-title "> <h9 class="caution-title "> <p class="quote epigraph quote epigraph encadre quote psychologist-instruction note caution quote psychologist-instruction note caution liste-tiret quote psychologist-instruction note note-title caution liste-tiret quote psychologist-instruction note note-title caution rowspan liste-tiret ">'
|
||||
allowed_html: '<em> <strong> <cite> <blockquote cite> <code> <ul type> <ol type start> <li> <dl> <dt> <dd> <u> <a href hreflang !href accesskey id rel target title data-entity-type data-entity-uuid data-entity-substitution> <pre> <table> <caption> <tbody> <thead> <tfoot> <th> <td> <tr> <sub> <sup> <span dir lang> <img src alt data-entity-type data-entity-uuid data-entity-substitution data-align data-caption> <fn> <h1 class="title-part title-part-niv1"> <h2 id class="title-part-niv2"> <h3 id class="title-part-niv3"> <h4 id class="inter-titre title-part-niv4 title-niv4"> <h5 id class="inter-titre title-niv5"> <h6 id class="title-part-niv6 title-niv6"> <h7 class="title-part-niv7 title-niv7 intertitre-niv7"> <h8 class="note-title "> <h9 class="caution-title "> <p class="quote epigraph quote epigraph encadre quote psychologist-instruction note caution quote psychologist-instruction note caution liste-tiret quote psychologist-instruction note note-title caution liste-tiret quote psychologist-instruction note note-title caution rowspan liste-tiret quote psychologist-instruction note note-title caution rowspan liste-tiret cell-display-none text-labor ">'
|
||||
filter_html_help: true
|
||||
filter_html_nofollow: false
|
||||
filter_align:
|
||||
|
||||
@@ -2,33 +2,142 @@ console.log('salut');
|
||||
|
||||
// fusion cellules dans tableau
|
||||
|
||||
function tableOne(){
|
||||
var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
|
||||
var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
|
||||
var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
|
||||
var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
|
||||
///
|
||||
// doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td
|
||||
|
||||
table1cell1.setAttribute('rowspan', '4');
|
||||
table1cell2.style.display ="none";
|
||||
table1cell3.style.display ="none";
|
||||
table1cell4.style.display ="none";
|
||||
// var cellRowspan = document.querySelector('p.rowspan').parentElement;
|
||||
// cellRowspan.setAttribute('rowspan', '4');
|
||||
|
||||
// // ok va chercher tous les éléments p.cell-display-none (child)
|
||||
// const pDisplayNone = document.querySelectorAll('p.cell-display-none');
|
||||
// console.log(pDisplayNone);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// // ok va chercher un element td (parent)
|
||||
// var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;
|
||||
// console.log(tdDisplayNone);
|
||||
// /// et lui appliquer une class.
|
||||
// tdDisplayNone.classList.add('display-none');
|
||||
|
||||
///// comment aller chercher TOUS les éléments td ? //////
|
||||
let p = document.querySelectorAll('p.cell-display-none');
|
||||
|
||||
|
||||
|
||||
let pDisplayNone = document.querySelector('p.cell-display-none');
|
||||
console.log(pDisplayNone);
|
||||
let tdparent = [];
|
||||
while(pDisplayNone.parentNode.closest('td')){
|
||||
tdparent.push(pDisplayNone.parentNode.closest('td'));
|
||||
pDisplayNone = pDisplayNone.parentNode.closest('td');
|
||||
}
|
||||
console.log(tdparent);
|
||||
|
||||
|
||||
// function tableTwo(){
|
||||
// var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
|
||||
// var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
|
||||
// var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
|
||||
// var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
|
||||
|
||||
// table2cell1.setAttribute('rowspan', '4');
|
||||
// table2cell2.style.display ="none";
|
||||
// table2cell3.style.display ="none";
|
||||
// table2cell4.style.display ="none";
|
||||
/// pour chaque élément de array pDisplayNone ( NodeList ),
|
||||
// pDisplayNone.forEach((element) =>document.querySelectorAll('td'));
|
||||
|
||||
/// aller chercher le parent td
|
||||
/// et lui appliquer une class.
|
||||
|
||||
// faut faire un array de td avant de faire un for each
|
||||
// let td = new Array(pDisplayNone);
|
||||
// console.log(td);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// const parent = document.getElementById("parent");
|
||||
// let childNodes = parent.childNodes;
|
||||
// console.log(childNodes.length); // let's assume "2"
|
||||
// parent.appendChild(document.createElement("div"));
|
||||
// console.log(childNodes.length); // outputs "3"
|
||||
|
||||
|
||||
|
||||
// function displayNone(){
|
||||
|
||||
// for (let i = 0; i < cellsDisplayNone.lenght; i++ ){
|
||||
// const cellDisplayNone = cellsDisplayNone.parentElement[i]
|
||||
// // let cellDisplayNone = this.parentElement.getElementsByClassName("cell-display-none");
|
||||
// // console.log(cellDisplayNone);
|
||||
|
||||
|
||||
// }
|
||||
|
||||
|
||||
// };
|
||||
// cellDisplayNone.classList.add('display-none');
|
||||
// cellDisplayNone.style.display ="none";
|
||||
|
||||
|
||||
|
||||
|
||||
// for (let i = 0; i < cellDisplayNone.lenght; i++ ){
|
||||
|
||||
// cellDisplayNone.style.display ="none";
|
||||
// }
|
||||
|
||||
tableOne();
|
||||
|
||||
//////////////
|
||||
|
||||
// var cellsRowspan = document.getElementsByClassName("rowspan");
|
||||
// var cellsDisplayNone = document.getElementsByClassName("cell-display-none");
|
||||
|
||||
// function rowspan(){
|
||||
// // for (let i = 0; i < cellsRowspan.length; i++){
|
||||
// // cellsRowspan[i].
|
||||
// // }
|
||||
// let cellRowspan = this.parentNode.querySelector(".rowspan");
|
||||
// cellRowspan.setAttribute('rowspan', '4');
|
||||
// }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// function tableOne(){
|
||||
// var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
|
||||
// var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
|
||||
// var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
|
||||
// var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
|
||||
|
||||
// table1cell1.setAttribute('rowspan', '4');
|
||||
// table1cell2.style.display ="none";
|
||||
// table1cell3.style.display ="none";
|
||||
// table1cell4.style.display ="none";
|
||||
// }
|
||||
|
||||
|
||||
// // function tableTwo(){
|
||||
// // var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
|
||||
// // var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
|
||||
// // var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
|
||||
// // var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
|
||||
|
||||
// // table2cell1.setAttribute('rowspan', '4');
|
||||
// // table2cell2.style.display ="none";
|
||||
// // table2cell3.style.display ="none";
|
||||
// // table2cell4.style.display ="none";
|
||||
|
||||
// // }
|
||||
|
||||
// tableOne();
|
||||
// tableTwo();
|
||||
|
||||
// var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
|
||||
@@ -42,6 +151,14 @@ tableOne();
|
||||
// table2cell4.style.display ="none";
|
||||
|
||||
|
||||
// const table = document.getElementByClass("paragraph--type--text");
|
||||
// console.log(hello);
|
||||
// for (const child of table.children) {
|
||||
// console.log(child.tagName);
|
||||
// }
|
||||
|
||||
|
||||
// const paragraph = document.getElementsByClassName("paragraph--type--text");
|
||||
// for (const table of paragraph.children){
|
||||
// table.addClass("rowspan");
|
||||
// }
|
||||
|
||||
|
||||
@@ -20,11 +20,12 @@ table{
|
||||
border: 1px solid #333;
|
||||
text-align: center;
|
||||
padding: 1rem;
|
||||
|
||||
background-color: red;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
#paragraph-id--226{
|
||||
tbody {
|
||||
td{
|
||||
|
||||
@@ -3,4 +3,6 @@
|
||||
}
|
||||
|
||||
|
||||
|
||||
.display-none{
|
||||
display: none;
|
||||
}
|
||||
@@ -3,7 +3,7 @@
|
||||
/*components*/
|
||||
@import "components/_quotes";
|
||||
@import "components/_tablefields";
|
||||
@import "components/_notes.scss";
|
||||
@import "components/_notes";
|
||||
|
||||
/*global*/
|
||||
|
||||
|
||||
Reference in New Issue
Block a user