1

Here is my FastAPI backend:

main.py

from typing import Optional
from fastapi import FastAPI, Request, Form
from fastapi.templating import Jinja2Templates

app = FastAPI()
templates = Jinja2Templates(directory='./')

@app.get("/")
def index():
    return "Hello World"

@app.get("/item/{text}")
def get_item(text: str):
    return {"result": tuple(['Hi', 'hello'])}

@app.get("/form")
def form(request: Request):
    result = ""
    return templates.TemplateResponse('form.html', context={'request': request, 'result': result})

@app.post("/form")
def form(request: Request, text: str=Form(...)):
    
    result = ['Hello', 'Hi', 'Bye'] # to simplify the example
    return templates.TemplateResponse('form.html', context={'request': request, 'result': tuple(result)})

Here is the Jinja2 template:

form.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Small example</title>
  </head>
  <body>
    <form method="post">
      <label for="text">Input text:</label>
      <br>
      <textarea id="text" name="text" rows="12" cols="50"></textarea>
      <br/>
      <input type="submit" value="Submit">
    </form>
    <br></br>
    <form method="post">
      <label for="text">Result:</label>
      <br>
      <textarea id="result" name="result" rows="12" cols="50"> {{ result }} </textarea>
      <br/>
    </form>
  </body>
</html>

Here I get the result in the text area as: ('Hello', 'Hi', 'Bye').

What I need is to display it line by line in the result textarea:

Hello. 

Hi. 

Bye.
Chris
  • 18,724
  • 6
  • 46
  • 80
LearnToGrow
  • 1,656
  • 6
  • 30
  • 53

1 Answers1

1

Option 1

You could loop through the tuple, as shown below:

<textarea id="result" name="result" rows="12" cols="50"> 
    {% for i in result %}
        {{ i }}
    {% endfor %}
</textarea>

Option 2

You could also write the aobve in a single line, as the above doesn't seem to align the text to the left, unless you shift the whole Python code to the left side. Use the below along with &#13;&#10;, as described here, to add line breaks between the items.

<textarea id="result" name="result" rows="12" cols="50">{% for i in result %}{{ i }}&#13;&#10;{% endfor %}</textarea>
Chris
  • 18,724
  • 6
  • 46
  • 80