I'm building a form using Laravel 5 and I want to error messages to appear next to the field of authentication page.
This is my controller
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/css/bootstrap.css" rel="stylesheet">
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/css/bootstrap-theme.css" rel="stylesheet">
<link href="/css/all.css" rel="stylesheet">
<link href="/css/all.min.css" rel="stylesheet">
<link href="/css/Style.css" rel="stylesheet">
<script src="/js/jquery-2.2.4.min.js"></script>
<script src="/js/bootstrap.js"></script>
<script src="/js/all.js"></script>
<script src="/js/all.min.js"></script>
<title>LOGIN</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet">
</head>
<body>
<form id="form1" action="/loginme" method="post">
<div >
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<div class="login_form">
<div class="inputWithIcon">
<i class="fas fa-user-tie" ></i>
<input type="text" placeholder="Username" class="form-control" name="username" />
</div>
<div class="inputWithIcon">
<i class="fas fa-unlock-alt" ></i>
<input type="password" placeholder="Password" class="form-control" name="password" />
</div>
<br />
<label class="invalid-feedback" id="login_error"></label>
<input type="submit" id="submitBtn" class="btn btn-secondary btn-block login-submit-btn" value="Login"></input>
</div>
</div>
</form>
</body>
</html>
And I would like to display the alert message with a click on the button "submitBtn"
this is my controller
You need to use validation in your controller.
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Validator;
use DB;
class LoginController extends Controller {
public function login(Request $request){
$this->validate($request, [
'username' => 'required',
'password' => 'required'
]);
$username = $request->input('username');
$password = $request->input('password');
$checklogin = DB::table('users')->where(['Username' => $username, 'Password' => $password])->get();
if(count($checklogin)){
echo "login successful";
}else{
return view('login');
}
}
}
Then in your blade you can use the retured error like this:
<input type="text" placeholder="Username" class="form-control" name="username" />
#if ($errors->has('username'))
<span class="error-text text-danger">{{ $errors->first('username') }}</span>
#endif
<input type="password" placeholder="Password" class="form-control" name="password" />
#if ($errors->has('password'))
<span class="error-text text-danger">{{ $errors->first('password') }}</span>
#endif
yo can write
<input type="text" placeholder="Username" class="form-control" name="username" />
#if ($errors->has('username')) <span class="error-text text-danger">{{ $errors->first('username') }}</span> #endif
<input type="password" placeholder="Password" class="form-control" name="password" />
#if ($errors->has('password')) <span class="error-text text-danger">{{ $errors->first('password') }}</span> #endif
Related
Hello I am creating a multi form page but when data is insetting in database it insert on 2 row with different ids I need each submit be as one id not 2 ids kindly check the code below note that I am new should I add the session or what is the best way to do it .thank you
Controller
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
class secmultiController extends Controller
{
public function NameMentionded(){
return view('multiform.name');
}
public function AddNameMentionded(Request $request){
$request->validate([
'empname'=> 'required ',
'empnum'=> 'required ',
]);
$query = DB::table('secmultis')->insert([
'empname'=>$request->input('empname'),
'empnum'=>$request->input('empnum'),
]);
return redirect('reports');
}
public function ReportPerson(){
return view('multiform.as');
}
public function adds(Request $request){
$request->validate([
'incnam'=> 'required ',
'incnum' => 'required ',
'inctdes' => 'required ',
'inctype' => 'required ',
'inncity' => 'required ',
'incday' => 'required ',
'incatt' => 'required ',
'incterm' => 'required ',
]);
$query = DB::table('secmultis')->insert([
'incnam'=>$request->input('incnam'),
'incnum'=>$request->input('incnum'),
'inctdes'=>$request->input('inctdes'),
'inctype'=>$request->input('inctype'),
'incterm'=>$request->input('incterm'),
'inncity'=>$request->input('inncity'),
'incday'=>$request->input('incday'),
'incatt'=>$request->input('incatt'),
]);
if($query){
return back()->with('success','Data have been successfully inserted');
}else{
return back()->with('fail','Data have not been successfully inserted');
}
}
}
Route
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\MultiformController;
use App\Http\Controllers\secmultiController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
Route::get('/', function () {
return view('test');
});
/// multipage form
Route::controller(secmultiController::class)->group(function(){
Route::get('/name','NameMentionded')->name('name.mentioned');
Route::post('/add','AddNameMentionded')->name('addname.mentioned');
Route::get('/reports','ReportPerson');
Route::POST('/adds','adds');
});
Route::get('/dashboard', function () {
return view('admin.index');
})->middleware(['auth','verified'])->name('dashboard');
require __DIR__.'/auth.php';
nano.blade
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Dashboard | Makassed Speak </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="Premium Multipurpose Admin & Dashboard Template" name="description" />
<meta content="Themesdesign" name="author" />
<!-- App favicon -->
<link rel="shortcut icon" href="{{ asset('backend/assets/images/favicon.ico') }}">
<!-- jquery.vectormap css -->
<link href="{{ asset('backend/assets/libs/admin-resources/jquery.vectormap/jquery-jvectormap-1.2.2.css') }}" rel="stylesheet" type="text/css" />
<!-- DataTables -->
<link href="{{ asset('backend/assets/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Responsive datatable examples -->
<link href="{{ asset('backend/assets/libs/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Bootstrap Css -->
<link href="{{ asset('backend/assets/css/bootstrap.min.css') }}" id="bootstrap-style" rel="stylesheet" type="text/css" />
<!-- Icons Css -->
<link href="{{ asset('backend/assets/css/icons.min.css') }}" rel="stylesheet" type="text/css" />
<!-- App Css-->
<link href="{{ asset('backend/assets/css/app.min.css') }}" id="app-style" rel="stylesheet" type="text/css" />
<!-- App bootstrap-->
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.css" >
<!-- App toastr-->
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css" >
<!-- App datepicker-->
<link href="{{asset('backend/assets/libs/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row" style="margin-top:50px;";>
<br>
</div>
</div>
<form action="add" method="POST" novalidate="">
#csrf
<div class="container">
<div class="col-md-6 offset-md-3">
<div class="card">
<div class="card-header bg-secondary text-white">nona </div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<label class="form-label">Employee Name </label>
<input type="text" class="form-control" name="empname" placeholder="" required="">
<span style="color:red;">#error('empname') {{$message}} #enderror</span>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label class="form-label"> Employee #</label>
<input type="text" class="form-control" name="empnum" placeholder="" required="">
<span style="color:red;">#error('empnum') {{$message}} #enderror</span>
</div>
</div>
</div>
<button class="btn btn-primary" type="submit">Next</button>
</div>
</form>
<script src="{{asset('backend/assets/libs/jquery/jquery.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/bootstrap/js/bootstrap.bundle.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/metismenu/metisMenu.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/simplebar/simplebar.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/node-waves/waves.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/parsleyjs/parsley.min.js')}}"></script>
<script src="{{asset('backend/assets/js/pages/form-validation.init.js')}}"></script>
<script src="{{asset('backend/assets/js/app.js')}}"></script>
<script src="{{asset('backend/assets/libs/bootstrap-datepicker/js/bootstrap-datepicker.min.js')}}"></script>
</body>
</html>
as.blade
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Dashboard | Makassed Speak </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="Premium Multipurpose Admin & Dashboard Template" name="description" />
<meta content="Themesdesign" name="author" />
<!-- App favicon -->
<link rel="shortcut icon" href="{{ asset('backend/assets/images/favicon.ico') }}">
<!-- jquery.vectormap css -->
<link href="{{ asset('backend/assets/libs/admin-resources/jquery.vectormap/jquery-jvectormap-1.2.2.css') }}" rel="stylesheet" type="text/css" />
<!-- DataTables -->
<link href="{{ asset('backend/assets/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Responsive datatable examples -->
<link href="{{ asset('backend/assets/libs/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Bootstrap Css -->
<link href="{{ asset('backend/assets/css/bootstrap.min.css') }}" id="bootstrap-style" rel="stylesheet" type="text/css" />
<!-- Icons Css -->
<link href="{{ asset('backend/assets/css/icons.min.css') }}" rel="stylesheet" type="text/css" />
<!-- App Css-->
<link href="{{ asset('backend/assets/css/app.min.css') }}" id="app-style" rel="stylesheet" type="text/css" />
<!-- App bootstrap-->
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.css" >
<!-- App toastr-->
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css" >
<!-- App datepicker-->
<link href="{{asset('backend/assets/libs/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row" style="margin-top:50px;";>
<br>
</div>
</div>
s
<form action="adds" method="POST" novalidate="">
#csrf
<div class="container">
<div class="col-md-6 offset-md-3">
<div class="card">
<div class="card-header bg-secondary text-white">Emlpoyee </div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<label class="form-label">Employee Name </label>
<input type="text" class="form-control" name="incnam" placeholder="" required="">
<span style="color:red;">#error('incnam') {{$message}} #enderror</span>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label class="form-label"> Employee #</label>
<input type="text" class="form-control" name="incnum" placeholder="" required="">
<span style="color:red;">#error('incnum') {{$message}} #enderror</span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="mb-3">
<label class="form-label">INCIDENT DETAILS</label>
<textarea class="form-control" name="inctdes" id="" cols="30" rows="10"></textarea>
<span style="color:red;">#error('inctdes') {{$message}} #enderror</span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="mb-3">
<label for="" class="form-label">INCIDENT TYPE</label>
<select class="form-select" name="inctype" id="" required="">
<option selected="" disabled="" value="">Choose...</option>
<option>THEFT</option>
<option>NON COMPLIANCE WITH COMPANY POLICY</option>
<option>ABUSING POWER</option>
<option>USING COMPANY PROPERTY FOR PERSONAL INTEREST</option>
<option>NEGLIGENCE</option>
</select>
<span style="color:red;">#error('inctype') {{$message}} #enderror</span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="mb-3">
<label for="" class="form-label">INCIDENT TYPE</label>
<select class="form-select" name="inncity" id="" required="">
<option selected="" disabled="" value="">Choose...</option>
<option>Beirut</option>
<option>North</option>
<option>South</option>
</select>
<span style="color:red;">#error('inncity') {{$message}} #enderror</span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="mb-4">
<label class="form-label">INCIDENT DATE
</label>
<div class="input-group" id="datepicker2">
<input type="text" name="incday" class="form-control" placeholder="dd M, yyyy" data-date-format="dd M, yyyy" data-date-container="#datepicker2" data-provide="datepicker" data-date-autoclose="true">
<span class="input-group-text"><i class="mdi mdi-calendar"></i></span>
<span style="color:red;">#error('incday') {{$message}} #enderror</span>
</div><!-- input-group -->
</div>
</div>
<div class="col-md-6">
<div class="mb-6">
<label class="form-label">INCIDENT DATE
</label>
<div class="input-group">
<input type="file" class="form-control" name="incatt" id="customFile">
<span style="color:red;">#error('incatt') {{$message}} #enderror</span>
</div>
</div>
</div>
/div>
<div class="row">
<div class="col-md-12">
<div class="mb-3">
<div class="d-flex flex-wrap gap-2">
<h6>I confirm that, all above provided information is correct.
</h6>
<input type="checkbox" name="incterm" id="switch3" switch="bool" checked="">
<label for="switch3" data-on-label="Yes" data-off-label="No"></label>
<span style="color:red;">#error('incterm') {{$message}} #enderror</span>
</div>
</div>
</div>
</div>
<button class="btn btn-primary" type="submit">Next</button>
</div>
</form>
<script src="{{asset('backend/assets/libs/jquery/jquery.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/bootstrap/js/bootstrap.bundle.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/metismenu/metisMenu.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/simplebar/simplebar.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/node-waves/waves.min.js')}}"></script>
<script src="{{asset('backend/assets/libs/parsleyjs/parsley.min.js')}}"></script>
<script src="{{asset('backend/assets/js/pages/form-validation.init.js')}}"></script>
<script src="{{asset('backend/assets/js/app.js')}}"></script>
<script src="{{asset('backend/assets/libs/bootstrap-datepicker/js/bootstrap-datepicker.min.js')}}"></script>
</body>
</html>
I connect bootstrap, but laravel cant find styles
app.blade.php:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="csrf-token" content="={{csrf_token()}}">
<title>#yield('title-block')</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap#5.0.2/dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="public/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="public/css/style.css">
</head>
<body>
#yield('content')
</body>
</html>
<?php
registration.blade.php:
#extends('layouts.app')
#section('title-block')
Регистрация
#endsection
#section('content')
<div class="container">
<h1 align="center">
{{-- <img src="img/logo.jpg" alt="logo" class="home">--}}
Register
</h1>
</div>
<hr>
<form name="register" method="POST" action="{{route('user.registration')}}">
#csrf
<input class="text-input" type="text" placeholder="Enter your surname" name="surname" required>
<input class="text-input" type="text" placeholder="Enter your name" name="name" required><br>
<input class="text-input" type="text" placeholder="Enter your number" name="number" required><br>
<input class="text-input" type="text" placeholder="Enter your father`s name" name="fathers_name" required>
<input class="text-input" type="text" placeholder="Enter parent number" name="parents_number" required><br>
<input class="text-input-full-width" id="password" name="password" type="password" required placeholder="Enter password"><br>
<button class="btn btn-lg btn-primary" type="submit" name="sendMe" value="1">Войти</button>
</form>
#endsection
I am beginner and dont understand why laravel dont see styles.css. I have try this
but its doesn`t work. I hope you can help me
enter image description here
<link href="{{ asset('css/style.css') }}" rel="stylesheet">
You can use simply <link rel="stylesheet" type="text/css" href="/css/bootstrap.css">
For Laravel
<link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap.css')">
And Add ASSET_URL="${APP_URL}" in .env file.
Don't Forget to clear views & cache
php artisan view:clear
php artisan config:cache
I find answer. I can only use <link rel="stylesheet" type="text/css" href="css/style.css"> without "public/"
Laravel 6.0 not show one specific page's css. Others page works smoothly.
This is my code
"satisekle.blade.php and edit.blade.php almost same page. only difference is some variable. php code is working but css is not loaded. My assets folder in public/assets
<link rel="shortcut icon" href="assets/dist/img/ico/favicon.png" type="image/x-icon">
<!-- jquery-ui css -->
<link href="assets/plugins/jquery-ui-1.12.1/jquery-ui.min.css" rel="stylesheet" type="text/css"/>
<!-- Bootstrap -->
<link href="assets/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<!-- Bootstrap rtl -->
<!--<link href="assets/bootstrap-rtl/bootstrap-rtl.min.css" rel="stylesheet" type="text/css"/>-->
<!-- Lobipanel css -->
<link href="assets/plugins/lobipanel/lobipanel.min.css" rel="stylesheet" type="text/css"/>
<!-- Pace css -->
<link href="assets/plugins/pace/flash.css" rel="stylesheet" type="text/css"/>
<!-- Font Awesome -->
<link href="assets/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<!-- Pe-icon -->
<link href="assets/pe-icon-7-stroke/css/pe-icon-7-stroke.css" rel="stylesheet" type="text/css"/>
<!-- Themify icons -->
<link href="assets/themify-icons/themify-icons.css" rel="stylesheet" type="text/css"/>
<head>
#include('partials._head')
</head>
<body class="hold-transition sidebar-mini">
#include('partials.topbar')
<div class="container" id="contentall">
<div class="content">
#include('partials.leftbar')
#yield('content')
</div>
</div>
</body>
#include('partials.javascript')
Blade
#extends('main')
#section('content')
<form action="{{ route('satislar.store') }}" method="post">
{{ csrf_field() }}
<div class="form-group">
<label for="exampleInputEmail1">Satış Takip Numarası</label>
<input type="text" class="form-control" readonly value="{{$random}}" name="satis_takip_no">
<small id="emailHelp" class="form-text text-muted">Random Atanan Unique Takip Numarası</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Ürün</label>
<input type="text" class="form-control" required id="exampleInputEmail1" aria-describedby="emailHelp"
name="urun" placeholder="Ürün">*
<small id="emailHelp" class="form-text text-muted">Ürün İsmini Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Birim</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" name="birim"
placeholder="Birim">
<small id="emailHelp" class="form-text text-muted">Ürün Miktarını Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Firma Adı</label>
<input type="text" class="form-control" required id="exampleInputEmail1" aria-describedby="emailHelp"
name="firma" placeholder="Firma Adı">*
<small id="emailHelp" class="form-text text-muted">Firmanın Adını Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Yetkili</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" name="yetkili"
placeholder="Yetkili">
<small id="emailHelp" class="form-text text-muted">Teslim Alacak Yetkilinin İsmini Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Telefon</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" name="telefon"
placeholder="Telefon">
<small id="emailHelp" class="form-text text-muted">Ulaşılacak Kişinin Telefon Numarasını Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">E-Posta</label>
<input type="email" class="form-control" id="exampleInputEmail1" required aria-describedby="emailHelp"
name="eposta" placeholder="E-Posta">*
<small id="emailHelp" class="form-text text-muted">Satışı Takip edecek Kişinin E-postasını Giriniz</small>
</div>
<button type="submit" class="btn btn-primary">Gönder</button>
</form>
#endsection
Controller
public function satisekle()
{
$number = mt_rand(1000000000, mt_getrandmax());
if ($this->sorgula($number) === "") {
return $this->satisekle();
}
return view('satislar.satisekle')->with('random', $number);
}
public function edit($id)
{
$satis = Satislar::find($id);
return view('satislar.edit')->with('satis', $satis);
}
and route;
Route::get('/satisekle', 'satislarController#satisekle');
Route::get('/index', 'satislarController#index');
Route::get('/satislar/{$id}/edit', 'satislarController#edit');
Route::resource('satislar', 'satislarController');
and this is not working. not show css i'm completely crazy;
#extends('main')
#section('content')
<form action="{{ route('satislar.update',$satis->id)}}" method="post">
#method('PUT')
{{ csrf_field() }}
<div class="form-group">
<label for="exampleInputEmail1">Satış Takip Numarası</label>
<input type="text" class="form-control" value="{{$satis->takip_no}}" name="satis_takip_no" readonly>
<small id="emailHelp" class="form-text text-muted">Random Atanan Unique Takip Numarası</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Ürün</label>
<input type="text" class="form-control" required id="exampleInputEmail1" value="{{$satis->urun}}" aria-describedby="emailHelp" name="urun" placeholder="Ürün">*
<small id="emailHelp" class="form-text text-muted">Ürün İsmini Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Birim</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" value="{{$satis->birim}}" name="birim" placeholder="Birim">
<small id="emailHelp" class="form-text text-muted">Ürün Miktarını Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Firma Adı</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" value="{{$satis->firma}}" name="firma" placeholder="Firma Adı" required>*
<small id="emailHelp" class="form-text text-muted">Firmanın Adını Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Yetkili</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" name="yetkili" value="{{$satis->yetkili}}" placeholder="Yetkili">
<small id="emailHelp" class="form-text text-muted">Teslim Alacak Yetkilinin İsmini Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">Telefon</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" name="telefon" value="{{$satis->telefon}}" placeholder="Telefon">
<small id="emailHelp" class="form-text text-muted">Ulaşılacak Kişinin Telefon Numarasını Giriniz</small>
</div>
<div class="form-group">
<label for="exampleInputEmail1">E-Posta</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" name="eposta" value="{{$satis->eposta}}" placeholder="E-Posta" required>*
<small id="emailHelp" class="form-text text-muted">Satışı Takip edecek Kişinin E-postasını Giriniz</small>
</div>
<button type="submit" class="btn btn-primary">Gönder</button>
</form>
#endsection
IMHO it's better if you use the asset() helper to load your assets, e.g.:
<link rel="shortcut icon" href="{{ asset('dist/img/ico/favicon.png') }}" type="image/x-icon">
<!-- jquery-ui css -->
<link href="{{ asset('plugins/jquery-ui-1.12.1/jquery-ui.min.css') }}" rel="stylesheet" type="text/css"/>
<!-- Bootstrap -->
<link href="{{ asset('bootstrap/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css"/>
<!-- Bootstrap rtl -->
<!--<link href="{{ asset('bootstrap-rtl/bootstrap-rtl.min.css') }}" rel="stylesheet" type="text/css"/>-->
<!-- Lobipanel css -->
<link href="{{ asset('plugins/lobipanel/lobipanel.min.css') }}" rel="stylesheet" type="text/css"/>
<!-- Pace css -->
<link href="{{ asset('plugins/pace/flash.css" rel="stylesheet') }}" type="text/css"/>
<!-- Font Awesome -->
<link href="{{ asset('font-awesome/css/font-awesome.min.css') }}" rel="stylesheet" type="text/css"/>
<!-- Pe-icon -->
<link href="{{ asset('pe-icon-7-stroke/css/pe-icon-7-stroke.css') }}" rel="stylesheet" type="text/css"/>
<!-- Themify icons -->
<link href="{{ asset('themify-icons/themify-icons.css') }}" rel="stylesheet" type="text/css"/>
You can read in this SO question on the various type of relative and absolute URLs for href= and which are better to use.
My login and register page is the same. So when I fill the register page with wrong credentials, errors appear for both login and register forms.
How can I fix this issue from a Submit button onclick event and make the login page hidden? Alternative suggestions accepted.
Note: I am using laravel and jquery. But I don't want to change it from server side.
Edit:
When the registration fail it should be focus on register page but it is focusing the login page.
What is the easiest way to make it work? Any suggestions?
I don't know how to use error bags It would be fine if someone also tell me how to do it. Many thanks.
I tried this but the button should be submit button so it doesn't work:
document.getElementById("login_id").style.visibility = "hidden";
Here the html code;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="description" content="">
<meta name="keywords" content="">
<title>MaterialLab - jQuery full version</title>
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Poppins:300,400,500,600" rel="stylesheet">
<link rel="icon" href="assets/img/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="assets/css/vendor.bundle.css">
<link rel="stylesheet" href="assets/css/app.bundle.css">
<link rel="stylesheet" href="assets/css/theme-a.css">
</head>
<body id="auth_wrapper">
<div id="login_wrapper">
<div id="login_content">
<div class="logo">
<img src="assets/img/logo/ml-logo.png" alt="logo" class="logo-img">
</div>
<h1 class="login-title">
Sign In to your account
</h1>
<div class="login-body">
<form id="1" style="visibility: visible" method="POST" action="{{ route('login') }}">
#csrf
<div class="form-group label-floating is-empty">
<label class="control-label">Email</label>
<input type="email" name="email" class="form-control" value="{{ old('email') }}" required>
#if ($errors->has('email'))
<span class="invalid-feedback">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
<div class="form-group label-floating is-empty">
<label class="control-label">Password</label>
<input type="password" name="password" class="form-control" required>
#if ($errors->has('password'))
<span class="invalid-feedback">
<strong>{{ $errors->first('password') }}</strong>
</span>
#endif
</div>
Forgot Password?
<div class="checkbox inline-block">
<label>
<input type="checkbox" class="checkbox-inline" value="">
Remember Me
</label>
</div>
<button type="submit" class="btn btn-info btn-block m-t-40">Sign In</button>
<div class="login-options">
<span>OR</span>
<hr/>
</div>
<div class="row">
<div class="col-xs-12">
<button class="btn btn-google btn-block"><i class="zmdi zmdi-google-plus"></i> Sign In with
Google
</button>
</div>
</div>
</form>
</div>
<div class="login-footer p-15">
<p>
Don't have an account? Create an account
</p>
</div>
<div id="register_wrapper">
<ul class="card-actions icons right-top">
<li>
<a href="javascript:void(0)" data-toggle="register">
<i class="zmdi zmdi-close"></i>
</a>
</li>
</ul>
<div class="logo">
<img src="assets/img/logo/ml-logo.png" alt="logo" class="logo-img">
</div>
<h1 class="login-title">
Create an account
</h1>
<div class="col-xs-12">
<button class="btn btn-google btn-block"><i class="zmdi zmdi-google-plus"></i> Sign Up with Google
</button>
</div>
<form class="clear-both" method="POST" action="{{ route('register') }}">
#csrf
<h2 class="text-center p-t-20">
Or sign up below
</h2>
<div class="form-group label-floating is-empty">
<label class="control-label">Name</label>
<input type="text" name="name" class="form-control" required>
#if ($errors->has('name'))
<span class="invalid-feedback">
<strong>{{ $errors->first('name') }}</strong>
</span>
#endif
</div>
<div class="form-group label-floating is-empty">
<label class="control-label">Email</label>
<input type="email" name="email" class="form-control" required>
#if ($errors->has('email'))
<span class="invalid-feedback">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
<div class="form-group label-floating is-empty">
<label class="control-label">Password</label>
<input type="password" name="password" class="form-control" required>
#if ($errors->has('password'))
<span class="invalid-feedback">
<strong>{{ $errors->first('password') }}</strong>
</span>
#endif
</div>
<div class="form-group label-floating is-empty">
<label class="control-label">Confirm Password</label>
<input type="password" name="password_confirmation" class="form-control" required>
</div>
<button type="submit" name="submit" onClick="makeLoginFormHidden()" class="btn btn-info btn-block m-t-40">Create my account</button>
</form>
</div>
<div class="login-footer p-15">
<p>
Already have an account? Sign In
</p>
</div>
</div>
</div>
</div>
<script>
function makeLoginFormHidden() {
document.getElementById("1").style.visibility = "hidden";
}
</script>
<script src="assets/js/vendor.bundle.js"></script>
<script src="assets/js/app.bundle.js"></script>
</body>
</html>
Check what kind of error it is by simply setting and getting session variables
// From login action
Session::flash('login_error',true);
// In the view
#if(Session::has('login_error'))
// activate the login form and show the error
#endif
For laravel project i use a metarial design bootstrap(MDBootstrap) template. use this template for master design and if i need to add somthing then i use #yeild(''). every thing is fine but if want to add radio button in form, this button is not showing in page.
here is my head what master.blade.php used..
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
<!-- Scripts -->
<!-- Fonts -->
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css?family=Raleway:300,400,600" rel="stylesheet" type="text/css">
<!-- Styles -->
<link href="metarial/css/mdb.min.css" rel="stylesheet">
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="metarial/bootstrap.min.css" rel="stylesheet">
at last of the body...
<script type="text/javascript" src="metarial/js/jquery-3.2.1.min.js"></script>
<!-- Tooltips -->
<script type="text/javascript" src="metarial/js/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
{{--
<script type="text/javascript" src="metarial/js/bootstrap.min.js"></script> --}}
<script src="{{ asset('js/app.js') }}" defer></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="metarial/js/mdb.min.js"></script>
<script>
// SideNav Initialization
$(".button-collapse").sideNav();
new WOW().init();
</script>
Form is...
<form role="form" action="{{url('/children/add')}}" method="post" enctype="multipart/form-data">
#csrf
<div class="form-group ml-4 mr-4">
<div class="row">
<div class="col-6">
<label for="name">First Name</label>
<input value="{{ old('firstName') }}" name="firstName" type="text" class="form-control" id="first" placeholder="First Name">
</div>
<div class="col-6">
<label for="name">Last Name</label>
<input value="{{ old('lastName') }}" name="lastName" type="text" class="form-control" id="last" placeholder="Last Name">
</div>
</div>
</div>
<div class="radio form-group ml-4 mr-4">
<label><input type="radio" name="optradio">Male</label>
</div>
<div class="radio">
<label><input type="radio" name="optradio">Female</label>
</div>
<div class="form-group ml-4 mr-4">
<label for="Birthday">Birthday</label>
<input name="birthday" type="date" class="form-control" id="birthday">
</div>
<div class="form-group ml-4 mr-4">
<label for="image">Profile Image</label>
<input type="file" name="image" class="form-control" id="image">
</div>
<button type="submit" style="background-color:#2DAE60;" class="btn">
<i class="fa fa-plus"></i> ADD </button>
</form>
picture of this page where radio button missing but text 'Male','Female' is remaining...
can anyone help me please?
Try changing this:
<div class="radio">
<label><input type="radio" name="optradio">Female</label>
</div>
To this:
<div class="radio">
<input type="radio" id="female-rb" name="optradio" />
<label for="female-rb">Female</label>
</div>
When using labels you should define for which radio button the label applies. You do this by adding the for attribute and let it referring the id of the radio button. To correctly render the radio button you should place the input first and then the label.