pythonazurejupyter-notebookjupyter-kernelazure-notebooks

How can I implement a File Dialog box that opens in Azure Jupyter Notebook In Python?

My Code :

%gui qt

from PyQt5.QtWidgets import QFileDialog

def gui_fname(dir=None):
    """Select a file via a dialog and return the file name."""
    if dir is None: dir ='./'
    fname = QFileDialog.getOpenFileName(None, "Select data file...", 
                dir, filter="All files (*);; SM Files (*.sm)")
    return fname[0]

from IPython.display import display
button = widgets.Button(description="Open The File  !!")
button.style.button_color = 'yellow'
display(button)


def on_button_clicked(b):
    print("Button clicked.")
    f=gui_fname()
    #import fileplot
    #fileplot.load_file(f)



button.on_click(on_button_clicked)
#b1 = Button(description='Open File !!')
#b1.style.button_color = 'yellow'
#b1.on_click(on_button_clicked)
#b1

Problem : It works fine in local pc python version 2.7 os Linux

But when i try to implement it remotely in Azure Jupyter Notebook It's kernel dies every time i run the code and i am not able to get the results . Is there any other way by which i can implement a file dialog box with html5 widgets in ipython widgets ??

What i need I need the user to Choose the file that is in His/Her pc which is locally aviable.1

enter image description here

Solution

  • Actually, you can not use any native GUI API on Azure Jupyter Notebook, due to Azure Jupyter Notebook runs on a remote Linux server without any GUI support and it's a web application for remote accessing.

    So if you want to show a file dialog box for client user, HTML File dialog is the only option for you. The simple solution is using the display & HTML class of IPython module to show a Choose File button, please see the code & result as below.

    from IPython.display import display, HTML

display(HTML("""
    <input type="file" name="myfile">
"""))

    The result is:

    enter image description here

    For more complex cases, you can refer to these blogs IPython Notebook: Javascript/Python Bi-directional Communication and Reading files in JavaScript using the File APIs to create your own one. However, there is lack a service to receive & save the upload file which need implement by yourself. Or you can simply use an existing project named fileupload(PyPI, GitHub) for IPython which is "An IPython notebook widget to upload files, using FileReader."