How to set a selected option using ajax in Laravel 5.6?

Post Views: 240

Hey friends, I am trying to show database column data in my edit form of a Laravel project. yesterday I failed to show data from database in a select list using ajax. so let’s see the below blade file and ajax also to get your solution.

edit.blade.php

<div class="form-group">
  <label for="Blood_Group">Blood Group</label>
	<select class="form-control" id="bgroup" name="bgroup">
	  <option value="" disabled selected>Select BG</option>
	  <option value="O+">O+</option>
	  <option value="O-">O-</option>
	  <option value="A+">A+</option>
	  <option value="A-">A-</option>
	  <option value="B+">B+</option>
	  <option value="B-">B-</option>
	  <option value="AB+">AB+</option>
	  <option value="AB+">AB-</option>
	</select>
</div>

profile.js

$.ajax({
	type: "GET",
	url: 'addprofile',
	data: null,
	success: function(response) {
          let data = response.data;
          $("#bgroup").append('<option value=' + data[0].bgroup+ '>' + data[0].bgroup+ 
           '</option>');

        }
});

Error : updated data from database is not showing in selected list when i am trying to update it again.

Solution :

$("#bgroup").val(data[0].bgroup).attr('selected','selected');

You can also use below code:

$('#bgroup option[value="' + data[0].bgroup+ '"]').prop('selected', true);

Above solution is working for me. so if you have more solution on select option then please feel free to comment and share your knowledge.

Resources :

Author
Recent Posts

Chandan Kumar

Software Engineer at Cotocus PVT LTD.

Be a Full Stack Developer and eager to learn new Technology.
Knowledge: CSS, Bootstrap, Javascript, PHP, WordPress, Joomla, Moodle, Laravel, AJAX, Jquery, Java, Dart, Flutter, Photoshop, CorelDraw, Pagemaker
& Office Package