Level 122
Jul 5, 2022
5
Level 2
show the selected option in a dropdown when updating data in a model using jquery and laravel
i want to assign a user another role in a bootstrap modal upon clicking a button in a datatable.i have successfully created a function to show a modal for each user.in the modal there is an input to show the role for the user and also all the role that should be reassigned.i have been able to show the all the other inputs from the table but am unable to get the selected role option I had saved in the table earlier.how can I achieve this that I can be able to show the option i had saved from the table earlier and display it when editing in the modal.how can i achieve this?
this is my script
$(document).on('click','.update-btn',function(e){
e.preventDefault();
var adminrole_id=$(this).val();
var url = '{{ route("getadmin_role", ":id") }}';
url = url.replace(':id', adminrole_id);
$('#assignadminmodal').modal('show');
$.ajax({
type:"GET",
url:url,
success:function(response)
{
console.log(response.admindata.roles);
//the roles here represent a relation in the user model that gets the role of the user
if (response.status==404)
{
alert(response.message);
$('#assignadminmodal').modal('hide');
}
else
{
$('#edit_name').val(response.admindata.name);
$('#adminrole_id').val(adminrole_id);
// $('#roleid').find('option:selected').val()
// var roleid =
$('#roleid option:selected').text(response.admindata.roles.role_name);
// $('#roleid option:selected').val(response.admindata.roles.role_name);
}
}
})
})
in the blade file
<div class="modal-body">
<h4>Assign an Admin another Role</h4>
<input type="hidden" name="adminrole_id" id="adminrole_id">
<div class="form-group">
<label style="font-size:15px;">Name</label>
<input type="text" class="read-only form-control" name="name" id="edit_name">
</div>
<div class="form-group">
<label style="font-size:15px;">Admin Roles</label>
<select name="adminroles" id="roleid" class="form-control text-white bg-dark" required>
@foreach ($allroles as $role)
<option value="{{ $role->id }}">
{{ $role->role_name }}
</option>
@endforeach
</select>
</div>
</div>
Level 2
@Snapey the issue comes from the roles relationship.i am being able to get the details of the role for that user on console.log(response.admindata.roles),that is the id,role_name,created at,etc...i want to get the role name here and place and replace it as the value as the option selected in the view..i have tried console.log(response.admindata.roles.role_name) the role_name here being the column in the roles table but I get an undefined error at the console..
Level 122
@stephen waweru set the val of the select element. it will then set the right option as selected. Dont try to set selected on the options directly yourself
Level 2
@Snapey how can i do that..i have tried this but still no effect
$('#role_id').val(response.adminrole);
Level 2
i have achieved using select2 eventually
var roleobj = response.admindata.roles;
var arr = $.map(roleobj, function(el) { return el['id']; });
//pass array object value to select2
$('#roleid').val(arr).trigger('change');
$('#roleid').select2();
Please or to participate in this conversation.