mdb-select

support3 pro asked 4 years ago

can't update .val() from js

Beedge pro answered 3 years ago

If you dont know the sequence in the list that your desired item will appear you can do this instead:$('.select-dropdown li:contains("op2")').trigger('click');


Maincoke commented 2 years ago

Awesome solution! I had a select with Jquery! And this code got me a lot of help! Thanks!

Jonathan Yates pro answered 4 years ago

I'm trying to do the same and have to say that the given solution is utter filth. Are you serious as this being a sensible solution? It's just dreadful.

mdb select not working properly when I select a value by default option selected that time option value and label overlap. please help


dotNetPrgmr answered 11 months ago

If you have an on-change event on your select and you need to set the value inside there (like to revert the value back or something), the proposed solution here will put you in an infinite loop, as the trigger('click') will put you inside your change event.Consider the following:

<select class="mdb-select" id="selectList" onchange="change_handler();">
    <option value="" disabled selected>Choose your option</option>
    <option value="op1">Option 1</option>
    <option value="op2">Option 2</option>
    <option value="op3">Option 3</option>
</select>

You can do:

<script>
    function change_handler() {
      // You have to set the value of the selectList also. 
     // Or, when you open the mdb-select again it will trigger change 
      $('#selectList").val('op2'); 
      $('.mdb-select input).val('Option 2'); 
    }
</script>

Bartłomiej Malanowski staff pro premium answered 4 years ago

Check this code:
<select class="mdb-select">
	<option value="" disabled selected>Choose your option</option>
	<option value="1">Option 1</option>
	<option value="2">Option 2</option>
	<option value="3">Option 3</option>
</select>
<label>Example label</label>

<button id="update">Update Option</button>
and JS:
<script>
	$(document).ready(function() {
		// Initialize Material Select
		$('.mdb-select').material_select();
	});

	$('#update').on('click', function() {
		// This will select 2nd option
		$('.select-dropdown li:eq( 2 )').trigger('click');
	});
</script>

Jorge Nuñez Malledo pro premium commented a year ago

This works nicely when you have only one . Could you please provide an example of selecting 2nd option of a specific select? It seems that "$('.select-dropdown li:eq( 2 )')" selector doesn't refers to a particular id.


Bartłomiej Malanowski staff pro premium answered 4 years ago

Why don't you like the given solution? Do you have a better solution?

Beedge pro commented 3 years ago

$('.select-dropdown li:contains("Option 2")').trigger('click');

this code just selected by seq of li can't
<select class="mdb-select">
	<option value="" disabled selected>Choose your option</option>
	<option value="1">Option 1</option>
	<option value="2">Option 2</option>
	<option value="3">Option 3</option>
</select>
<label>Example label</label
<script>
	$(document).ready(function() {
		// Initialize Material Select
		$('.mdb-select').material_select();
	});

	$('#update').on('click', function() {
		// This will select 2nd option
		$('.select-dropdown li:eq( 2 )').trigger('click');
	});
</script>
if I have
<select class="mdb-select">
	<option value="" disabled selected>Choose your option</option>
	<option value="op1">Option 1</option>
	<option value="op2">Option 2</option>
	<option value="op3">Option 3</option>
</select>
<label>Example label</label
We can't use $('.select-dropdown li:eq(op2)').trigger('click');
Hello, Yes, we can't use $('.select-dropdown li:eq(op2)').trigger('click'); because it isn't valid use of eq. If you want to use this solution to select an item you must put a number in it (0-first option, 1-second one .... etc.). Regards, Adrian

Jeremias pro premium answered 3 years ago

Have ne ask the select only for premium or synonymous free
Could you explain more precisely what would you like to know?

Jeremias pro premium answered 3 years ago

Whether the mdb-select is only for premium customers
Material select is only for premium customers.

TomekMakowski staff answered a year ago

Could you show me the code ?


Akhi joe answered a year ago

how to use materail code in angular cli(angular 7),with saas file?


Dear @Akhi joe

You can find documentation for MDB Angular select here:

https://mdbootstrap.com/docs/angular/forms/select/

If the information available there is insufficient for your use case, please provide more details about the problem.

We have special category for the questions related to Angular. It would be better to create new thread there in case of any further problems with MDB Angular components.


Gucciardi pro answered 2 months ago

I've found this solution to work fine

$('#mySelect option[value="optionValue"]').attr("selected", true);

Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No