0% found this document useful (0 votes)
20 views3 pages

! - 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
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
20 views3 pages

! - 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
We take content rights seriously. If you suspect this is your content, claim it here.
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