SharePoint Framework/ issue/ drop down change event on web part/

Question

I want to use drop down control on SharePoint framework webpart(done) and on change event to call some method/ some rest api and so.but it is not allowing.

I did not find any article where spfx web part is shown with drop down. whereever I found drop down, it was in web part edit mode.I am sure end user will laugh if I go and say hay edit web part, and choose drop down to change the data.

some body have achieved ?

Answer 1

Hope my test demo here which use AsyncDropdown of gitHub would helpful for you.

Here is the thread for your reference.

https://social.technet.microsoft.com/Forums/office/en-US/f7ef7840-43c9-4158-a29c-c654c1de753c/cascading-dropdown-using-office-ui-fabricreact-dropdow?forum=SP2016

Answer 2

Here is code that should work for you:

public render(): void {
    this.domElement.innerHTML = `
      <div>
        <select id="activeDdl">
          <option value="Data1">Data1</option>
          <option value="Data1">Data2</option>
          <option value="Data1">Data3</option>
        </select>
      </div>`;

    $(document).on('change', '#activeDdl', function (e) {
      //get dropdown selected value
      var selectedVal = $("#activeDdl").find("option:selected").val();
      alert(selectedVal);
    }.bind(this));
  }

Regards,
Chandani Prajapati