Delete button is not working in table - laravel-5.3

This is how my code looks like
'<td class="text-center ">
<form action="/patients/{{$patient->id}}" method="post"
class="delete_link">
{{ csrf_field() }}
{{ method_field(\'DELETE\') }}
<button type="submit" class="btn btn-danger btn-sm pullright">Delete</button>
</form>
</td>'
Remember my table is under single quotations. Someone help me to get this thing working, Please.!!

'<td class="text-center ">
<form action="/patients/{{$patient->id}}" method="post" class="delete_link">
{{ csrf_field() }}
<input type="hidden" name="_method" value="DELETE">
<button type="submit" class="btn btn-danger btn-sm pullright">Delete</button>
</form>
</td>'

Related

problem when css/bootstrap/js to my twig template

the login works perfectly fine with the simple form
but when I try to add bootstrap/css/js to it , its doesn't work anymore the
{% if error %}
<span class="error">{{ error.messageKey }} </span>
{% endif %}
shows ( Invalid credentials. ) error!
I just cant find where is the error
Here is the code of the simple form :
<form action=" {{ path ('login') }} " method="POST">
<input type="text" name="_username" value"{{ last_username }}" placeholder="username here.">
<input type="password" name="_password" >
<button type="submit"> login </button>
</form>
here is the code of the form (with css/bootstrap/js)
<form action=" {{ path ('login') }} " method="POST" class="login100-form validate-form">
<div class="login100-form-avatar">
<img src="{{ asset('/logo.jpg') }}" alt="AVATAR">
</div>
<span class="login100-form-title p-t-20 p-b-45">
Bazar-Chic Login page
</span>
<div class="wrap-input100 validate-input m-b-10" data-validate = "Username is required">
<input class="input100" value="{{ last_username }}" type="text" name="_username" placeholder="Username">
<span class="focus-input100"></span>
<span class="symbol-input100">
<i class="fa fa-user"></i>
</span>
</div>
<div class="wrap-input100 validate-input m-b-10" data-validate = "Password is required">
<input class="input100" type="password" name="pass" placeholder="Password">
<span class="focus-input100"></span>
<span class="symbol-input100">
<i class="fa fa-lock"></i>
</span>
</div>
<div class="container-login100-form-btn p-t-10">
<button class="login100-form-btn">
Login
</button>
</div>
<div class="text-center w-full p-t-25 p-b-230">
<a href="#" class="txt1">
Forgot Username / Password?
</a>
</div>
<div class="text-center w-full">
<a class="txt1" href="http://127.0.0.1:8000/register">
Create an account
<i class="fa fa-long-arrow-right"></i>
</a>
</div>
</form>
As Barbie said the problem was with the name of the input.
(name="pass" => name="_password")
The problem is solved and the topic can be locked!
Thank you ;)
Maybe you should change:
name="pass" to name="_password"

FOSUserBundle Custom forms using Bootstrap

I'm using FOSUserBundle in my Symfony application. Everything work but i would like to know how to custom the render of the forms delivered by the bundle.
I have already succesfully custom the login form but i didn't find the way to custom for example the changePassword.html.twig.
I'have checked in ChangePasswordFormType.php to see if I can get the differents fields of the form but I must have missed something.
For example in my FOSUserBundle login.html.twig:
<form class="form-group-lg" action="{{ path("fos_user_security_check") }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
<fieldset>
{% if error %}
<div class="row">
<div class="alert alert-danger" role="alert">{{ error|trans({}, 'FOSUserBundle') }}</div>
</div>
{% endif %}
<div class="row">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
<input class="form-control" for="username" placeholder="{{ 'security.login.username'|trans({}, 'FOSUserBundle') }}" type="text" id="username" name="_username" value="{{ last_username }}" required="required" />
</div>
</div>
<div class="row">
</div>
<br>
<div class="row">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
<input class="form-control" for="password" placeholder="{{ 'security.login.password'|trans({}, 'FOSUserBundle') }}" type="password" id="password" name="_password" required="required" />
</div>
<p class="text-right"> <a href={{ path('fos_user_resetting_request') }}> Mot de passe oublié ?</a></p>
</div>
<div class="checkbox">
<label>
<input type="checkbox" for="remember_me"/>{{ 'security.login.remember_me'|trans({}, 'FOSUserBundle') }}
</label>
</div>
<input class="btn btn-lg btn-primary btn-block" type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans({}, 'FOSUserBundle') }}" />
</fieldset>
</form>
I'm looking for using the same syntax as {{ 'security.login.username'|trans({}, 'FOSUserBundle') }} for the others template provided by FOSUserBundleto get boostrap theme on it.
If someone have already done that i would like to know how you've done this.
Thanks.
FOSUserBundle templates are located at : vendor/friendsofsymfony/user-bundle/Resources/views/
To override these templates, create the folder app/Resources/FOSUserBundle/views then, you create a template with the same name as the FOSUserBundle template you want to override.
For example to override the change passord template :
vendor/friendsofsymfony/user-bundle/Resources/views/ChangePassword/change_password.html.twig
You must create app/Resources/FOSUserBundle/views/ChangePassword/change_passord.html.twig

Displaying buttons in line with bootstrap

So I have 2 buttons but one of them is in a form and is displayed on a new line. Can I align the two buttons in a line without moving the reply button inside the form?
<button class="btn btn-primary btn-xs" data-toggle="collapse"><span class="glyphicon glyphicon-message-forward"></span> Reply</button>
<form action="" method="post">
<input type="hidden" name="comment_id" value="">
<button name="delete" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-remove"></span> Delete</button>
</form>
you can add pull-left to the top button to float that button and the inline content in the form will wrap beside it.
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<button class="pull-left btn btn-primary btn-xs" data-toggle="collapse"><span class="glyphicon glyphicon-message-forward"></span> Reply</button>
<form action="" method="post">
<input type="hidden" name="comment_id" value="">
<button name="delete" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-remove"></span> Delete</button>
</form>
Use display:inline in reply button and display: inline-block; in form.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
<button class="btn btn-primary btn-xs" data-toggle="collapse" style="display: inline;">
<span class="glyphicon glyphicon-message-forward"></span> Reply</button>
<form action="" method="post" style="display: inline-block;">
<input type="hidden" name="comment_id" value="">
<button name="delete" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-remove"></span> Delete</button>
</form>

Prevent modal duplication for edit in Laravel

I'm trying to to editing using bootstrap modals. My problems is that my current way is including the modals in the foreach loop.
#foreach($users as $user)
<tr>
<td align="center"><input type="checkbox" class="i-checks" name="input[]" value="{{ $user->name }}"></td>
<td>{{ $user->name }}</td>
<td>{{ $user->email }}</td>
<td>
{{ $user->role->name }}
</td>
<td>
#if($user->team_id)
{{ $user->team->name }}
#else
{{ 'N/A' }}
#endif
</td>
<td>
#if($user->is_active == 0)
{{ 'Blocked' }}
#elseif($user->is_active == 1)
{{ 'Active' }}
#endif
</td>
<td>
<a data-toggle="modal" href="#modal-edit-{{ $user->id }}"><i class="fa fa-pencil"></i> Edit</a>
</td>
#include('partials.modals.editUser')
</tr>
#endforeach
And my modal looks like this
<div id="modal-edit-{{$user->id}}" class="modal fade" aria-hidden="true" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<div class="row">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="col-sm "><h3 class="text-center m-t-none m-b">Edit User</h3>
<form method="POST" action="{{ route('users.update', $user->id )}}">
{{ method_field('PATCH') }}
{{ csrf_field() }}
<div class="form-group"><label>Name</label> <input type="text" placeholder="Enter name" class="form-control" name="name" value="{{ $user->name }}"></div>
<div class="form-group"><label>Email</label> <input type="email" placeholder="Enter email" class="form-control" name="email" value="{{ $user->email }}"></div>
<div class="form-group"><label>Password</label> <input type="password" placeholder="Password" class="form-control" name="password" value="{{ $user->password }}"></div>
<div class="form-group">
<label for="role">Activation</label>
{{ Form::select('activation',
['1' =>'Active',
'0' => 'Blocked',
], $user->is_active, array('class' => 'chosen-select', 'data-placeholder' => 'Choose Activation', 'tab-index' => '4')) }}
</div>
<div class="form-group">
<label for="role">Select Role</label>
{{ Form::select('role',
[1 =>'Admin',
2 => 'Team Leader',
3 => 'Team Member',
], $user->role_id, array('class' => 'chosen-select', 'data-placeholder' => 'Choose a role', 'tab-index' => '4')) }}
</div>
<div class="form-group"><label>Team</label> <input type="text" placeholder="Enter Team" class="form-control" name="team_id" value="{{ $user->team_id }}"> </div>
<input type="submit" class="btn btn-primary btn-rounded btn-block" onclick="pressOnlyOnce()" value="Save Changes">
</div>
</form>
</div>
</div>
</div>
</div>
How can I edit my data using only one modal so that I can place it outside the foreach loop?
You could move the include outside the #foreach loop and add your variables to the button that triggers the modal to use them with javascript.
The button should look like this:
<a data-toggle="modal" href="#modal-edit-{{ $user->id }}" data-user-id="{{ $user->id }}" data-user-active="{{ $user->active }}"><i class="fa fa-pencil"></i> Edit</a>

Booststrap form doesn't work

Please I'm trying to use bootstrap to change my website look however when I try to change the form of my login page it seems to load when i click on submit, but does nothing. Any help !!
Old code :
<form method="post" name="login" action="">
<table align="center">
<tr><td>
<table align="center">
<tr>
<td align="right"><font face="Arial,Helvetica" size="-1"><strong>Username:</strong></font></td>
<td align="left"><input type="text" name="username"></td>
</tr>
<tr>
<td align="right" width="30%"><font face="Arial,Helvetica" size="-1"><strong>Password:</strong></font></td>
<td align="left"><input type="password" name="password"></td>
</tr>
</table>
</td></tr>
<tr><td>
<center><input type="submit" name="Submit" value="Login"></center>
</td></tr>
</table>
</form>
New code :
<div class="container">
<form class="form-signin" role="form" method="post" name="login" action="">
<h2 class="form-signin-heading">Please sign in</h2>
<input type="text" class="form-control" placeholder="Username" required autofocus>
<input type="password" class="form-control" placeholder="Password" required>
<div class="checkbox">
<label>
<input type="checkbox" value="remember-me"> Remember me
</label>
</div>
<!--center><input class="btn btn-lg btn-primary btn-block" type="submit" name="Submit" value="Login"></center-->
<button class="btn btn-lg btn-primary btn-block" type="submit" name="Submit" value="Login">Sign in</button>
</form>
</div> <!-- /container -->
Seems like you forgot the attribute name in the input, try this:
<div class="container">
<form class="form-signin" role="form" method="post" name="login" action="">
<h2 class="form-signin-heading">Please sign in</h2>
<input name="username" type="text" class="form-control" placeholder="Username" required autofocus>
<input name="password" type="password" class="form-control" placeholder="Password" required>
<div class="checkbox">
<label>
<input type="checkbox" value="remember-me"> Remember me
</label>
</div>
<!--center><input class="btn btn-lg btn-primary btn-block" type="submit" name="Submit" value="Login"></center-->
<button class="btn btn-lg btn-primary btn-block" type="submit" name="Submit" value="Login">Sign in</button>
</form>
</div> <!-- /container -->
<form method="post" name="login" action="">
Did you intentionally leave action blank? Without an action for it to post to, of course it's going to do nothing.

Resources