plotly-dash - 从 Dash 中的所有其他下拉列表中删除选项

Question

当从任何一个下拉列表中选择任何选项时，我希望从所有其他下拉列表中删除相同的选项。

为了帮助形象化这一点，我正在尝试构建一个列映射器。对于左侧的每个列名，右侧都有一个下拉列表，用户可以在其中从他们上传的文件中选择与左侧名称相对应的列名。由于源列和目标列具有一对一的关系，因此当从其中一个下拉列表中选择列名时，可以将其从所有其他下拉列表中删除。

作为概念证明，我使用下面的代码在其中一个下拉菜单上进行了尝试。当我从任何其他下拉列表中选择一个选项时，我希望该选项从这个特定的下拉列表中删除。我没有收到任何错误，回调出现在回调图中，但它什么也没做。回调中的打印语句甚至没有运行，这意味着回调实际上根本没有运行。

def generate_output_callback(input_id):
    def dd_callback(input_values, state):
        if not input_values:
            print('Preventing update.'.upper())
            raise PreventUpdate
        else:
            print(f'callback ran for dropdown {input_id}')
            for val in input_values:
                if val:
                    try:
                        i = state.index({'label': val, 'value': val})
                        del state[i]
                    except ValueError:
                        pass
            return state
    return dd_callback


all_cols = ['ACCTNUMBER', 'col2', 'col3']
inputs = {}
for col in all_cols:
    inputs[col] = Input(col, 'value')
all_other_inputs_dict = {k:v for (k,v) in inputs.items() if k != 'ACCTNUMBER'}
all_other_inputs = list(all_other_inputs_dict.values())
cb = generate_output_callback('ACCTNUMBER')
app.callback(
    Output('ACCTNUMBER', 'options'),
    all_other_inputs,
    [State('ACCTNUMBER', 'options')])(cb)

Answer 1

我会放弃你现在的回调。它已经很复杂了，您仍然需要添加更多下拉菜单。您需要的逻辑将要求每个下拉菜单都影响其他所有下拉菜单，如果结构不正确，这很容易成为一个循环。

为此，可以使用隐藏元素。隐藏元素将包含所有有效的下拉值。每个回调都会监听它并根据它更新它们的 options 属性。当用户从各种下拉菜单中选择列时，应该监听所有下拉菜单的 value 属性的隐藏元素将更新以删除已选择的项目。如果用户从下拉列表中取消选择一列，则隐藏元素可以将其重新添加进去，并且所有选项都将更新以将其重新添加。

编辑:

这是我的意思的一个例子:

@app.callback(Output('my-store', 'data'),
              [Input('my-dropdown-1', 'value'),
               Input('my-dropdown-2', 'value')],
              [State('my-store', 'data')])
def callback_func_update_store(dropdown_1, dropdown_2, store_state):
    original_options = store_state['original']  # so we can go back to the full set
    restricted_options = [x for x in original_options 
                          if x['value'] != dropdown_1 
                          and x['value'] != dropdown_2]
    return dict(
        original_options=original_options,
        restricted_options=restricted_options,
    )


@app.callback([Output('my-dropdown-1', 'options'),
               Output('my-dropdown-2', 'options')]
              [Input('my-store', 'data')],
              [State('my-dropdown-1', 'value'),
               State('my-dropdown-2', 'value')])
def callback_func_update_dropdown_options(store, dropdown_1, dropdown_2):
    dropdown_1_options = [x for x in store['original_options']
                          if x in store['restricted_options']
                          or x['value'] == dropdown_1]
    dropdown_2_options = [x for x in store['original_options']
                          if x in store['restricted_options']
                          or x['value'] == dropdown_2]
    
    return dropdown_1_options, dropdown_2_options

我还没有运行这段代码，所以它可能并不完美，但我希望它能给你一些想法。