Search code examples
yuiyui-datatable

How to set width for YUI-data table dynamically based on max size of Column


I have a YUI datatable and I am putting the following data in the table:

 {key:"name", label:"name", editor: nameChoiceEditor},
 {key:"group", label:"group", editor: groupChoiceEditor},
 {key:"colony", label:"colony", width: 210, editor: colonyChoiceEditor},
 ...

Here the name column's width is set to the maximum length of characters entered for that name, and the same with group. colony's column width is set to 210 irrespective of the length of the data.

My problem is when the name column, having multiple words like "odaiah chitukuri", is showing in two lines like so:

  odaiah
  chitukuri

But when it is one word like "odaiahchitukuri" it is showing in a single line, meaning the column is adjusting to fit the word.

I should have the different words in sigle line. How to do that?


Solution

  • Have the 'breaking' spaces replace with non-breaking spaces.

    Try the following:

    Change:

    {key:"colony", label:"colony", width: 210, editor: colonyChoiceEditor},
    

    To:

    {key:"colony", label:"colony", width: 210, editor: colonyChoiceEditor
      formatter: function (el, oRecord, oColumn, oData) {
        el.innerHTML = oData.replace(/ /g, ' ');
      }
    },