Prevent Drop Down List Fullscreen Popup for Blazor WASM

Question

https://www.syncfusion.com/forums/177317/prevent-drop-down-list-fullscreen-popup

I followed this, unfortunately was unable to achieve the result.Previously I added the JS code in a script tag inside the index.html file. And added the required code inside the razor page. But it's not working.How can I disable fullscreen pop up for dropdowns in wasm?

Sureshkumar P · Accepted Answer

Hi Faiyaz,You can achieve your requirement by using the below code
example.

[index.html]
   
  function OnOpen(id) {
              setTimeout((id) => {
                  if (browserDetails.isDevice)
  {
                      var parentElement =
  document.querySelector(".e-ddl.e-control.e-popup.e-ddl-device.e-popup-open");
                     
  parentElement.classList.remove(
                          'e-ddl-device',
                          'e-ddl-device-filter'
                      );
                      parentElement.style.width
  = parentElement.width;
                     
  parentElement.style.maxHeight = '220px';
                      parentElement.querySelector(
                         
  '.e-content.e-dropdownbase'
                      ).style.maxHeight = 220 -
  25 + 'px';
                     
  parentElement.querySelector(
                         
  '.e-content.e-dropdownbase'
                      ).style.height = 'auto';
                     
  parentElement.ej2_instances[0].collision = { X: 'flip', Y: 'flip' };
                     
  parentElement.ej2_instances[0].position = { X: 'left', Y: 'bottom' };
                  }
              }, 30);
          }

Find the modified sample with the latest source here:Regards,Sureshkumar PAttachment: DDLWASM_31f71727.zip