Scribd
Upload
19 views

! - Button Trigger Modal

The document describes a modal popup window that can be vertically centered on a page. The modal contains a title, body text describing the history of Lorem Ipsum, and buttons to close or save changes.

Uploaded by

januarsetyo
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
19 views

! - Button Trigger Modal

The document describes a modal popup window that can be vertically centered on a page. The modal contains a title, body text describing the history of Lorem Ipsum, and buttons to close or save changes.

Uploaded by

januarsetyo
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

<!

-- Button trigger modal -->


<button type="button" class="btn btn-info" data-bs-toggle="modal" data-bs-
target="#exampleVerticallycenteredModal">Vertically Centered</button>
<!-- Modal -->
<div class="modal fade" id="exampleVerticallycenteredModal" tabindex="-1" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-
label="Close"></button>
</div>
<div class="modal-body">Contrary to popular belief, Lorem Ipsum is not
simply random text. It has roots in a piece of classical Latin literature from 45
BC, making it over 2000 years old. Richard McClintock, a Latin professor at
Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words,
consectetur.</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-
dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>

{{-- @if (!empty($item))


<div class="modal fade" id="exampleVerticallycenteredModal" tabindex="-1" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Input Warna</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-
label="Close"></button>
</div>
<div class="modal-body">
<form action="/insert-warna" method="POST">
@csrf
<input type="hidden" name="id_permintaan" value="{{ $item->id }}">
<div class="row mb-3">
<label for="inputText" class="col-sm-3 col-form-label">Warna</label>
<div class="col-sm-8">
<select class="form-select" style="width: 100%;" name="id_warna"
required>
@foreach ($warna as $color )
<option value="{{ $color->id }}">{{ $color->nama_warna
}}</option>
@endforeach
</select>
</div>
</div>
<div class="row mb-3">
<label for="inputText" class="col-sm-3 col-form-label">Ukuran</label>
<div class="col-sm-8">
<select class="form-select" style="width: 100%;" name="id_ukuran"
required>
@foreach ($ukuran as $size )
<option value="{{ $size->id }}">{{ $size->jenis_ukuran
}}</option>
@endforeach
</select>
</div>
</div>
<div class="row mb-3">
<label for="inputText" class="col-sm-3 col-form-label">Total</label>
<div class="col-sm-8">
<input type="number" name="total" class="form-control" required>
</div>
</div>

<div class="modal-footer">
<button type="submit" class="btn btn-success">Save changes</button>
</div>
</form>
</div>
</div>
</div>
</div>
@endif
--}}

{{-- <div class="col-10 col-lg-10 col-xl-4 d-flex">


<div class="card radius-10 overflow-hidden w-100">
<div class="card-body">
<form action="/insert-warna" method="POST">
@csrf
<input type="hidden" name="id_permintaan"
value="{{ $permintaan->id }}">
<div class="row mb-3">
<label for="inputText" class="col-sm-3
col-form-label">Warna</label>
<div class="col-sm-8">
<select class="form-select" style="width: 100%;"
name="id_warna" required>
@foreach ($warna as $color )
<option value="{{ $color->id }}">{{ $color-
>nama_warna }}</option>
@endforeach
</select>
</div>
</div>
<div class="row mb-3">
<label for="inputText" class="col-sm-3
col-form-label">Ukuran</label>
<div class="col-sm-8">
<select class="form-select" style="width: 100%;"
name="id_ukuran" required>
@foreach ($ukuran as $size )
<option value="{{ $size->id }}">{{ $size-
>jenis_ukuran }}</option>
@endforeach
</select>
</div>
</div>
<div class="row mb-3">
<label for="inputText" class="col-sm-3
col-form-label">Total</label>
<div class="col-sm-8">
<input type="number" name="total" class="form-control"
required>
</div>
</div>

<div class="modal-footer">
<button type="submit" class="btn btn-success">Save changes</button>
</div>
</form>
</div>
</div>
</div> --}}

You might also like