We working select box with search filter in worklight hybride mobile application using jquery mobile. so we using Select2 plugin.
I got error like this select2 is not a function at (compiled_code).What ever i added below i added please find. Any one help me how can resolve this error
i am loading select2 like below in index.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>SELECT</title>
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport"
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/worklight.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<script>window.$ = window.jQuery = WLJQ;</script>
<link rel="stylesheet" type="text/css" id="loadcss" />
<link rel="stylesheet" type="text/css" id="loadcss1" />
<script type="text/javascript"
src="lib/jquery-mobile/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript"
src="lib/jquery-mobile-router/js/jquery.mobile.router.min.js"></script>
<script type="text/javascript"
src="lib/jquery-mobile/js/jquery.mobile-1.4.0.min.js"></script>
<link rel="stylesheet"
href="lib/jquery-mobile/css/jquery.mobile-1.4.0.min.css" />
<script
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD2VMMoklmxRaYy1NvJ1Et8PjF2h4mcZEM"></script>
<link rel="stylesheet" type="text/css" href="css/jquery-ui.css">
<script src="js/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/datepickerr.css">
<link rel="stylesheet" type="text/css" href="css/datepickertheme.css">
<link rel="stylesheet" type="text/css" href="css/wickedpicker.css">
<script src="js/datepicker.js"></script>
<script src="js/wickedpicker.js"></script>
<link href="dist/css/select2.min.css" type="text/css" rel="stylesheet" />
<script src="dist/js/select2.min.js"></script>
</head>$(".js-example-basic-single").select2(); <div data-role="page" id="provider">
<div id="loadprovider">
<div data-role="header" data-position="fixed" class="top-panel">
<a onClick="navBack()" href="#" class="backbtn hdrIcn backIcn back"><img
src="img/back.png" width="26%" id="" alt=""></a>
<h1 id="lblHdrPrvdrSrch"></h1>
</div>
<img src="img/provider-bg.png" width="100%">
<div role="main" class="ui-content bodyTop">
<select class="js-example-basic-single">
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
<option value="Option 3">Option 3</option>
<option value="Option 4">Option 4</option>
<option value="Option 5">Option 5</option>
<option value="Option 6">Option 6</option>
<option value="Option 7">Option 7</option>
<option value="Option 8">Option 8</option>
<option value="Option 9">Option 9</option>
<option value="Option 10">Option 10</option>
<option value="Option 11">Option 11</option>
<option value="Option 12">Option 12</option>
<option value="Option 13">Option 13</option>
<option value="Option 14">Option 14</option>
<option value="Option 15">Option 15</option>
<option value="Option 16">Option 16</option>
<option value="Option 17">Option 17</option>
<option value="Option 18">Option 18</option>
<option value="Option 19">Option 19</option>
<option value="Option 20">Option 20</option>
<option value="Option 21">Option 21</option>
<option value="Option 22">Option 22</option>
</select>
</div> </div> </div>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire