Prevent mobile controls

[Premier Digital Designs]

Hi,

I'm trying to set up a dropdown list to certain height as follows:

   <ejs-dropdownlist focus="false"  id="itemList" dataSource="Model.CatalogItems" popupHeight="200px" placeholder="Select an item" ejs-for="CatalogItemId" name="CatalogItemId" allowFiltering="true" filterType="Contains">

            <e-dropdownlist-fields text="Text" value="Value"></e-dropdownlist-fields>

        </ejs-dropdownlist>

        <span asp-validation-for="CatalogItemId" class="text-danger"></span>

However, when view it on mobile it still takes the whole screen.

Please advise

[Joseph Christ Nithin Issack]

  Hello Premier Digital Designs, 

 

    Greetings from Syncfusion support. 

 

    We have checked your query, If you want to prevent the default mobile mode behavior you have to just set ’browserDetails.isDevice’ as false in  the ‘created’ event of the dropdownlist. Please refer the below code snippet. 

 

 

  <div class="control-wrapper"> 

    <div id="default" style='padding-top:75px;'> 

        <ejs-dropdownlist id="vegetable" dataSource="@ViewBag.data" created="created"  placeholder="Select a vegetable" popupHeight="200px"> 

            <e-dropdownlist-fields value="Vegetable"></e-dropdownlist-fields> 

        </ejs-dropdownlist> 

    </div> 

</div> 

 

 

<script type="text/javascript"> 

 

    function created(args) { 

        browserDetails.isDevice = false; 

    } 

</script> 

 

 

Sample: https://www.syncfusion.com/downloads/support/forum/164281/ze/ASPNetCore-1106397991 

 

Please find the attached sample and revert for more queries. 

 

Regards, 

Joseph Christ Nithin I. 

[Premier Digital Designs]

Hi Joseph,

Thanks for snippet! It worked really well. One last question. On said dropdowns whenever an option is chosen mobile devices will zoom in into the input is there a way to prevent that as well? 

 

Thanks for quick response!

[Joseph Christ Nithin Issack]

Hello Premier Digital Designs, 

    Thanks for the update. 

  We have checked your query. We were not able to replicate the mentioned issue. It would be helpful if you provide the following information to give a better solution. 

1. Replication steps for the issue.
2. Images or video for the replication of the issue.
3. Browser which you are using.

Regards, 

Joseph Christ Nithin I.