Where should the MDB js files be placed so the MDB.Select wi

Topic: Where should the MDB js files be placed so the MDB.Select will work

dharris909@gmail.com asked 5 years ago

Expected behavior The MDB select should work.

Actual behavior It doesn't

Resources (screenshots, code snippets etc.) SPIRAL login

    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
    <!-- Bootstrap core CSS -->
    <link href="/mdbpro/css/bootstrap.min.css" rel="stylesheet">
    <!-- Material Design Bootstrap -->
    <link href="/mdbpro/css/mdb.min.css" rel="stylesheet">
    <!-- Your custom styles (optional) -->
    <link href="/mdbpro/css/style.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
    <style>
        /*   #9ecae1  */
        #sp-mainBody {
            min-height:400px;
            /*                background-color: #deebf7;*/
        }

        #sp-topMenuBar {
            height:50px;
            background-color: #3182bd;
            color:white;
            font-family: 'Roboto', sans-serif; 
        }
    </style>

    <!-- JQuery -->
    <script type="text/javascript" src="http://spiralworkspace.org/mdbpro/js/jquery-3.4.1.min.js"></script>
    <!-- Bootstrap tooltips -->
    <script type="text/javascript" src="http://spiralworkspace.org/mdbpro/js/popper.min.js"></script>
    <!-- Bootstrap core JavaScript -->
    <script type="text/javascript" src="http://spiralworkspace.org/mdbpro/js/bootstrap.min.js"></script>
    <!-- MDB core JavaScript -->
    <script type="text/javascript" src="http://spiralworkspace.org/mdbpro/js/mdb.min.js"></script>
    <!-- Spiral Core  JavaScript -->
    <script type="text/javascript" src="/code/js/spiral.js"></script>


</head>

<body id="sp-mainBody" class="background-color:white" >
    <!--Navbar-->
    <nav class="navbar navbar-expand-lg navbar-dark secondary-color-dark" style="background-color:#333;">
        <!-- Navbar brand -->
        <a class="navbar-brand" href="///web/">
            SPIRAL<span style="font-weight:bold; font-size:24px">login</span>
        </a>

        <!-- Collapse button -->
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#sp-mainNav"
                aria-controls="sp-mainNav" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <!-- Collapsible content -->
        <div class="collapse navbar-collapse" id="sp-mainNav">


        </div>
        <!-- Collapsible content -->

    </nav>
    <!--/.Navbar-->
    <!-- Start your project here-->
    <div style="padding:6px;">
        <select class="mdb-select md-form">
<option value="" disabled selected>Choose your option</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>

</body>

// Material Select Initialization $(document).ready(function() { $('.mdb-select').materialSelect(); });

dharris909@gmail.com commented 5 years ago

This worked. Thank you. Hopefully this placement will work for all of my other code.

Add comment

Adam Jakubowski staff pro premium priority answered 5 years ago

0 0 Best answer

Hi,

The mdb js files should be placed at the bottom but before the </body> tag as in the Example (we create our snippets differently but to show what your code should look like in index.html I put all the code in the html section)

Best,

Adam

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

User: Free
Premium support: No
Technology: MDB jQuery
MDB Version: 4.8.5
Device: Surface pro
Browser: chrome
OS: windows
Provided sample code: No
Provided link: No

dharris909@gmail.com

20Support score
2Questions 1Answers

0Snippets likes 0Snippets