Untitled
unknown
plain_text
a year ago
6.2 kB
3
Indexable
<meta name="csrf-token" content="{{ csrf_token() }}"> <div class="modal fade" id="modal-kompsoft" aria-labelledby="modalKompSoftLabel" aria-hidden="true" data-route="{{ route('edit-jobprofileeditkomhardsoft') }}" data-route2="{{ route('jobprofile-fetch-softkompetensi') }}" data-route3="{{ route('jobprofile-fetch-soft') }}" data-route4="{{ route('jobprofile-hapus-hardsoft') }}" data-route5="{{ route('jobprofile-fetch-rumpun') }}" > <div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable"> <div class="modal-content"> <div class="modal-header"> <h1 class="modal-title fs-5" id="staticBackdropLabel">Edit Kompetensi Technical: Soft Skills</h1> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <form id="form-kompsoft" method="POST"> @csrf <div class="row"> <div class="col-sm-6"> <ul id="listContainersoft" class="list-group"> </ul> <div style="margin-bottom: 16px;"> <div class="row"> <!-- <div class="col-sm-5"> <p class="body-title">Pilih Rumpun</p> <input type="hidden" name="ididentitasjbtn" value="{{ $ididentitasjbtn }}"> <select id="rumpunsoft" class="form-select select2" style="width: 100%;" data-placeholder="Nama Rumpun"> <option selected disabled></option> @foreach($selectnamarumpun['result'] as $item) <option value="{{ $item['koderumpunjbtn'] }}" data-koderumpun="{{ $item['koderumpunjbtn'] }}">{{ $item['namarumpun'] }}</option> @endforeach </select> </div> --> <div class="col-md-9"> <p class="body-title">Pilih Kompetensi</p> <select id="kompetensisoft" class="form-select select2" style="width: 100%;" data-placeholder="Kompetensi"> <option value="" selected>Silahkan dipilih</option> </select> </div> </div> </div> <div id="selectedKompetensiSoft"> <!-- Selected kompetensi will be appended here --> </div> <span class="divider"></span> </div> <div class="col-sm-6"> <p class="body-title" style="text-align:center">Kamus Kompetensi</p> <hr> <div class="nama-kompetensi"> <p style="font-weight: 600; text-align:left">Nama Kompetensi:</p> <p style="text-align:left" id="namakompetensisoft"></p> </div> <div class="desc-kompetensi"> <p style="font-weight: 600; text-align:left">Definisi:</p> <p style="text-align:left" id="desckomphardsoft"></p> </div> <!-- <div> <table class="table table-striped"> <thead> <tr> <th scope="col">Proficiency Level</th> <th scope="col">Indikator Perilaku</th> </tr> </thead> <tbody id="data-body-soft"> --> <!-- Rows will be appended here --> <!-- </tbody> </table> </div> --> </div> </div> </div> <div class="modal-footer justify-content-between"> <div> <button type="button" class="btn btn-batal" data-bs-dismiss="modal">Batal</button> </div> <div> <button type="submit" class="btn btn-primary">Simpan</button> </div> </div> </div> </div> </div> <script> $(document).ready(function () { $('#modal-kompsoft').on('shown.bs.modal', function () { // Reset select element and clear descriptions when the modal opens $('#kompetensisoft').val(null).trigger('change'); $('#desckomphardsoft').text(''); $('#namakompetensisoft').text(''); // Event listener for changes on the select element $('#kompetensisoft').on('change', function () { var selectedId = $(this).val(); var selectedText = $(this).find('option:selected').text(); if (selectedId) { updateDescription(selectedId, selectedText); } }); }); }); function updateDescription(selectedValue, selectedText) { var idIdentitas = $('input[name="ididentitasjbtn"]').val(); var data = { ididentitasjbtn: idIdentitas, id: selectedValue }; $.ajax({ url: "{{ route('jobprofile-fetch-soft') }}", // Ubah URL ini sesuai dengan route yang benar untuk fetch deskripsi soft skill type: "GET", data: data, beforeSend: function() { // Show loading indicator $('#desckomphardsoft').text('Loading...'); }, success: function (response) { console.log('AJAX Response:', response); // Log the response var nameElement = $('#namakompetensisoft'); var descriptionElement = $('#desckomphardsoft'); if (response.result && Array.isArray(response.result.result)) { nameElement.text(selectedText || ''); let descKompSoft = response.result.result.map((data) => { if (data.namakomphardsoft == selectedText) return data.desckomphardsoft; }); descriptionElement.text(descKompSoft[0] || ''); } else { console.error("No matching item found for id:", selectedValue); descriptionElement.text('No matching description found.'); } }, error: function (xhr, status, error) { console.error('Error fetching description:', error); $('#desckomphardsoft').text('Error fetching description.'); } }); } </script>
Editor is loading...
Leave a Comment