2016-06-26 10 views
-1

Wir arbeiten Auswahlfeld mit Suchfilter in worklight hybride mobile Anwendung mit jquery mobile. Also verwenden wir das Select2-Plugin.wählen Sie die Box mit der Suche, wie zu lösen "select2 ist keine Funktion bei (kompilierten_code)"

Ich habe Fehler wie diese select2 ist keine Funktion bei (compiled_code) .Was auch immer ich unten hinzugefügt habe, fügte ich bitte finden Sie. Jeder mir helfen, wie diese Fehler beheben können

, wenn ich in meinem Projekt intigrating

index.html

<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 
<meta charset="UTF-8"> 
 
<title>QLM</title> 
 
<meta name="format-detection" content="telephone=no"> 
 
<meta name="msapplication-tap-highlight" content="no"> 
 
<meta name="viewport" 
 
\t content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> 
 
<link rel="stylesheet" type="text/css" href="css/index.css"> 
 
<link rel="stylesheet" type="text/css" href="css/main.css"> 
 

 
<link href="dist/css/select2.min.css" type="text/css" rel="stylesheet" /> 
 
<script src="dist/js/jquery.js"></script> 
 
<script src="dist/js/select2.min.js"></script> 
 

 
<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" 
 
\t src="lib/jquery-mobile/js/jquery-1.11.0.min.js"></script> 
 
<script type="text/javascript" 
 
\t src="lib/jquery-mobile-router/js/jquery.mobile.router.min.js"></script> 
 
<script type="text/javascript" 
 
\t src="lib/jquery-mobile/js/jquery.mobile-1.4.0.min.js"></script> 
 
<link rel="stylesheet" 
 
\t href="lib/jquery-mobile/css/jquery.mobile-1.4.0.min.css" /> 
 
<script 
 
\t 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> 
 
</head> 
 

 
<body style="display: none;"> 
 

 
    <!--- Login---> 
 
    <div data-role="page" id="home"> 
 
\t \t <div id="loadhome"> 
 
\t \t \t <div role="main" class="ui-content" style="margin-top:31px;background: transparent !important;"> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div> 
 

 
\t <div data-role="page" id="lang"> 
 
\t \t <div role="main" class="ui-content" style="margin-top:34%;background: transparent !important;"> 
 
\t <div class="text-center bottomspacer"> 
 
\t \t <img src="img/logo.png" width="30%"> 
 
\t </div> 
 

 
\t <h2 class="text-center bottomspacer" >Choose Preferred Language</h2> 
 
\t <h4 class="text-center bottomspacer" >اختÙار اÙÙغة اÙÙÙضÙØ©</h4> 
 
\t 
 
\t 
 
\t <div style="width:100%"> 
 
\t \t <span class="english" id="langEn" onclick="navToLogin('login','en')" style="float:left ">English</span> 
 
\t \t <span class="qatra" id="langAr" onclick="navToLogin('login','ar')" style="float:right ">اÙعربÙØ©</span> 
 
\t </div> 
 
    </div> 
 
\t </div> 
 

 
\t <div data-role="page" id="provider"> 
 
\t \t <div id="loadprovider"></div> 
 
\t </div> 
 

 
\t <script type="text/javascript" src="lib/fastclick/js/fastclick.js"></script> 
 
\t <script type="text/javascript" 
 
\t \t src="lib/handlebars/js/handlebars-v1.3.0.js"></script> 
 
\t <script src="js/initOptions.js"></script> 
 
\t <script src="js/main.js"></script> 
 
\t <script src="js/messages.js"></script> 
 
\t <script src="js/jquery-gauge.min.js"></script> 
 
\t <script src="js/navigation.js"></script> 
 
\t <script src="js/common.js"></script> 
 
\t <script src="js/login.js"></script> 
 
\t <script src="js/reg.js"></script> 
 
\t <script src="js/langpreffer.js"></script> 
 
\t <script src="js/mngprof.js"></script> 
 
\t <script src="js/dashbrd.js"></script> 
 
\t <script src="js/policy.js"></script> 
 
\t <script src="js/benefitlimitspol.js"></script> 
 
\t <script src="js/clmsexp.js"></script> 
 
\t <script src="js/clmssub.js"></script> 
 
\t <script src="js/clmstrkng.js"></script> 
 
\t <script src="js/preaprvl.js"></script> 
 
\t <script src="js/preaprovaltracking.js"></script> 
 
\t <script src="js/phamcy.js"></script> 
 
\t <script src="js/healthcertpol.js"></script> 
 
\t <script src="js/insurancecard.js"></script> 
 
\t <script src="js/hlthrcrds.js"></script> 
 
\t <script src="js/prvdr.js"></script> 
 
\t <script src="js/bmicaltr.js"></script> 
 
\t <script src="js/emgcyno.js"></script> 
 
\t <script src="js/hlthtips.js"></script> 
 
\t <script src="js/prvdrslistdtls.js"></script> 
 
\t <script src="js/showmaps.js"></script> 
 
\t <script src="js/qlmchat.js"></script> 
 
\t <script src="js/pushnotification.js"></script> 
 
\t <script src="js/mediRem.js"></script> 
 

 
</body> 
 
</html>

provider.html

/*provider.js*/ 
 

 
$(".js-example-responsive").select2({ 
 
\t placeholder: "Select a state", 
 
\t language: "es", 
 
\t theme: "classic" 
 
\t });
/*provider.html*/ 
 

 
<div data-role="header" data-position="fixed" class="top-panel"> 
 
\t <a onClick="navBack()" href="#" class="backbtn hdrIcn backIcn back"><img 
 
\t \t src="img/back.png" width="26%" id="" alt=""></a> 
 
\t <h1 id="lblHdrPrvdrSrch"></h1> 
 
</div> 
 

 
<img src="img/provider-bg.png" width="100%"> 
 

 
<div role="main" class="ui-content bodyTop"> 
 

 
\t <p id="errIdPrvdrSrch" class="error"></p> 
 
\t 
 
\t <select class="js-example-responsive" style="width: 50%"> 
 
    \t \t \t <option value="AL">Alabama</option> 
 
\t \t \t <option value="AK">Alaska</option> 
 
\t \t \t <option value="AZ">Arizona</option> 
 
\t \t \t <option value="AR">Arkansas</option> 
 
\t \t \t <option value="CA">California</option> 
 
\t \t \t <option value="CO">Colorado</option> 
 
\t \t \t <option value="CT">Connecticut</option> 
 
\t \t \t <option value="DE">Delaware</option> 
 
\t \t \t <option value="FL">Florida</option> 
 
\t \t \t <option value="GA">Georgia</option> 
 
\t \t \t <option value="HI">Hawaii</option> 
 
\t \t \t <option value="ID">Idaho</option> 
 
\t \t \t <option value="IL">Illinois</option> 
 
\t \t \t <option value="IN">Indiana</option> 
 
\t \t \t <option value="IA">Iowa</option> 
 
\t \t \t <option value="KS">Kansas</option> 
 
\t \t \t <option value="KY">Kentucky</option> 
 
\t \t \t <option value="LA">Louisiana</option> 
 
\t \t \t <option value="ME">Maine</option> 
 
\t \t \t <option value="MD">Maryland</option> 
 
\t \t \t <option value="MA">Massachusetts</option> 
 
\t \t \t <option value="MI">Michigan</option> 
 
\t \t \t <option value="MN">Minnesota</option> 
 
\t \t \t <option value="MS">Mississippi</option> 
 
\t \t \t <option value="MO">Missouri</option> 
 
\t \t \t <option value="MT">Montana</option> 
 
\t \t \t <option value="NE">Nebraska</option> 
 
\t \t \t <option value="NV">Nevada</option> 
 
\t \t \t <option value="NH">New Hampshire</option> 
 
\t \t \t <option value="NJ">New Jersey</option> 
 
\t \t \t <option value="NM">New Mexico</option> 
 
\t \t \t <option value="NY">New York</option> 
 
\t \t \t <option value="NC">North Carolina</option> 
 
\t \t \t <option value="ND">North Dakota</option> 
 
\t \t  <option value="OH">Ohio</option> 
 
\t \t \t <option value="OK">Oklahoma</option> 
 
\t \t \t <option value="OR">Oregon</option> 
 
\t \t \t <option value="PA">Pennsylvania</option> 
 
\t \t \t <option value="RI">Rhode Island</option> 
 
\t \t \t <option value="SC">South Carolina</option> 
 
\t \t \t <option value="SD">South Dakota</option> 
 
\t \t \t <option value="TN">Tennessee</option> 
 
\t \t \t <option value="TX">Texas</option> 
 
\t \t \t <option value="UT">Utah</option> 
 
\t \t \t <option value="VT">Vermont</option> 
 
\t \t \t <option value="VA">Virginia</option> 
 
\t \t \t <option value="WA">Washington</option> 
 
\t \t \t <option value="WV">West Virginia</option> 
 
\t \t \t <option value="WI">Wisconsin</option> 
 
\t \t \t <option value="WY">Wyoming</option> 
 
\t </select> 
 
\t \t \t   
 
\t <button class="view-table" style="text-align: center !important" 
 
\t \t id="btnSrchPrvdrSrch"></button> 
 
</div>

+0

Ich verwende Select2 in Arbeitslicht Hybrid mobile Anwendung, i don‘ t Nein, es funktioniert in der mobilen Anwendung oder nicht? –

Antwort

0

Hoffentlich funktioniert es

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>QLM</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/index.css"> 
    <link rel="stylesheet" type="text/css" href="css/main.css"> 

    <link href="dist/css/select2.min.css" type="text/css" rel="stylesheet" /> 

    <link rel="stylesheet" type="text/css" id="loadcss" /> 
    <link rel="stylesheet" type="text/css" id="loadcss1" /> 

    <link rel="stylesheet" href="lib/jquery-mobile/css/jquery.mobile-1.4.0.min.css" /> 

    <link rel="stylesheet" type="text/css" href="css/jquery-ui.css"> 

    <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"> 

</head> 

<body style="display: none;"> 

<!--- Login---> 
<div data-role="page" id="home"> 
    <div id="loadhome"> 
     <div role="main" class="ui-content" style="margin-top:31px;background: transparent !important;"> 
     </div> 
    </div> 
</div> 

<div data-role="page" id="lang"> 
    <div role="main" class="ui-content" style="margin-top:34%;background: transparent !important;"> 
     <div class="text-center bottomspacer"> 
      <img src="img/logo.png" width="30%"> 
     </div> 

     <h2 class="text-center bottomspacer" >Choose Preferred Language</h2> 
     <h4 class="text-center bottomspacer" >اختÙار اÙÙغة اÙÙÙضÙØ©</h4> 


     <div style="width:100%"> 
      <span class="english" id="langEn" onclick="navToLogin('login','en')" style="float:left ">English</span> 
      <span class="qatra" id="langAr" onclick="navToLogin('login','ar')" style="float:right ">اÙعربÙØ©</span> 
     </div> 
    </div> 
</div> 

<div data-role="page" id="provider"> 
    <div id="loadprovider"></div> 
</div> 


<script src="dist/js/jquery.js"></script> 
<script src="dist/js/select2.min.js"></script> 
<script>window.$ = window.jQuery = WLJQ;</script> 
<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> 
<script src="js/jquery-ui.min.js"></script> 
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD2VMMoklmxRaYy1NvJ1Et8PjF2h4mcZEM"></script> 
<script src="js/datepicker.js"></script> 
<script src="js/wickedpicker.js"></script> 

<script type="text/javascript" src="lib/fastclick/js/fastclick.js"></script> 
<script type="text/javascript" src="lib/handlebars/js/handlebars-v1.3.0.js"></script> 
<script src="js/initOptions.js"></script> 
<script src="js/main.js"></script> 
<script src="js/messages.js"></script> 
<script src="js/jquery-gauge.min.js"></script> 
<script src="js/navigation.js"></script> 
<script src="js/common.js"></script> 
<script src="js/login.js"></script> 
<script src="js/reg.js"></script> 
<script src="js/langpreffer.js"></script> 
<script src="js/mngprof.js"></script> 
<script src="js/dashbrd.js"></script> 
<script src="js/policy.js"></script> 
<script src="js/benefitlimitspol.js"></script> 
<script src="js/clmsexp.js"></script> 
<script src="js/clmssub.js"></script> 
<script src="js/clmstrkng.js"></script> 
<script src="js/preaprvl.js"></script> 
<script src="js/preaprovaltracking.js"></script> 
<script src="js/phamcy.js"></script> 
<script src="js/healthcertpol.js"></script> 
<script src="js/insurancecard.js"></script> 
<script src="js/hlthrcrds.js"></script> 
<script src="js/prvdr.js"></script> 
<script src="js/bmicaltr.js"></script> 
<script src="js/emgcyno.js"></script> 
<script src="js/hlthtips.js"></script> 
<script src="js/prvdrslistdtls.js"></script> 
<script src="js/showmaps.js"></script> 
<script src="js/qlmchat.js"></script> 
<script src="js/pushnotification.js"></script> 
<script src="js/mediRem.js"></script> 

</body> 
</html> 

Und wenn nicht, setzen Sie diesen Code nach select2 js

<script src="dist/js/select2.min.js"></script> 
<script> 
    $(".js-example-responsive").select2({ 
     placeholder: "Select a state", 
     language: "es", 
     theme: "classic" 
    }); 
<script> 
+0

Avanya, kommt nicht Standard wählen Option kommt –

+0

ich esspect, es ist nicht select2 css und js nehmen nur jquery.mobile-1.4. 0.min.css –

+0

Verwenden Sie diesen Code anstelle der alten window.onload = function() { \t $ select2 ({ \t \t Platzhalter ("js-Beispiel-responsive.."): „a Wählen Zustand“, \t \t Sprache: "es", \t \t Thema: "classic" \t}); } –

0

Ich werde Ihnen sagen, dass es notwendig ist, alle Skripte in Tag Körper zu halten. Wenn Sie einzelne Auswahlfelder verwenden möchten, entfernen Sie das Attribut multiple in das Tag-Skript.

<select multiple="multiple" ....> to <select ....> 

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
     <title>Select</title> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> 
     <!-- 
      <link rel="shortcut icon" href="images/favicon.png"> 
      <link rel="apple-touch-icon" href="images/apple-touch-icon.png"> 
     --> 
     <link href="dist/css/select2.min.css" type="text/css" rel="stylesheet" /> 
     <link href="jqueryMobile/jquery.mobile-1.4.5.css" rel="stylesheet"> 
     <link rel="stylesheet" href="css/main.css"> 

    </head> 
    <body style="display: none;"> 
     <div data-role="page" id="page"> 
      <div data-role="content" style="padding: 15px"> 
      <label for="id_label_multiple"> 
       Click this to highlight the multiple select element 

       <select class="js-example-basic-multiple js-states form-control" id="id_label_multiple" multiple="multiple"> 
       <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> 
      </label> 
      </div> 
     </div> 

     <script src="dist/js/jquery.js"></script> 
     <script>window.$ = window.jQuery = WLJQ;</script> 
     <script src="jqueryMobile/jquery.mobile-1.4.5.js"></script> 
     <script src="dist/js/select2.min.js"></script> 
     <script> 
        $('.js-example-basic-multiple').select2(); 

     </script> 


     <script src="js/initOptions.js"></script> 
     <script src="js/main.js"></script> 
     <script src="js/messages.js"></script> 
    </body> 

+0

es funktioniert gut Vanya. Ui und Funktionalität funktioniert alles gut. aber wenn ich versuche zu integrieren nichts passiert –

+0

ich versuche zu integrieren in meinem Projekt nichts passiert. Standardauswahl nur kommen –

+0

Integration mit was, andere Dateien? Versuchen Sie, den Cache zu löschen. –