Question

我一直在努力在仪表板应用程序中生成模态。我确实将.css和.js文件都放在assets文件夹中，但是我不确定在回调中调用.js函数的语法，.js函数接受.css参数然后将其激活，因此它具有是否根据已更正的文件显示弹出窗口（模态）效果。

.css文件包含模式代码

.popup_File {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 50%) scale(0);
  transition: 500ms ease-in-out;
  border: 1px solid black;
  border-radius: 10px;
  z-index: 10px;
  width: 500px;
  max-width: 80%;
}
.popup_File.active{
  transform: translate(-50%, 50%) scale(1);
}

.js编写用于激活css文件中的模式的Javascript函数

function openmodal(popup){
  if (popup == null) return
  popup.classList.add('active')
  document.write('see')
}

我想实际激活css模态的回调（请参见注释）->

 import dash_bootstrap_components as dbc 
import dash_bootstrap_components as dbc 
import dash_core_components as dcc 
import dash_html_components as html 
from dash.dependencies import Input, Output, State, ClientsideFunction 

app = dash.Dash(__name__, external_stylesheets=[dbc.themes.JOURNAL])
app.layout = html.Div(
                className = 'popup_File',
                id = 'Wrong_file',
                children = [
                        html.Div( 
                            className = 'header', 
                            children = [
                                html.Div("Invalid file type", className = 'title'),
                                html.Button('&times', className = 'Close_wrongFile', id = 'File')]),
                        html.Div('The file you have uploaded does not have the vcf file extension.', className = 'Warning_wrongfile')
                    ]
    )

#Call back for checking uploaded file
    
    @app.callback(
    Output('place_Filename', 'children'),
    [Input('VCF', 'contents')],
    [State('VCF', 'filename')]
    )
    def VCF_processing(contents, filename):
    if filename is None:
        layout = html.Div(
        [
            html.H6(
                'Drag and Drop .vcf '
            )
        ]
        ) 
        return layout
    else:
        if '.vcf' not in filename:
        #... I want to call the .js function here to tell the user that an incorrect file has been uploaded
            return warning modal

if __name__ == '__main__':
    app.run_server(debug=False)

我一直在努力寻找要使用的正确语法，以及如何放置.js代码并在Python破折号中使用正确的参数调用资源文件夹中的函数。请帮忙！

从破折号回调中调用JavaScript函数

0 个答案: