Unable to clear input after submit
I’m very new to both huggingface and Gradio, so forgive me if this is a trivial issue, and I’m just a fool.I’m using a Blocks object to implement a very basic chatbot, and I’d like to essentially clear the input textbox after the user presses enter or presses the submit button.with gr.Blocks() as test:
    outp = gr.Chatbot(label="Reply", )
    inp = gr.Textbox(label="Chat with AI")
    inp.submit(chatbot, [outp, inp], outp)
    inp.update(lambda: None, inp)
    btn = gr.Button("Submit")
    btn.click(fn=chatbot, inputs=inp, outputs=outp)My code looks like this currently.I simply wish to clear the input textbox after the input is submitted.
2023-03-11T03:03:45Z
hi@alexjedi,You need to send an empty value back to the input textbox, just add these two linesbtn.click(lambda x: gr.update(value=''), [],[inp])
    inp.submit(lambda x: gr.update(value=''), [],[inp])
2023-04-13T13:35:08Z
Hi@alexjediI came across the same issue.In my scenario, I am using the chatbot UI from Gradio.with gr.Blocks() as demo:
    chatbot = gr.Chatbot()
    msg = gr.Textbox()
    clear = gr.Button("Clear")
    chat_history = []

    print(msg)
    
    def user(user_message, history):
        print("User message:", user_message)
        print("Chat history:", history)
        # Get response from QA chain
        response = qa({"question": user_message, "chat_history": history})
        # Append user message and response to chat history
        history.append((user_message, response["answer"]))
        print("Updated chat history:", history)
        # Clear the message box
        msg = ""
        print(msg)
        # Return response to chatbot
        return response["answer"], history

    msg.submit(user, [msg, chatbot], [msg, chatbot], queue=False)
    clear.click(lambda: None, None, chatbot, queue=False)I have the same problem that we I submit the query, the Textbox doesn’t get cleared, but also get filled up with the response from the model. (The response also shows up in the chat window, so the same text gets displayed twice!)How can I modify the code so as soon as the model returns the response, the text box will also get cleared?Thanks!
2023-04-14T01:22:48Z
hi@nhtkidYou want to return a clear state to msg box, can you try this?with gr.Blocks() as demo:
    chatbot = gr.Chatbot()
    msg = gr.Textbox()
    clear = gr.Button("Clear")
    chat_history = []

    print(msg)
    
    def user(user_message, history):
        print("User message:", user_message)
        print("Chat history:", history)
        # Get response from QA chain
        response = qa({"question": user_message, "chat_history": history})
        # Append user message and response to chat history
        history.append((user_message, response["answer"]))
        print("Updated chat history:", history)
        # Clear the message box
        msg = ""
        print(msg)
        # Return response to chatbot
        return gr.update(value=""), history

    msg.submit(user, [msg, chatbot], [msg, chatbot], queue=False)
    clear.click(lambda: None, None, chatbot, queue=False)
2023-04-14T05:55:15Z
Hi@radames,It worked beautifully.And the only difference in your code isreturn gr.update(value=“”), historyThank you so much!
2023-04-25T11:24:32Z
Hi please I have the same problem using the blocks in Gradio:interface = gr.Blocks()with interface:logos = gr.Image(value=logo_path, interactive=False, show_label=False, elem_id=“logo”)logos.style(height=100)chatbot = gr.Chatbot(label=“Conversation”)chatbot.style(height=350)message = gr.Textbox(placeholder=“Send a message”, label=“Chat”, elem_id=“back”)message.style(container=True)state = gr.State()send = gr.Button(“Send”, elem_id=“send”)message.submit(conversation_history, [message, state], [chatbot, state], queue=False)send.click(conversation_history, inputs=[message, state], outputs=[chatbot, state])send.style(size=“lg”)interface.launch()I want the Textbox to automatically clear after sending or the user hits enter.Thanks in advance
2023-04-25T19:04:21Z
you can add these two lines to click after submit or click# clear message after click or submit
  message.submit(lambda x: gr.update(value=""), None, [message], queue=False)
  send.click(lambda x: gr.update(value=""), None, [message], queue=False)
2023-04-25T19:18:06Z
radames:message.submit(lambda x: gr.update(value=""), None, [message], queue=False)
  send.click(lambda x: gr.update(value=""), None, [message], queue=False)@radamesI just did and I got this errorUserWarning: Expected at least 1 arguments for function <function  at 0x0000016A157749D0>, received 0Note: It cleared the Textbox (thank you for that) when I send it works but I get this error on my ideUserWarning: Unexpected argument. Filling with None.warnings.warn(“Unexpected argument. Filling with None.”)please help
2023-04-25T19:50:05Z
sorry, I can’t help you without more context, check yourconversation_historyfunction
2023-04-25T21:23:43Z
sorry I’m not sure if I can help, this code snippet below works for me, but I don’t have yourcallmocbt, running latest Gradioimport gradio as gr

def conversation_history(input, history):
  history = history or [] 
  s = list(sum(history, ()))
  s.append(input)
  inp = ''.join(s)
  output = inp
  history.append((input, output))
  return history, history

with gr.Blocks() as interface:
  logos = gr.Image(interactive=False, show_label=False, elem_id="logo")
  logos.style(height=100)
  chatbot = gr.Chatbot(label="Conversation")
  chatbot.style(height=325)
  message = gr.Textbox(placeholder="Send a message", label="Chat", lines=1)
  message.style(container=True)
  state = gr.State()
  send = gr.Button("Send")
  message.submit(conversation_history, [message, state], [chatbot, state], queue=False)
  message.submit(lambda x: gr.update(value=""), None, [message], queue=False)
  send.click(conversation_history, inputs=[message, state], outputs=[chatbot, state])
  send.click(lambda x: gr.update(value=""), None, [message], queue=False)
  send.style(size="lg")

interface.launch()
2023-04-25T22:52:18Z
@radamesfixed it, I changed None to [state], thanks
2023-05-06T07:29:36Z
Hi please I have the same problem using the blocks in Gradiodef chatgpt_clone(input, history):history = history ors = list(sum(history, ()))s.append(input)inp = ’ '.join(s)output = openai_create(inp)history.append((input, output))return history, historyblock = gr.Blocks()with block:gr.Markdown(“”“Build Yo’own ChatGPT with OpenAI API & Gradio“””)chatbot = gr.Chatbot()
message = gr.Textbox(placeholder=prompt)
state = gr.State()
submit = gr.Button("SEND")
submit.click(chatgpt_clone, inputs=[message, state], outputs=[chatbot, state])And how i close the app from gradio? I use the terminal
2023-07-05T08:50:11Z
Hello, I am not able to assign enter key to submit button in my gradio UI.could you please help me to do so ?