Create DropDown Menu in Bootstrap Nav Header

Hi,

I tried to do a dropdown in nav header but unfortunately, when i click the dropdown it doesn't work.

This is my code

    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <img src="~/image.png" width="150px" height="75px" align="right" />
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a style="margin-top:15px;font-weight:900; font-size:20px !important" class="navbar-brand" href="">APCC NEW GENERATION PRODUCT</a>
        </div>
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul style="margin-top:15px; float:right" class="nav navbar-nav">
                <li>
                    <a href="~/home/index">Home</a>
                </li>
                <li>
                    <a href="#" data-toggle="modal" data-target="#myModal">EQM</a>
                </li>
                <li>
                    <div class="dropdown">
                        <button class="dropbtn">
                           Platform
                            <i class="fa fa-caret-down"></i>
                        </button>
                        <div class="dropdown-content">
                            <a href="~/home/AddPlatform">Add New</a>
                            <a href="~/home/PlatformIndex">View List</a>
                        </div>
                    </div>
                </li>
                <li>
                    <a href="~/home/PlatformIndex">List Platform</a>
                </li>
                <li>
                    <a href="~/home/Userlist">Email Management</a>
                </li>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
        <!-- /.container -->
    </nav>

<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<link href="~/Content/themes/base/minified/jquery-ui.min.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
<link href="~/Content/font-awesome.min.css" rel="stylesheet" />
<!-- Custom CSS -->
<script src="~/Scripts/jquery-3.3.1.js"></script>
<script src="~/Scripts/jquery-ui.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>