CODEWITHSUNDEEP
htmlcsslaravel-blade
Rayhan Adri
Rayhan Adri

Reputation: 39

How to change form input button to anchor a href?

I want to change my site design using html/css template. My site code is using form input as logout button (submit form post method) but the template I have using anchor as the button. How I can still use the template style but still working button?

I've tried changing <input> to <button> but still the style is different also putting 'method' and 'action' seems not valid for anchor.

below is my code

<form method="POST" enctype="multipart/form-data" action="{{ route('logout') }}">
<input type="submit" value="Logout">
</form>

and this is code from the template

<a href="#" class="dropdown-item has-icon text-danger">
<i class="fas fa-sign-out-alt"></i> Logout
</a>

I expect a href can also do action post method.

Upvotes: 0

Views: 1463

Answers (2)

Rayhan Adri
Rayhan Adri

Reputation: 39

I just found the answer while looking at Laravel default app.blade.php. To solve the problem I must modify my code and add some javascript to become like this

          <a class="dropdown-item has-icon text-danger" href="{{ route('logout') }}" onclick="event.preventDefault();
                                                 document.getElementById('logout-form').submit();">
            <i class="fas fa-sign-out-alt"></i> Logout
          </a>
          <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
            @csrf
          </form>

Upvotes: 1

Muminur Rahman
Muminur Rahman

Reputation: 634

You can try this:

<a href="#" class="dropdown-item has-icon text-danger">
<i class="fas fa-sign-out-alt"></i> <form method="POST" enctype="multipart/form-data" action="{{ route('logout') }}">
<input type="submit" value="Logout">
</form>
</a>

Upvotes: 0

Related Questions