Laravel 5.6 error "function name must be a string" with builtin Auth - laravel-blade

Im trying to modified the builtin laravel Auth to take in more attribute, but have encountered the error "function name must be a string". I didnt know what i did wrong.
Here's my create method:
protected function create(array $data)
{
$imgPath = Storage::putFile('public/photos/users', $data('image'));
$imgPath = 'photos/users/' . basename($imgPath);
return User::create([
'imgPath' => $imgPath,
'firstName' => $data['firstName'],
'lastName' => $data['lastName'],
'about' => $data['about'],
'email' => $data['email'],
'username' => $data['username'],
'password' => Hash::make($data['password']),
'role' => $data['role'],
'province_id' => $data['province_id'],
]);
}
the error show the that the part where i try to store image to $imgPath is where exception occured but i dont know whats wrong there. I used the same code for many time, worked fine. Here's my register view:
#extends('layouts.app')
#section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Register') }}</div>
<div class="card-body">
<form method="POST" action="{{ route('register') }}">
#csrf
<div class="input-group mb-3">
<div class="custom-file">
<label class="custom-file-label" for="image">Upload a picture of yourself</label>
<input type="file" class="custom-file-input" id="image" name="image" required>
</div>
</div>
<div class="form-group row">
<label for="firstName" class="col-md-4 col-form-label text-md-right">{{ __('First Name') }}</label>
<div class="col-md-6">
<input id="firstName" type="text" class="form-control{{ $errors->has('firstName') ? ' is-invalid' : '' }}" name="firstName" value="{{ old('firstName') }}" required autofocus>
#if ($errors->has('firstName'))
<span class="invalid-feedback">
<strong>{{ $errors->first('firstName') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="lastName" class="col-md-4 col-form-label text-md-right">{{ __('Last Name') }}</label>
<div class="col-md-6">
<input id="lastName" type="text" class="form-control{{ $errors->has('lastName') ? ' is-invalid' : '' }}" name="lastName" value="{{ old('lastName') }}" required autofocus>
#if ($errors->has('lastName'))
<span class="invalid-feedback">
<strong>{{ $errors->first('lastName') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="about" class="col-md-4 col-form-label text-md-right">{{ __('About You') }}</label>
<div class="col-md-6">
<textarea placeholder="Tell us something about yourself"
id="about"
name="about"
required autofocus
rows="5" spellcheck="true"
class="form-control{{ $errors->has('about') ? ' is-invalid' : '' }} autosize-target text-left ">{{ old('about') }}</textarea>
#if ($errors->has('about'))
<span class="invalid-feedback">
<strong>{{ $errors->first('about') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="email" class="col-md-4 col-form-label text-md-right">{{ __('E-Mail Address') }}</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control{{ $errors->has('email') ? ' is-invalid' : '' }}" name="email" value="{{ old('email') }}" required>
#if ($errors->has('email'))
<span class="invalid-feedback">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="username" class="col-md-4 col-form-label text-md-right">{{ __('Username') }}</label>
<div class="col-md-6">
<input id="username" class="form-control{{ $errors->has('username') ? ' is-invalid' : '' }}" name="username" value="{{ old('username') }}" required>
#if ($errors->has('username'))
<span class="invalid-feedback">
<strong>{{ $errors->first('username') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="password" class="col-md-4 col-form-label text-md-right">{{ __('Password') }}</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control{{ $errors->has('password') ? ' is-invalid' : '' }}" name="password" required>
#if ($errors->has('password'))
<span class="invalid-feedback">
<strong>{{ $errors->first('password') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group row">
<label for="password-confirm" class="col-md-4 col-form-label text-md-right">{{ __('Confirm Password') }}</label>
<div class="col-md-6">
<input id="password-confirm" type="password" class="form-control" name="password_confirmation" required>
</div>
</div>
<div class="form-group row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Register') }}
</button>
</div>
</div>
<input type="hidden" name="role" value="guide" />
<input type="hidden" name="province_id" value="1" />
</form>
</div>
</div>
</div>
</div>
</div>
#endsection

You can change
$data('image')
to
$data['image']
Because $data is an array, not a function.

Related

How to Align and Style my View Page in Angular

I am working on a project using Angular-7. I tried to render a modal form with the code shown below:
user.component.html
<div id="addModal" class="modal" style="background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4);">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Add New {{ User }}</h5>
<button type="button" class="close" (click)='closeAddModal()'>
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="alert alert-danger" [hidden]="!error.role">
{{ error.role }}
</div>
<div class="alert alert-danger" [hidden]="!error.email">
{{ error.email }}
</div>
<div class="alert alert-danger" [hidden]="!error.first_name">
{{ error.first_name }}
</div>
<div class="alert alert-danger" [hidden]="!error.last_name">
{{ error.last_name }}
</div>
<div class="alert alert-danger" [hidden]="!error.client_id">
{{ error.client_id }}
</div>
<div class="alert alert-danger" [hidden]="!error.password">
{{ error.password }}
</div>
<form #editUserForm=ngForm>
<div class="form-group">
<label for="name">First Name</label>
<input type="name" name="first_name" id="inputName" class="form-control" placeholder="First Name" [(ngModel)]="form.first_name" required>
</div>
<div class="form-group">
<label for="name">Last Name</label>
<input type="name" name="last_name" id="inputName" class="form-control" placeholder="Last Name" [(ngModel)]="form.last_name" required>
</div>
<div class="form-group">
<label for="name">Email</label>
<input type="email" name="email" id="inputEmail" class="form-control" placeholder="example#email.com" required [(ngModel)]="form.email">
</div>
<div class="form-group">
<label for="name">Client</label>
<select class="form-control pt-1" name="client_id" [(ngModel)]="form.client_id">
<option value="null">Select Client</option>
<option *ngFor="let c of clients" value="{{c?.client_id}}">{{c.client_name}}</option>
</select>
</div>
<div class="form-group">
<label for="name">Role</label>
<div *ngFor="let role of roles">
<input type="checkbox" name="{{ role.name }}" value="{{ role.name }}" (change)="checkboxAdd($event)"> {{ role.name }}
</div>
</div>
<div class="form-group">
<label for="name">Password</label>
<input type="password" name="password" id="inputPassword" [(ngModel)]="form.password" class="form-control" placeholder="Password" required>
</div>
<div class="form-group">
<label for="name">Password Confirmation</label>
<input type="password" name="password_confirmation" id="inputPasswordConfirm" [(ngModel)]="form.password_confirmation" class="form-control" placeholder="Re enter Password" required>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" (click)='addModalSubmit()' [disabled]="!editUserForm.valid">Save changes</button>
<button type="button" class="btn btn-secondary" (click)='closeAddModal()'>Close</button>
</div>
</div>
</div>
</div>
In the form, I have checkboxes for user roles. I observed that the form got truncated and some of the checkboxes not being displayed. Also, the submit button is not showing. Even the vertical scrollbar on the page could not resolve the problem.
How do I resolve this and make everything visible?
How do I make the checkboxes to be divided into three (3) columns using:
<div class="col-xs-4">
How do I resolve this and make everything visible?
Using overflow, solve this problem easily. For example;
<div class="content">
this is content * 70
</div>
<style>
.content {
overflow-y: scroll; /* for vertical scroll */
}
</style>
How do I make the checkboxes to be divided into three (3) columns using:
Use flex. Everyting is easy :)
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
<div class="area">
<div *ngFor="let role of roles" class="item">
<input type="checkbox" name="{{ role.name }}" value="{{ role.name }}" (change)="checkboxAdd($event)"> {{ role.name }}
</div>
</div>
<style>
.area {
display: flex;
flex-direction: row;
width: 100%;
}
.area .item {
width: 33.3%;
}
</style>
You could use bootstrap class checkbox-inline to have all the options in one line.
Please Look at this

Repositioning form after image removed from display

In the following code, I have an image that I do not want shown on small screens (at the bottom). When the viewport is shrunk, the input fields are a left justified. I'd like them to be in the center of the viewport when the screen is XS. I've tried changing the Bootstrap 4 flex settings, but have yet to find a solution. Is there a way to do this in Bootstrap or SASS?
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> {% block body %}
<div class="container d-flex">
<div class="row justify-content-center">
<div class="col-md-8 col-sm-8 col-xs-12">
<form action="{{ url_for('register') }}" method="post" class="my-5" id="registrationForm">
<div class="form-group">
<label class="firstName" for="firstName">First Name</label>
<input type="text" class="form-control" id="firstName" name="firstname" placeholder="First Name">
</div>
<div class="form-group">
<label class="lastName" for="lastName">Last Name</label>
<input type="text" class="form-control" id="lastName" name="lastname" placeholder="Last Name">
</div>
<div class="form-group">
<label class="eMail" for="eMail">Email Address</label>
<input type="email" class="form-control" id="eMail" name="email" placeholder="Email">
</div>
<div class="form-group">
<label class="userName" for="userName">Preferred User Name</label>
<input type="text" class="form-control" id="userName" name="username" placeholder="User Name">
</div>
<div class="form-group">
<label class="passWord" for="passWord">Password</label>
<input type="password" class="form-control" id="passWord" name="password" placeholder="Password">
</div>
<div class="form-group">
<label class="passWord_2" for="password_2">Confirm Password</label>
<input type="password" class="form-control" id="password_2" name="password2" placeholder="Confirm Password">
</div>
<div class="form-group text-center">
<button type="submit" class="btn btn-primary custom-btn">Register!</button>
</div>
</form>
</div>
<div class="col-md-4 col-sm-4 flex-column my-5 py-3 align-self-center">
<img class="img-fluid img-thumbnail d-none d-sm-block" src="/static/savoy.jpeg" alt="aubrey beardsley drawing" />
</div>
</div>
</div>
<!-- End form container -->
{% endblock %}
You can use media queries to provide additional styles at specific breakpoints.
#media (max-width: 575px) {
.row.center-on-xs{ margin: 0 auto; }
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> {% block body %}
<div class="container d-flex">
<div class="row center-on-xs justify-content-center">
<div class="col-md-8 col-sm-8 col-xs-12">
<form action="{{ url_for('register') }}" method="post" class="my-5" id="registrationForm">
<div class="form-group">
<label class="firstName" for="firstName">First Name</label>
<input type="text" class="form-control" id="firstName" name="firstname" placeholder="First Name">
</div>
<div class="form-group">
<label class="lastName" for="lastName">Last Name</label>
<input type="text" class="form-control" id="lastName" name="lastname" placeholder="Last Name">
</div>
<div class="form-group">
<label class="eMail" for="eMail">Email Address</label>
<input type="email" class="form-control" id="eMail" name="email" placeholder="Email">
</div>
<div class="form-group">
<label class="userName" for="userName">Preferred User Name</label>
<input type="text" class="form-control" id="userName" name="username" placeholder="User Name">
</div>
<div class="form-group">
<label class="passWord" for="passWord">Password</label>
<input type="password" class="form-control" id="passWord" name="password" placeholder="Password">
</div>
<div class="form-group">
<label class="passWord_2" for="password_2">Confirm Password</label>
<input type="password" class="form-control" id="password_2" name="password2" placeholder="Confirm Password">
</div>
<div class="form-group text-center">
<button type="submit" class="btn btn-primary custom-btn">Register!</button>
</div>
</form>
</div>
<div class="col-md-4 col-sm-4 flex-column my-5 py-3 align-self-center">
<img class="img-fluid img-thumbnail d-none d-sm-block" src="/static/savoy.jpeg" alt="aubrey beardsley drawing" />
</div>
</div>
</div>
<!-- End form container -->
{% endblock %}

Bootstrap 4 d-print classes for form

I've created a form that I give the user the option to submit online or print and mail. I use a simple javascript print command and turn off all other elements for printing besides the form using the .d-print-none class. It's probably really simple problem, but when I print it it doesn't output the entire form. It fills one page and then a second blank page. Wondering if it would help to add one of the other d-print classes to the form element or maybe there's a way to the height of the form to fit one page. Is this a bug or am I missing something?
There's not much special about the code, but I've displayed the form below.
<div class="col-lg-7 col-sm-12 d-print-inline-flex h-100 w-100" id="donationForm">
<div class="card">
<div class="card-header"><h4 class="text-center">Donation Request Form</h4>
</div>
<div class="card-body">
<form name="donationRequest" id="donationRequest" novalidate>
<h5>Event Information</h5>
<div class="form-group">
<label for="orgName">Name of Organization: </label>
<input type="text" class="form-control" id="orgName" required placeholder="Name of Organization">
</div>
<div class="form-group">
<label for="taxID">501(c)(3) Tax ID Number: </label>
<input type="number" class="form-control" id="taxID" required placeholder="Tax ID Number">
</div>
<div class="form-group">
<label for="eventName">Event Name: </label>
<input type="text" class="form-control" id="eventName" required placeholder="Event Name">
</div>
<div class="form-group">
<label for="eventDate">Date of Event: </label>
<input type="date" class="form-control" id="eventDate" required placeholder="Event Date">
</div>
<div class="form-group">
<label for="eventLoc">Event Location: </label>
<input type="text" class="form-control" id="eventLoc" required placeholder="Event Location">
</div>
<hr>
<h5>Contact Information</h5>
<div class="form-group">
<label for="contact">Contact Name: </label>
<input type="text" class="form-control" id="contact" required placeholder="First & Last Name of Contact Person">
</div>
<div class="form-group">
<label for="address">Address: </label>
<input type="text" class="form-control" id="address" required placeholder="Address of Organization">
</div>
<div class="form-group">
<label for="city">City: </label>
<input type="text" class="form-control" id="City" required placeholder="City of Organization">
</div>
<div class="form-group">
<label for="state">State: </label>
<input type="text" class="form-control" id="State" required placeholder="State of Organization">
</div>
<div class="form-group">
<label for="zipcode">Zip Code: </label>
<input type="number" class="form-control" id="zipcode" required placeholder="Zip Code of Organization">
</div>
<div class="form-group">
<label for="phone">Phone: </label>
<input type="number" class="form-control" id="phone" required placeholder="123-456-7890">
</div>
<div class="form-group">
<label for="email">Email: </label>
<input type="email" class="form-control" id="email" required placeholder="email#provider.com">
</div>
<hr>
<h5>Type of Donation Request:</h5>
<div class="form-group">
<label class="form-check-inline"><input type="checkbox" value=""> Financial Contribution</label>
<label class="form-check-inline"><input type="checkbox" value=""> Auction/Drawing Item</label>
<label class="form-check-inline"><input type="checkbox" value=""> Other</label>
</div>
<div class="form-group">
<label for="description">Please briefly note how this event will benefit our community:</label>
<textarea class="form-control" rows="7" id="comment"></textarea>
</div>
<hr>
<div class="form-group">
<div class="row">
<div class="col-md-6"><button type="submit" class="btn btn-primary btn-block"><em class="fa fa-send"></em> Submit Request</button></div>
<div class="col-md-6"><button class="btn btn-primary btn-block"><em class="fa fa-print"></em> Print Form</button></div>
</div>
</div>
</form>
</div>
</div>
</div>
I was dealing with this issue a week ago, and I solve it using this:
<div id="printbody" class="d-none d-print-block"> /*load elements to print via js*/ </div>
<div class="d-block d-print-none"> /*all my html body with funtionalities*/ </div>
I use the event onbeforeprint to load the print element to Mozilla, Chrome, Safari, EI, Edge. Using something like this:
window.onbeforeprint = function () {
$("#printbody").html("")
$("#printbody").append($("#list1").html())
$("#printbody").append($("#msg1").html())
$("#printbody").append($("#things").html())
$("#printbody").append($("#foo").html())
$("#printbody").append($("#faa").html())
if (/MSIE 10/i.test(navigator.userAgent) || /MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent)) {
$("#printbody").append($("#flag").html())
$("#printbody").append('<div class="row w-100 overflow-hidden">'+$("#boo").html()+'</div>')
$("#printbody").append('<div class="col-12 col-sm-10 offset-sm-1 col-xl-4 offset-xl-4 pt-3 px-0">' + $("#vudlist").html() + '</div>')
$("#printbody").append('<div class="col-12 text-center mb-3" >'+$("#tmvus").html()+ '</div>')
$("#printbody").append($("#tmksla").html())
} else {
$("#printbody").append($("#foos").html())
}
$("#printbody").append('<div>' + $("#objs").html() + '</div>')
$("#printbody").append($("#lmsg").html())
}
Actually iOS doesn't trigger the event onbeforeprint so I did the same handle but using the event onclick="fillPrint()". Seen like this:
function fillPrint() {
$("#printbody").html("")
$("#printbody").append($("#list1").html())
$("#printbody").append($("#msg1").html())
$("#printbody").append($("#things").html())
$("#printbody").append($("#foo").html())
$("#printbody").append($("#faa").html())
if (/MSIE 10/i.test(navigator.userAgent) || /MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent)) {
$("#printbody").append($("#flag").html())
$("#printbody").append('<div class="row w-100 overflow-hidden">'+$("#boo").html()+'</div>')
$("#printbody").append('<div class="col-12 col-sm-10 offset-sm-1 col-xl-4 offset-xl-4 pt-3 px-0">' + $("#vudlist").html() + '</div>')
$("#printbody").append('<div class="col-12 text-center mb-3" >'+$("#tmvus").html()+ '</div>')
$("#printbody").append($("#tmksla").html())
} else {
$("#printbody").append($("#foos").html())
}
$("#printbody").append('<div>' + $("#objs").html() + '</div>')
$("#printbody").append($("#lmsg").html())
}
The issue generate when you try to print a large element with multiple sections (div) because of that I decided to bring it a higher level of element on the DOM.
I hope this can help someone.

This connection is not secure Mozilla

I have deployed an application build in laravel 5.3. On my login forms I see this warning : This connection is not secure. Logins entered here could be compromised.
This is my form :
<form class="form-horizontal" role="form" method="POST" action="{{ url('/login') }}">
{{ csrf_field() }}
<div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
<label for="email" class="col-md-3 control-label"></label>
<div class="col-md-6">
<input id="email" type="email" class="form-control" placeholder="Email" name="email" value="{{ old('email') }}" required autofocus>
#if ($errors->has('email'))
<span class="help-block">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
<label for="password" class="col-md-3 control-label"></label>
<div class="col-md-6">
<input id="password" type="password" placeholder="Password" class="form-control" name="password" required>
#if ($errors->has('password'))
<span class="help-block">
<strong>{{ $errors->first('password') }}</strong>
</span>
#endif
</div>
</div>
<div class="form-group">
<div class="col-md-6 col-md-offset-3">
<div class="checkbox">
<label>
<input type="checkbox" name="remember"> Remember Me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-8 col-md-offset-3">
<button type="submit" class="btn btn-primary">
Login
</button>
<a class="btn btn-link" href="{{ url('/password/reset') }}">
Forgot Your Password?
</a>
</div>
</div>
</form>
What I'm I missing or how can I fix this warning?
This is a Firefox feature to warn visitors of websites that information they submit is not transferred securely.
The browser shows this warning for pages containing an <input type="password" /> which are delivered through HTTP instead of HTTPS.
To mitigate this, obtain a certificate for your site and install it, so your users are protected against eavesdropping.

can't do normal formating using bootstrap

I am a newbie in laravel and bootstrap. I spent already 2 hours trying to make normal formatting, but the result is
enter image description here
What i'm doing wrong?
<div class="row">
<form method="POST" class="form-inline" action="{{action('OrderController#setDiscont')}}">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<div class="input-group {{ $errors->has('discont') ? ' has-error' : '' }}">
<span class="col-md-7">
<input type="text" placeholder="Скидка" name="discont" class="form-control" value="{{$discont or ""}}">
</span>
<span class="input-group-btn col-md-5">
<input type="submit" value="Установить" class="btn-block btn btn-default" >
</span>
<div class="help-block">
#if ($errors->has('discont'))
<strong>{{ $errors->first('discont') }}</strong> #endif
</div>
</div>
</form>
</div>
<div class="row">
<form method="POST" class="form-inline" action="{{action('OrderController#setClient')}}">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<div class="input-group {{ $errors->has('phone') ? ' has-error' : '' }}">
<span class="col-md-7">
<input type="text" placeholder="телефон" id="phone" name="phone" class="form-control" value="{{ old('phone') }}">
</span>
<span class="input-group-btn col-md-5">
<input type="submit" value="Найти" class="btn btn-primary" >
</span>
<div class="help-block">
#if ($errors->has('phone'))
<strong>{{ $errors->first('phone') }}</strong> #endif
</div>
</div>
</form>
</div>
This should work for you. Read the documentation for input groups. I'm assuming this is what you wanted from your css classes, but you can also check out the documentation for inline forms if that's what you wanted.
<div class="row">
<form method="POST" class="form-inline" action="POST">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<div class="form-group {{ $errors->has('discont') ? ' has-error' : '' }}">
<div class="input-group">
<input type="text" placeholder="Скидка" name="discont" class="form-control" value="{{$discont or ""}}">
<div class="input-group-addon" style="padding:0;">
<input type="submit" value="Установить" class="btn-block btn btn-default" style="border: 0px;border-radius: 0px; background-color: #ddd;">
</div>
</div>
<div class="help-block">
#if ($errors->has('discont'))
<strong>{{ $errors->first('discont') }}</strong>
#endif
</div>
</div>
</form>
</div>
<div class="row">
<form method="POST" class="form-inline" action="POST">
<input type="hidden" name="_token" value="{{csrf_token()}}">
<div class="form-group {{ $errors->has('phone') ? ' has-error' : '' }}">
<div class="input-group">
<input type="text" placeholder="телефон" id="phone" name="phone" class="form-control" value="{{ old('phone') }}">
<div class="input-group-addon" style="padding:0;">
<input type="submit" value="Установить" class="btn-block btn btn-default" style="border: 0px;border-radius: 0px; background-color: #ddd;">
</div>
</div>
<div class="help-block">
#if ($errors->has('phone'))
<strong>{{ $errors->first('phone') }}</strong>
#endif
</div>
</div>
</form>
</div>

Resources