Topic: How to update select option using ajax priority asked 1 year ago


I do not find a way to update select options using jQuery or Javascript. I want to update dropdown items using ajax based on selected parent dropdown.

Is they anyone who can help me?

Thanks Parth priority answered 1 year ago


Thank you for reply.

I have tried that code but still problem. It generated two dropdown.

const select = document.querySelector('#client');
const option = document.createElement('option');
option.value = 1;
option.innerText = "option 1";

const mySelect = new mdb.Select(select);


Thank you.

Dawid Wajszczuk staff commented 1 year ago

It's probably due to double initialization of the Select component. You probably used select class. You can remove that class or dispose current select and make new instance. You can try something like this priority commented 1 year ago

Thank you very much, that works but suppose i have lots of select items in ajax so should i do a loop for this code.

Basically i want to replace sub dropdown all options based on parent selected. priority commented 1 year ago

I found solution, i can use below code for that.

/* This code works but it create two dropdowns, */const select = document.querySelector('#client');

const removeChilds = (parent) => { while (parent.lastChild) { parent.removeChild(parent.lastChild); }};// remove all child nodesremoveChilds(select);

Dawid Wajszczuk staff commented 1 year ago

It is not clear for me, do you need any other help? Or is your issue resolved?

Dawid Wajszczuk staff answered 1 year ago


Here is the snippet showing how to add options via JS

Keep coding,

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • User: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 4.0.0
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No