skip to Main Content

I am trying to add a feature to my web which is using an icon, so I have put some icons from font awesome inside a button

<button id="iconDiv1" class="iconBtn" type="button" value="fa-solid fa-heart fa-xl" >
<i class="fa-solid fa-heart fa-2xl" class="icons"></i>
</button>
        <button id="iconDiv2" class="iconBtn" type="button" value="fa-solid fa-gamepad fa-xl">
<i class="fa-solid fa-gamepad fa-2xl" class="icons">
</i></button>
        <button id="iconDiv3" class="iconBtn" type="button" value="fa-solid fa-chess-knight fa-xl">
<i class="fa-solid fa-chess-knight fa-2xl" class="icons"></i>
</button>
        <button id="iconDiv4" class="iconBtn" type="button" value="fa-solid fa-hand-fist fa-xl">
<i class="fa-solid fa-hand-fist fa-2xl" class="icons"></i>
</button>
        <button id="iconDiv5" class="iconBtn" type="button" value="fa-solid fa-mug-hot fa-xl">
<i class="fa-solid fa-mug-hot fa-2xl" class="icons"></i>
</button>

and I’ve add a name attribute to the selected button/icon using javascripte, now I need to add the button value value="fa-solid fa-heart fa-xl (which is the same icon class inside of it) to a database using flask
but I don’t know how to get the button value attribute in just flask without using javascripte

I’ve searched a lot for the answer, but I didn’t find anything, and I’ve also tried to write
icon = request.form.get("selected").getattr("value) and it didn’t word so I tried to write
icon = request.form["selected].__getattribure__("value") in flask but it also didn’t word.

2

Answers


  1. Values of input fields and buttons within a form can be obtained using the name attribute. Other attributes cannot be accessed by the server.

    So you can use an attribute name for the buttons.

    <form method="POST">
        <button name="icon" type="submit" value="heart" >
            <i class="fa-solid fa-heart fa-2xl" class="icons"></i>
        </button>
        <button name="icon" type="submit" value="gamepad">
            <i class="fa-solid fa-gamepad fa-2xl" class="icons"></i>
        </button>
        <button name="icon" type="submit" value="chess-knight">
            <i class="fa-solid fa-chess-knight fa-2xl" class="icons"></i>
        </button>
        <button name="icon" type="submit" value="hand">
            <i class="fa-solid fa-hand-fist fa-2xl" class="icons"></i>
        </button>
        <button name="icon" type="submit" value="mug-hot">
            <i class="fa-solid fa-mug-hot fa-2xl" class="icons"></i>
        </button>
    </form>
    

    If the form is sent, the value of the attribute value must be requested based on the name attribute.

    @app.route('/example', methods=['GET', 'POST'])
    def example():
        if request.method == 'POST':
            value = request.form.get('icon')
            print(value)
        return render_template('example.html')
    
    Login or Signup to reply.
  2. In case your buttons are not in a form, you could also wrap them in anchor <a> elements and pass the value to your server-route.

    index.html
    
      <a href="{{ url_for('button', value='first') }}">
        <button>First Button</button>
      </a>
      <a href="{{ url_for('button', value='second') }}">
        <button>Second Button</button>
      </a>
      <a href="{{ url_for('button', value='third') }}">
        <button>Third Button</button>
      </a>
    
    app.py
    
    @app.route("/")
    def index():
        return render_template("index.html")
    
    
    @app.route("/button/<value>")
    def button(value):
        return f"The button you clicked has the following {value=}!"
    
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search