mercredi 5 février 2020

Update Data Using Modal Bootstrap in Laravel

Please anyone can help? i wanna use modal dialog as update data, especialy for laravel 5, i've datatable displaying chosen data and didn't put on row by row ( < td > ) example i wrote in the below blade, and how to display data in modal dialog wihout array datatable or randomly display datatable?

here the blade for table:

@if(session('notifaction'))
    <div class="alert alert-success" role="alert">
    <button type="button" class="close" data-dismiss="alert">&times;</button>
        
    </div>
    @endif
    <div class="row">
        <div class="col-6">
            <h1>Data Kinerja</h1>
        </div>
        <div class="col-6">
            <button type="button" class="btn btn-primary float-right" data-toggle="modal" data-target="#tambahhki">
            + Tambah Data
            </button>
        </div>
        <table class="table table-striped" id="datatable">
            <thead id="headrow">    
                <tr>
                    <th>NAMA</th>
                    <th>JUDUL</th>
                    <th>HKI</th>
                    <th>JENIS</th>
                    <th>STATUS</th>
                    <th id="action">Action</th>
                </tr>
            </thead>
            <tbody>
            @foreach($data_hki as $hki)
                <tr class="datarow">       
                    <td data-nama="" class="nama"> 
                        <br><a class="nidn">NIDN. </a></td>
                    <td class="judul"></td>
                    <td>
                        <a class="nohki"><strong>No HKI. </strong><br></a>
                        <a class="nodaftar"><strong>No Reg. </strong></a></td>
                    <td class="jenis"></td>
                    <td class="status"><strong></strong></td>
                    <td>
                        <div class="actionbtn">
                            <button type="button" class="btn btn-success edit" title="Modifier" data-nidn="" data-toggle="modal" ><img src="img/media/editw.png" id="del"></button>
                            <button type="button" class="btn btn-danger delete" data-toggle="modal"><img src="img/media/del.png" id="del"></button>
                        </div>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
    </div>
Modal Dialog:
<div class="modal fade" id="edithki" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modaledit">Update Data</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>                            
            <form action="/kinerja//update" id="editform_" method="PATCH">
            
                <div class="modal-body editmodal">
                    <div class="form-group row">
                        <div class="col-md-6">
                            <label>NIDN</label>
                            <input name="nidn" id="nidn" type="number" class="form-control" placeholder="NIDN" pattern=".{10,}" required title="wajib di isi minimal 10 angka nidn" value="">
                        </div>
                        <div class=col-md-6>
                            <label>Nama Lengkap</label>
                            <input name="nama_dosen" id="nama_dosen" type="text" class="form-control" placeholder="Nama" value="">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-6">
                            <label>Judul</label>
                            <input name="judul" id="judul" type="text" class="form-control" placeholder="Judul" value="" required>
                        </div>
                        <div class="col-md-6">
                                <label>Status</label>
                                <select name="status" id="status" class="form-control" id="status" onChange="disable()">
                                    <option value="Terbit" @if($hki->status == 'Terbit') selected @endif>Terbit</option>
                                    <option value="Progres" @if($hki->status == 'Progres') selected @endif>Progres</option>
                                </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-6">
                            <label>No. Daftar</label>
                            <input name="nodaftar" type="text" class="form-control" id="nomordaftar" value="" placeholder="Nomor Daftar">
                        </div>
                        <div class="col-md-6">
                                <label  >No. HKI</label>
                                <input name="nohki" type="text" class="form-control" id="nomorhki" value="" placeholder="Nomor HKI">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-md-6">
                            <label for="exampleFormControlSelect1">Jenis</label>
                            <select name="jenis" class="form-control" id="jenis">
                                <option value="Hak Cipta" @if($hki->jenis == 'Hak Cipta') selected @endif>Hak Cipta</option>
                                <option value="Paten Sederhana" @if($hki->jenis == 'Paten Sederhana') selected @endif>Paten Sederhana</option>
                            </select>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary" id="btnsave">Simpan</button>
                    </div>
                </div>
            </form>                            
        </div>
    </div>
</div>

Button:

<button type="button" class="btn btn-success edit" title="Modifier" data-nidn="" data-toggle="modal" ><img src="img/media/editw.png" id="del"></button>

Script:

 <script>
$(document).ready(function(){
   $('.edit').on('click', function(){
   $('#edithki').modal('show');
   $('#nidn').val($(this).data('nidn'));
   $('#nama_dosen').val($(this).data('nama_dosen'));
   $('#judul').val($(this).data('judul'));
   });
});
<script>

Controller:

public function showedit($nidn){
    $hki = \App\HKI::find($nidn);
    return view('/kinerja/edit',['hki' -> $hki]);
}
public function update(Request $request, $nidn){
    $hki = \App\HKI::find($nidn);
    $hki -> update($request->all());
    return redirect('/kinerja')->with('notifaction','Data Berhasil Diubah');
}

I dont have any idea to write codes on script



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire