PageSize selection/dropdown not expanding

**Describe the bug**
Similar to the https://github.com/LazZiya/TagHelpers/issues/31 but I'm using bootstrap 4.1.3, same as your demos

**To Reproduce**
Steps to reproduce the behavior:
Start the project, click on PageSize select - nothing happened

**Expected behavior**
It should expand and show all possible values I provided in settings, i.e.

```
                    <paging total-records="Model.TotalRecords"
                            page-no="Model.PageNo" 
                            page-size="Model.PageSize" 
                            show-prev-next="true"
                            show-first-last="true"
                            show-total-pages="false"
                            show-total-records="false"
                            show-page-size-nav="true"
                            max-displayed-pages="20"
                            page-size-dropdown-items="100-200-500-1000-2000"
                            show-gap="true">
                    </paging>
```

**Screenshots**
![Untitled](https://user-images.githubusercontent.com/1036158/234745730-9f671619-9e89-40bc-99f3-3a28de789532.jpg)

On the screenshot, the very right select/dropdown is mine, working fine. Your select isn't expanded, unfortunately

**Desktop (please complete the following information):**
 - Windows 10
 - Chrome, FireFox
 - latest

**Additional context**
Here is my page code:
```

@page
@model Skynet.Server.LogViewer
@addTagHelper *, LazZiya.TagHelpers

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <meta name="viewport" content="width=device-width" />
    <title>Server log</title>
    <style>
        html, body {
            margin: 0px;
            padding: 0px;
        }
        table#controls th, td {
            padding-top: 5px;
            padding-bottom: 5px;
            padding-left: 15px;
            padding-right: 15px;
        }
        table#logs tr:nth-child(even) {
            background-color: #EEEEEE;
        }
    </style>
    <script>
        function toggleSort()
        {
            document.getElementById('sortTrigger').checked ^= 1;
        }
    </script>
</head>

<body>
    <div style="position: sticky; top: 0; background-color: white; border-bottom: 1px solid white; padding: 0px">
        <form method="post">
            @Html.AntiForgeryToken()
            <table id="controls">
                <tr>
                    <td>From:</td>
                    <td>To:</td>
                    <td>
                        <label>@Html.CheckBoxFor(m=>m.ShowInfo, new {onchange="form.submit();"})&nbsp;Info&nbsp;&nbsp;</label>
                        <label>@Html.CheckBoxFor(m=>m.ShowWarning, new {onchange="form.submit();"})&nbsp;Warning</label>
                    </td>
                    <td>Log records with specific text:</td>
                    <td>Total log entries:&nbsp;@Model.TotalRecords</td>
                    <td>Errors:&nbsp;@Model.ErrorsCount</td>
                </tr>
                <tr>
                    <td>@Html.TextBoxFor(m => m.FromDate, "{0:yyyy-MM-dd}", new {type="date", onKeyDown="return false;", onchange="form.submit();"})</td>
                    <td>@Html.TextBoxFor(m => m.ToDate, "{0:yyyy-MM-dd}", new {type="date", onKeyDown="return false;", onchange="form.submit();"})</td>
                    <td>
                        <label>@Html.CheckBoxFor(m=>m.ShowError, new {onchange="form.submit();"})&nbsp;Error</label>
                        <label>@Html.CheckBoxFor(m=>m.ShowCritical, new {onchange="form.submit();"})&nbsp;Critical</label>
                    </td>
                    <td>
                        <input type="search" size="40" name="FilterString" value="@Model.FilterString">
                        <button asp-for="FilterString" type="submit">Apply</button>
                    </td>
                    <td>Warnings:&nbsp;@Model.WarningsCount</td>
                    <td>Critical:&nbsp;@Model.CriticalCount</td>
                </tr>
            </table>
            <hr/>
            <table style="width: 100%">
                <tr>
                    <th style="width:14%">
                        <button type="button" class="btn btn-secondary" style="width:100%" onclick="toggleSort();form.submit();">
                            UTC Time&nbsp;&nbsp;@(Model.DescSort ? '▼' : '▲')
                        </button>
                    </th>
                    <th style="width:8%"><button type="button" class="btn btn-secondary" style="width:100%">Level</button></th>
                    <th style="width:76%"><button type="button" class="btn btn-secondary" style="width:100%">Message</button></th>
                </tr>   
            </table>
            @Html.CheckBoxFor(m=>m.DescSort, new {@id="sortTrigger", @hidden="true"})
        </form>
    </div>

    <div style="padding: 0px 0px 50px 0px;">
        <table id="logs" style="width: 100%; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word;">
            @foreach (var entry in Model.LogEntries)
            {
                <tr>
                    <td style="width:14%">@entry.EntryTime</td>
                    <td style="width:8%">@entry.LevelName</td>
                    <td style="width:76%">@entry.Message</td>
                </tr>
            }
        </table>
    </div>

    <div style="position: fixed; bottom: 0; height: 50px; width: 100%; background-color: white;">

        <table style="width:100%">
            <tr valign="baseline">
                <td style="width:99%">
                    <paging total-records="Model.TotalRecords"
                            page-no="Model.PageNo" 
                            page-size="Model.PageSize" 
                            show-prev-next="true"
                            show-first-last="true"
                            show-total-pages="false"
                            show-total-records="false"
                            show-page-size-nav="true"
                            max-displayed-pages="20"
                            page-size-dropdown-items="100-200-500-1000-2000"
                            show-gap="true">
                    </paging>
                </td>

                <td>
                    <form method="post">
                        @Html.AntiForgeryToken()
                        <select asp-for="PageSize" name="PageSize" onchange="form.submit();">
                            @foreach (var pageSize in Model.PageSizes)
                            {
                                <option value="@pageSize" @(pageSize == Model.PageSize ? "selected=\"selected\"" : "")>@pageSize</option>
                            }
                        </select>
                    </form>
                </td>
            </tr>
        </table>
    </div>
</body>

</html>

```

Here is C# code behind (related to your control):

```
        [BindProperty]
        public int PageNo { get; set; } = 1;

        [BindProperty]
        public int PageSize { get; set; } = 200;

        [BindProperty]
        public int TotalRecords { get; set; } = 1000;

```

Navigation Menu

Uh oh!

PageSize selection/dropdown not expanding #33

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Uh oh!

PageSize selection/dropdown not expanding #33

Description

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions