How can I expand the margins on a matrix table using Java script? | XM Community
Skip to main content

Hi! I Can anyone assist with the java script that is used to change the width/expand the margins in a matrix table? I have statements that are very long and I would like to have them appear more like sentences. I have already tried to adjust by moving the bar in the survey builder on that question. I am using the new survey experience. I recall being able to do this in the past, however I have misplaced the code. 

Hi ​@VoyaAdmin ,

Please try the code below and let me know if it works. Adjust 500px width as per your need.
 

Qualtrics.SurveyEngine.addOnReady(function() {
    var qContainer = this.getQuestionContainer();

    function styleMatrix() {
       
        var tables = qContainer.querySelectorAll('table.Matrix, table.matrix, .q-matrix table, table');
        if(!tables.length) return;
        tables.forEach(function(table){
            try {
                
                table.style.tableLayout = 'fixed';
                table.style.width = '100%';
                var rows = table.querySelectorAll('tr');
                rows.forEach(function(row){
                    var firstCell = row.querySelector('td, th');
                    if(firstCell){
                        firstCell.style.maxWidth = '500px';     
                        firstCell.style.whiteSpace = 'normal';
                        firstCell.style.overflowWrap = 'break-word';
                        firstCell.style.wordBreak = 'break-word';
                    }
                });
            } catch(e) {
            }
        });
    }
    styleMatrix();
    var mo = new MutationObserver(function() { styleMatrix(); });
    mo.observe(qContainer, { childList: true, subtree: true });

});


It did not work, however could be where I am putting the code? 

 


Hi ​@VoyaAdmin ,

You need to place the code in the JavaScript section of that matrix question. Also, make sure to remove or clear any default code before pasting the above code.