The Select2 plugin not working in Laravel 5.4 - php

I am using laravel 5.4. Now I am using select2 plugin for displaying my select options at multi-level. Here my code is
#extends('layouts.app')
#section('content')
<html lang="">
<body>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel-body">
<div class="form-group">
<label for="matching_star" class="col-md-4 control-label">Matching Star</label>
<div class="col-md-6">
<select name="matching_star" class="form-control select2" id="matching-star" multiple>
<option value="aaa">aaa</option>
<option value="bbb">bbb</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="{{ URL::asset('https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js') }}"></script>
<link rel="stylesheet" href="{{ URL::asset('https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css') }}" />
<script type="text/javascript" src="{{ URL::asset('https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js') }}"></script>
<script type="text/javascript">
$('#matching-star').select2();
</script>
</html>
#endsection
My app.blade.php
<!DOCTYPE html>
<html lang="{{ config('app.locale') }}">
<head>
<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>
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<!-- Scripts -->
<script>
window.Laravel = {!! json_encode([
'csrfToken' => csrf_token(),
]) !!};
</script>
</head>
<body>
<div id="app">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
</div>
</nav>
#yield('content')
</div>
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
It is not working only the input is visible. It suggest nothing when I am click the input.
If I remove the first line #extends('layouts.app') then it works fine. I think the App.js from App layout override the select2 plugin. How can I implement the multiselect without removing the App layout?. Thanks in advance.

wrap your javascript in a document ready like this
<script>
$(document).ready(function() {
$('#matching-star').select2();
});
</script>

1) Please check your select jQuery OR jQuery.min is properly load or Not.
2) Other wise jQuery are twice on your page.
i am not sure but just check it. i hope it's helpful.

Remove following from view and check again:
<script type="text/javascript" src="{{ URL::asset('https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js') }}"></script>
As far as I know Laravel's default app.js includes jQuery by default.

Related

Im getting CSS and JS not found laravel 9 app

I'm trying to add a custom UI to my Laravel 9 app. So I'm adding extra CSS and JS files to my app.blade.php But looks like its not loading properly.
As you can see http://127.0.0.1:8000/css/tailwind.output.css and http://127.0.0.1:8000/js/init-alpine.js files not loaded. But when i check default http://127.0.0.1:8000/css/app.css file. Its working. But both of these files resides in the same location, which is resources/css/ and resources/js/ folders. Why those custom css and js files not loaded.
<!DOCTYPE html>
<html :class="{ 'theme-dark': dark }" x-data="data()" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght#400;600;700&display=swap">
<!-- Styles -->
<link rel="stylesheet" href="{{ mix('css/app.css') }}">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght#400;500;600;700;800&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="{{ asset('css/tailwind.output.css') }}">
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine#v2.x.x/dist/alpine.min.js"defer></script>
<script src="{{ asset('js/init-alpine.js') }}" defer></script>
#livewireStyles
<!-- Scripts -->
<script src="{{ mix('js/app.js') }}" defer></script>
</head>
<body class="font-sans antialiased">
<x-jet-banner />
<div class="min-h-screen bg-gray-100">
#livewire('navigation-menu')
<!-- Page Heading -->
#if (isset($header))
<header class="bg-white shadow">
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
{{ $header }}
</div>
</header>
#endif
<!-- Page Content -->
<main>
{{ $slot }}
</main>
</div>
#stack('modals')
#livewireScripts
</body>
</html>
I'm using tailwind CSS, livewire, jetstream and Laravel 9

Laravel SweetAlert not working inside validation fails block

I am using realrashid/sweet-alert version 3.1 with laravel 5.8
the issue is when I am using alert after form success or after validation failed its not working here is my code
public function store(Request $request)
{
$rules = [
'title' => 'required',
'title_desc' => 'required',
'desc' => 'required',
'pic' => 'required',
];
$customMessages = [
'title_desc.required' => 'The Short Description field is required.',
];
$validator = Validator::make($request->all(), $rules, $customMessages);
if ($validator->fails()) {
Alert::error('error', 'Validation Errors');
return back();
}
$update_arr = array(
'title' => "hello",
'description' => "world",
'title_desc' => "hello world",
'added_on' => date("Y-m-d H:i:s")
);
StoriesModel::create($update_arr);
Alert::success('Success', 'Story Created Successfully');
return redirect('admin/stories');
}
in this code I used alert two times and its not working on both conditions
on the other hand
if I am using it like below
public function create()
{
Alert::error('error', 'Validation Errors');
$this->data['title'] = 'Stories';
$this->data['menu'] = 'stories';
return View::make('admin.stories.create', $this->data);
}
Its working fine
Here is my master layout
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>#yield('title')</title>
<link href="{{ url('assets/admin/css/bootstrap.min.css') }}" rel="stylesheet">
<link href="{{ url('assets/admin/font-awesome/css/font-awesome.css') }}" rel="stylesheet">
<!-- Toastr style -->
<link href="{{ url('assets/admin/css/plugins/toastr/toastr.min.css') }}" rel="stylesheet">
<!-- Gritter -->
<link href="{{ url('assets/admin/js/plugins/gritter/jquery.gritter.css') }}" rel="stylesheet">
<link href="{{ url('assets/admin/css/animate.css') }}" rel="stylesheet">
<link href="{{ url('assets/admin/css/style.css') }}" rel="stylesheet">
#yield('page_css_tags')
#yield('page_custom_css')
</head>
<body>
<div id="wrapper">
#include('layouts.admin.sidebar')
<div id="page-wrapper" class="gray-bg">
#include('layouts.admin.topbar')
#include('layouts.admin.content_header')
#yield('content')
#include('layouts.admin.footer')
</div>
</div>
<!-- Mainly scripts -->
<script src="{{ url('assets/admin/js/jquery-3.1.1.min.js') }}"></script>
<script src="{{ url('assets/admin/js/popper.min.js') }}"></script>
<script src="{{ url('assets/admin/js/bootstrap.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/metisMenu/jquery.metisMenu.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/slimscroll/jquery.slimscroll.min.js') }}"></script>
<!-- Flot -->
<script src="{{ url('assets/admin/js/plugins/flot/jquery.flot.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/flot/jquery.flot.tooltip.min.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/flot/jquery.flot.spline.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/flot/jquery.flot.resize.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/flot/jquery.flot.pie.js') }}"></script>
<!-- Peity -->
<script src="{{ url('assets/admin/js/plugins/peity/jquery.peity.min.js') }}"></script>
<script src="{{ url('assets/admin/js/demo/peity-demo.js') }}"></script>
<!-- Custom and plugin javascript -->
<script src="{{ url('assets/admin/js/inspinia.js') }}"></script>
<script src="{{ url('assets/admin/js/plugins/pace/pace.min.js') }}"></script>
<!-- jQuery UI -->
<script src="{{ url('assets/admin/js/plugins/jquery-ui/jquery-ui.min.js') }}"></script>
<!-- GITTER -->
<script src="{{ url('assets/admin/js/plugins/gritter/jquery.gritter.min.js') }}"></script>
<!-- Sparkline -->
<script src="{{ url('assets/admin/js/plugins/sparkline/jquery.sparkline.min.js') }}"></script>
<!-- Sparkline demo data -->
<script src="{{ url('assets/admin/js/demo/sparkline-demo.js') }}"></script>
<!-- ChartJS-->
<script src="{{ url('assets/admin/js/plugins/chartJs/Chart.min.js') }}"></script>
<!-- Date range use moment.js same as full calendar plugin -->
<script src="{{ url('assets/admin/js/plugins/fullcalendar/moment.min.js') }}"></script>
#yield('page_script_tags')
#yield('page_custom_script')
#include('sweetalert::alert')
</body>
</html>
you can see I have added #include('sweetalert::alert') before body tags ends
and here is the blade that extends the master
#extends("layouts.admin.master")
#section('title')
Butterfly | Stories
#endsection
#section('content_header_title')
Stories
#endsection
#section('page_css_tags')
<link href="{{ url('assets/admin/css/plugins/blueimp/css/blueimp-gallery.min.css') }}" rel="stylesheet">
<link href="{{ url('assets/admin/css/plugins/select2/select2.min.css') }}" rel="stylesheet">
<link href="{{ url('assets/admin/css/plugins/select2/select2-bootstrap4.min.css') }}" rel="stylesheet">
#endsection
#section('content')
<div class="wrapper wrapper-content">
<div class="row">
<div class="col-md-12">
<div class="ibox">
<div class="ibox-title">
<h5>{{ #$record ? "Edit" :'Create New' }} Story</h5>
</div>
<div class="ibox-content">
<form method="post" action="{{url('admin/store_story')}}"
enctype="multipart/form-data" role="form">
#csrf
<div class="form-group">
<select class="select2_demo_1 form-control" id="select_seaction" name="seaction"
required>
<option value="" disabled selected>Select Seaction</option>
<option value="header">Header</option>
<option value="middle">Middle Content</option>
<option value="content">Footer Content</option>
</select>
</div>
<div class="form-group">
<label for="title">Title</label>
<input type="text" placeholder="Enter Title" class="form-control" id="title" autofocus
value="{{ #$record ? $record->title : old('title') }}" name="title" required>
</div>
<div class="form-group">
<label for="title_desc">Short Description</label>
<input type="text" placeholder="Enter Short Description" class="form-control"
id="title_desc" value="{{ #$record ? $record->title_desc : old('title_desc') }}"
name="title_desc" required>
</div>
<div class="form-group">
<label for="desc">Story</label>
<textarea class="form-control" name="desc"
id="desc"
rows="5"
required>{{ (#$record) ? $record->description: old('desc') }}</textarea>
</div>
<label title="Upload image file" for="inputImage" class="btn btn-default">
<input type="file" accept="image/*" name="pic"
id="inputImage" required>
Upload image
</label>
<div class="lightBoxGallery" id="imageUpload_display">
#if(#$record)
<a href="{{asset(#$record->image_path)}}"
title="{{ #$record ? $record->title : old('title') }}" data-gallery="">
<img src="{{asset(#$record->image_path)}}">
</a>
#endif
<!-- The Gallery as lightbox dialog, should be a child element of the document body -->
<div id="blueimp-gallery" class="blueimp-gallery">
<div class="slides"></div>
<h3 class="title"></h3>
<a class="prev">‹</a>
<a class="next">›</a>
<a class="close">×</a>
<a class="play-pause"></a>
<ol class="indicator"></ol>
</div>
</div>
<div class="form-group row">
<div class="col-sm-4 col-sm-offset-2">
<button class="btn btn-primary btn-sm" type="submit">Save changes</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
#endsection
#section('page_script_tags')
<script src="{{ url('assets/admin/js/plugins/blueimp/jquery.blueimp-gallery.min.js') }}"></script>
<!-- Select2 -->
<script src="{{ url('assets/admin/js/plugins/select2/select2.full.min.js') }}"></script>
#endsection
#section('page_custom_script')
<script>
$(document).ready(function (event) {
$(".select2_demo_1").select2({
theme: 'bootstrap4',
});
});
</script>
#endsection

Laravel view #include auto logout when refresh

I am using Laravel 5.5 with mysql database, session storing in database.
#Problem : Whenever I refresh or go into another page, it will log me out and redirect me back to the login page.
#Cause : After debugging, I found out whenever I #include a view top.blade.php inside my view template named master.blade.php, when I refresh the page, it will auto log me out and killing off the session.
The codes inside top.blade.php :
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<!-- Mobile Menu -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Header Icon -->
<a href="{{ url('/') }}">
<img class="navbar-brand" src="{{ asset('images/head.png') }}" alt="Little Project">
</a>
<!-- Message Of The Day -->
<div class="navbar-text visible-xs"><p>Little Project</p></div>
{{ Auth::user()}} <!-- to check the user info if it retains -->
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<!--Right side of the NavBar -->
<ul class="nav navbar-nav navbar-right">
#guest
<li>Login</li>
<li>Register</li>
#else
<li>Demo</li>
<li>Logout</li>
#endguest
</ul>
</div><!-- /.navbar-collapse -->
While the master.blade.php file is
<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<head>
<!--meta header-->
<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() }}">
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<!-- Title -->
<title>Little Project</title>
</head>
<body>
#include('constants.top')
<div class="container">
<!-- Contents -->
#yield('content')
</div>
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
However when refresh, it will destroy all sessions as long as I #include top.blade.php
I have found my problem,
The fact that I have <li>Logout</li> within my top.blade.php file, it will auto call out the logout everytime it loads the page. Bad practice !!
What should be done is to have a post method directed to the logout controller through form with csrf_field()
Ensure you are using the web middleware group for your route.and ensure the web middleware group in app/Http/Kernel.php has the \Illuminate\Session\Middleware\StartSession::class, included

Bootstrap not loading in blade language

currently I'm learning laravel 5.1, and i'm making a simple forum like website. but first m stuck in register view, i have used blade language and it is not loading bootstrap library properly.
This is my main page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title></title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
#yield('page-content')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
This is my nav.blade.php
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="http://localhost/laravel/laravel/public">Ask UMT</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li>Log In</li>
<li>{!!link_to_route('get_register','Register')!!}</li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>
And register.blade.php
#extends('layouts.masters.main')
#section('page-content')
#include('layouts.partials.nav')
{!! Form::open(['route' => 'post_register','id' => 'registration-form']) !!}
{!! Form::label('name','Full Name') !!}
{!! Form::text('name',null,['id' => 'name','class' => 'form-control','placeholder' => 'Full Name','required'])!!}
{!! Form::label('email','Email Address') !!}
{!! Form::email('email',null,['id' => 'email','class' => 'form-control','placeholder' => 'Email Address','required'])!!}
{!! Form::label('password','Password') !!}
{!! Form::password('password',['id' => 'password','class' => 'form-control','placeholder' => 'Password','required'])!!}
{!! Form::button('Register',['class' => 'btn btn-lg btn-primary btn-block','type' => 'submit'])!!}
{!! Form::close() !!}
#stop
What I'm doing wrong ?
I assume that the path to your bootstrap.min.css file is wrong. If you use the path css/bootstrap.min.css, the file should be placed in public/css/bootstrap.min.css.
All files that you want to access from the clientside should be placed in the public folder.
Furthermore you should use the asset() helper function, which will determine the right absolute path for you:
<link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet">
--
The same is true for your bootstrap.min.js file.
need to upload the files with the asset() function, so you specific to your project files will bring them to the public folder, thus leaving {{asset ('css/bootstrap.css')}},
You can learn more here
you need to use this method with css and js like this:
<link href="{{ asset('your-route/css/bootstrap.css') }}" rel="stylesheet">
and
<script src="{{ asset('your-route/js/bootstrap.js') }}"></script>
I hope it helps you...

Bootstrap popup login page not working?

i am new to php framework and bootstrap working on CodeIgnitor 3.0.
I have simple navigation bar for signup and login clicking on login redirects to another page where is another login button clicking on which should open the popup
login form but it's not working??
//my nav bar
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta name="robots" content="NOODP"/>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="<?= base_url();?>css/bootstrap.css" rel="stylesheet">
<script src="js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="js/bootstrap.js"></script>
</head>
<style>
body {
padding-top: 0px;
}
#media (max-width: 1000px) {
body {
padding-top: 0px;
}
}
</style>
<body>
<div class="container">
<div class="row">
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">LOGO</a>
</div>
<div class="collapse navbar-collapse" id="example-navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li class="active">SignUp</li>
<li>Login</li>
</ul>
</div>
</nav>
</div>
//login.php in views folder
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta name="robots" content="NOODP"/>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="<?= base_url();?>css/bootstrap.css" rel="stylesheet">
<script src="js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="js/bootstrap.js"></script>
</head>
<div class="container">
<div class="row">
<a class="btn btn-primary" data-toggle="modal" href="#myModal" >Login</a>
<div class="modal hide" id="myModal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">x</button>
<h3>Login to MyWebsite.com</h3>
</div>
<div class="modal-body">
<form method="post" action='' name="login_form">
<p><input type="text" class="span3" name="eid" id="email" placeholder="Email"></p>
<p><input type="password" class="span3" name="passwd" placeholder="Password"></p>
<p><button type="submit" class="btn btn-primary">Sign in</button>
Forgot Password?
</p>
</form>
</div>
<div class="modal-footer">
New To MyWebsite.com?
Register
</div>
</div>
</div>
</div>
What should i do if i want that login page to popup on homepage???
You have a couple of issues that you need to correct. To get the modal working you need to remove the hide class on the modal.
<div class="modal hide" id="myModal">
should be
<div class="modal" id="myModal">
Also, the hyperlink should have data-target (not href). So
<a class="btn btn-primary" data-toggle="modal" href="#myModal">Login</a>
should be
<a class="btn btn-primary" data-toggle="modal" data-target="#myModal">Login</a>
These changes should get the modal running, but there are other corrections you need to do
In both your files you are loading bootstap, jquery and then bootstrap again. You only need to load bootstrap once and it should be after the jQuery, So
<script src="js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="js/bootstrap.js"></script>
should be
<script src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="js/bootstrap.min.js"></script>
Here is the complete //login.php that should work (I've added body and title tags for completeness and closed the html tag)
I've also replaced the script and css with CDN versions to take out any problems with your local js files. Do swap them back once you get it working.
<!DOCTYPE HTML>
<html lang="en">
<head>
<title></title>
<meta name="robots" content="NOODP"/>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<a class="btn btn-primary" data-toggle="modal" data-target="#myModal">Login</a>
<div class="modal" id="myModal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">x</button>
<h3>Login to MyWebsite.com</h3>
</div>
<div class="modal-body">
<form method="post" action='' name="login_form">
<p><input type="text" class="span3" name="eid" id="email" placeholder="Email"></p>
<p><input type="password" class="span3" name="passwd" placeholder="Password"></p>
<p>
<button type="submit" class="btn btn-primary">Sign in</button>
Forgot Password?
</p>
</form>
</div>
<div class="modal-footer">
New To MyWebsite.com?
Register
</div>
</div>
</div>
</div>
</body>

Categories