Dropdown with different options in a column

Tags: #<Tag:0x00007efc6d34c4f0> #<Tag:0x00007efc6d34c158>
#1

I want Cell type as dropdown with different option in same column based on value of other cell in same row.

for example i have 2 columns, category and source.

if category cell having specific value then I want to show different options in source cell dropdown

can i do this?

#2

Hi @jamshaidbutt055

What you need is cell dependencies. Here we have an example of how it can be done: https://jsfiddle.net/handsoncode/gsn7txbd/ I hope that helps.

Different dropdown options for different rows in same column
#3

@adrian.szymanski I want to keep it simple, here is what I need to do.

 cells:(row, column) => {
   const categoryColData = instance.getDataAtCell(
         row,
         4
       );
       const isBaseRow = categoryColData
         ? categoryColData.includes("[", 0)
         : true;
       console.log(categoryColData, isBaseRow);
      return isBaseRow && column === 5
        ? {
            type: "dropdown",
            source: ["formula", "input", "data", "aggregate"],
            renderer: customRenderer,
          }
        :!isBaseRow && column === 5
        ?{
            type: "dropdown",
            source: ["formula", "input", "data"],
            renderer: customRenderer,
          } : {
            type: "text",
            renderer: customRenderer,
          };
    },

Now I don’t know how can I get value of column category in cells function. in custom renderer. I tried to get value but it is giving null. but for other cells its giving proper value. why is it so?

demo
https://jsfiddle.net/yd0mzsca/

#4

@jamshaidbutt055

Without knowing your current support plan I can only provide guidance with the examples that we already have. As this is heavily customized implementation I will need your current plan first. Please, send me your license ID at support@handsontable.com so I can check it.

#5

Thank you for your help. I have achieved what I wanted by changing source of cellProperty in renderer function.

const categoryColData = instance.getDataAtCell(row, 4);
const isBaseRow = categoryColData ? categoryColData.includes("[", 0) : true;
if (isBaseRow)
    cellProperties.source = ["formula", "input", "data", "aggregate"];
#6

Hi @jamshaidbutt055

Thank you for the update. I’m glad that you were able to solve the issue. I will close this topic now.

#7