Form

Setup

hdrs = bootstrap_hdrs()+download_js()+datatable_hdrs()

show(*hdrs)

from ngrok_token import *
url = start_ngrok(token)

ngrok tunnel opened at: https://a223-3-238-95-91.ngrok-free.app

app,rt = fast_app(pico=False,hdrs=hdrs)
server = JupyUvi(app)

File upload & receive

Upload csv/excel file

---

source

get_file_input

 get_file_input (label_text, id, **kwargs)

get_file_input('Select csv/excel for upload',id='sdf')

Select csv/excel for upload

Receive file

---

source

bytes2df

 bytes2df (bytes_data, file_type)

Example

@rt
def file_upload(req):
    add = get_file_input(
        'Upload your csv or excel',
        id='myFile',post=preview, target_id='content',hx_trigger='change')
    
    example_file = A(Small('Download Example File'), href=req.url_for('download_example'),download='example.csv')
    
    return Group(add,example_file), Div(id='content')

@app.get
def download_example():
    return FileResponse('data/example.csv')

@app.post
async def preview(sess, myFile:UploadFile):
    filename = myFile.filename

    if filename.endswith('.csv'):
        file_type = 'csv'
    elif filename.endswith(('.xls', '.xlsx')):
        file_type = 'excel'
    else:
        return add_toast(sess, "Please upload a csv or excel file", "error")
        
    # Data as byte string
    bytes_data = await myFile.read()
    df = bytes2df(bytes_data,file_type)
    
    if len(df)>100_000:
        return add_toast(sess, "Exceed 100,000 lines, please use python api for large file", "warning")
    
    return df2html(df.head())

htmx(url,'/file_upload')

Input text

---

source

get_input

 get_input (label_text, id, cls=None, type='text', **kwargs)

get_input('Gene ID',id='aa')

Gene ID

---

source

get_button

 get_button (text, cls, **kwargs)

Form(get_input('sdf','a',cls='col-3'),get_button('aaa',cls='col-1'),cls='row g-2')

sdf

---

source

get_input_list

 get_input_list (label_text, input_list, id, cls=None, type='text',
                 **kwargs)

get_input_list('Select item', ['a','b','c','d'],id='select')

Select item

TextArea

Textarea(id='s', placeholder='sdf', cls='form-control',rows=10)

Select (default is first)

---

source

get_select

 get_select (label_text, option_list, id, cls=None, **kwargs)

The first item in the option_list is the default

Select

---

source

get_select_simple

 get_select_simple (label_text, select_list, id, cls=None)

get_select_simple('select one', ['a','b','c'],id='ssdf')

select oneabc

Select multiple

---

source

get_select_simple_multiple

 get_select_simple_multiple (label_text, select_list, id, cls=None)

get_select_simple_multiple('select one', ['a','b','c'],id='ssss')

select oneabc

Spinner

---

source

get_spinner

 get_spinner (id, cls='d-flex justify-content-center')

get_spinner(id='sdf')

Loading...

Example:

# @app.post
# def example():
#     ...
#     send_select = Form(
#             Hidden(value=df.to_json(),id='upload_df'),
#             Div(select_list,button,cls='row g-2 align-items-center'),
#             post=calculate,
#             target_id='result',
#             hx_indicator='#spinner',
#         )
    
#     spinner=get_spinner(id='spinner')
    
#     return send_select, spinner, ...

End

server.stop()
kill_ngrok()

ngrok tunnel killed