How to use if statment inside div tags with streamlit

🎈 Using Streamlit
1

How to use if statement inside div tags with streamlit ?
Where i am using bootstrap card with streamlit to display info .
What i need is to be able to display the content inside the bootstrap card when its not empty and hide the field when its empty .

code:


def card(ID,name,nickname,mother_name,bd,):

    return f'''

    <div class="card text-center" style="width: 18rem;">

        <div class="card-body">

            <h5 class="card-title">ID: {ID}</h5>

            <h6 class="card-subtitle mb-2 text-muted">Name: {name}</h6>

            <p class="card-text">Nickname: {nickname}</p>

            <p class="card-text">Date of Birth: {bd}</p>

            <p class="card-text">Mother Name: {mother_name}</p>

        </div>

    </div>

    '''
st.markdown("""

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

""",unsafe_allow_html=True)

df_result_search = pd.DataFrame()
with st.sidebar.form(key='search_form',clear_on_submit= False):
     regular_search_term=st.text_input("Enter Search Term")
     if st.form_submit_button("search"):
         df_result_search = df[df['name'].str.contains(regular_search_term)|df['nickname'].str.contains(regular_search_term)|df['mother_name'].str.contains(regular_search_term)]
                        
                            
 st.write("{} Records ".format(str(df_result_search.shape[0])))
 for index ,row in df_result_search.iterrows():
         st.markdown(card(
                            row[0],
                            row[1],
                            row[2],
                            row[3],
                            row[4],
    ),unsafe_allow_html=True)
2

Hi @leb_dev -

In the end, you’re still building a string inside of Python, even though that string happens to be HTML. So inside of your card function, you can test whether the key is None, '' or whatever empty is represented as, then use string concatenation to add that to the overall string.

Best,
Randy

3

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.