Append Selected Drop Down Value with Option in Laravel Blade with Jquery


I want to show the models by changing the Drop Down value....I know how to get the value of drop down with change function but my problem is that i want to send that value in route to filter the models.....Please tell me how can i send the changed value id with route from blade..

This is my Drop Down

<select class="form-control" id="category" placeholder="Select category"> <option>All</option> @foreach($categories as $category) <option value="{{route('contributors.index')}}?category={{ $category->id }}">{{$category->name}}</option> @endforeach </select>

Here i my Jquery Change Function

$('#category').change(function(){ alert($(this).val()); })

Explanation :

Please check the below picture....I want to show the models(in the same view)which are related to that category selected in the drop down.

<a href="https://i.stack.imgur.com/nNwRm.png" rel="nofollow"><img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/nNwRm.png" data-original="https://i.stack.imgur.com/nNwRm.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" /></a>


Add this to redirect you to the specific route. For you, it refreshes the page with the selected id in URL. So, models will filter for the given category_id.

$('#category').change(function(){ window.location = "domain.com/route/" + $('option:selected', this).val(); })

Of course, you should use your own URL instead of the URL in the example.


You can use ajax call to append and send category value to your route

$( "#category" ).change(function() { var id=$(this).val(); $.ajax({ type: 'GET', url: your url goes here, success: function (data) { //here yuo can append to model div }, error: function (data) { console.log(data); } }); });

the above code is sample for ajax request


  • Scrolling News Ticker Jquery - Issues
  • Yii2: Using Kartik Depdrop Widget?
  • Using extern @class in order to add a category?
  • “A GKScore must specify a leaderboard.”
  • How to Add Polymorphic Comments to Feed?
  • Xaml, wpf image position and crop issue
  • Extract All Possible Paths from Expression-Tree and evaluate them to hold TRUE
  • XSLT foreach repeating nodes to flat
  • Getting different value with placeholder over CPU/GPU
  • List images(01.png) and descriptions(01.txt) from directory
  • How do I access an unhandled exception in an MVC Error view?
  • D3 nodes and links from JSON with nested arrays of children
  • Google Custom Search with transparent background
  • Email format validation in mvc3 view
  • Nant, Vault & Windows Integrated Authentication
  • Bug in WPF DataGrid
  • Why doesn't :active or :focus work on text links in webkit? (safari & chrome)
  • vba code to select only visible cells in specific column except heading
  • ORA-29908: missing primary invocation for ancillary operator
  • jQuery tmpl and DataLink beta
  • How can I estimate amount of memory left with calling System.gc()?
  • How to get next/previous record number?
  • Calling of Constructors in a Java
  • Traverse Array and Display in markup
  • Transpose CSV data with awk (pivot transformation)
  • How to disable jQuery.jplayer autoplay?
  • SQL merge duplicate rows and join values that are different
  • KeystoneJS: Relationships in Admin UI not updating
  • Proper way to use connect-multiparty with express.js?
  • Why can't I rebase on to an ancestor of source changesets if on a different branch?
  • CSS Applying specific rule for a specific monitor resolution with only CSS is posible?
  • How to set the response of a form post action to a iframe source?
  • How do you join a server to an Active Directory (domain)?
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • How does Linux kernel interrupt the application?
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • To Get the radio button value in ruby on rails