2017-12-18 8 views
0

Bootstrapを使用してdatepickerとjQueryのダイアログ機能を使用する必要があります。それがに隠された作り、「Caricamento pagina」ダイアログを作るために、私は結果に到達することはできませんdatepickerとjQueryのダイアログ機能を同時に使用する

$(function(){ 

    dialog_info = $("#dialog").dialog({ 
      autoOpen: false, 
      resizable: false, 
      height: "auto", 
      width: 300, 
      modal: true 

     }); 

    }); 

<div id="dialog" title="Caricamento pagina"> 
    <p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span><span id="warn_message"></span></p> 
</div> 

:JSPの体内で

<link rel="stylesheet" href="resources/bootstrap.3.3.7/css/bootstrap.min.css"/> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="resources/bootstrap.3.3.7/js/bootstrap.min.js"></script> 


<link href="resources/css/font-awesome-4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
<script src="resources/jquery_ui/jquery-ui.min.js"></script> 

<link href="resources/css/tables.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/buttons.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/forms.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/style.css" rel="stylesheet" type="text/css" /> 

<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 


<!-- for the date --> 
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" /> 
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.min.css" /> 

<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script> 

:これを行うには、私はこれらのリンクを使用しました$(function)のコードが機能しないため、最初と最後にそれを表示します。結果なし、

$(document).ready(function() { 
    dialog_info = $("#dialog").dialog({ 
      autoOpen: false, 
      resizable: false, 
      height: "auto", 
      width: 300, 
      modal: true 

     }); 

    } 
) 

(同じでなければならない):私はまた試み。おそらく上記のリンクに互換性の問題がありますか?リンクは、上記示したように、必要な

<link rel='stylesheet' href='webjars/bootstrap/3.2.0/css/bootstrap.min.css'>  
<script type="text/javascript" src="webjars/jquery/2.1.1/jquery.min.js"></script> 
<script type="text/javascript" src="webjars/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
<link href="resources/css/tables.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/buttons.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/forms.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/style.css" rel="stylesheet" type="text/css" /> 
<link href="resources/css/font-awesome-4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
<script src="resources/jquery_ui/jquery-ui.min.js"></script> 

しかし、最初のページに、私は日付ピッカーを必要とする:日付ピッカーが必要とされていない別のページ、コードはこれらのリンクと連携して、それを考えてみましょう。助けてください。前もって感謝します。

+0

最初のコードブロックでjQueryを2回呼び出しています – disinfor

+0

固定フォーマットとスペルの問題 – DiskJunky

答えて

0

すべてのリンクされたファイルをローカルフォルダに配置し、jspをローカルにリンクする問題を解決しました。それらがいつでもロードされていないとします。

関連する問題