jQueryダイアログボックスがDatepickerと連携していません

Question

jqueryダイアログボックスを開こうとしていますが、jquery datepickerも使用しています。日付ピッカー用の2つのjqueryスクリプトを削除すると、ダイアログが開き、それ以外の方法では機能しません。誰も私にこれらのdatepickerスクリプトで動作することができるダイアログボックスの任意のjqueryスクリプトをお勧めします。

javascriptの日付ピッカーコード：

<script src="./jquery.js"></script> 
<script src="./jquery.datetimepicker.js"></script> 
<script>/* 
window.onerror = function(errorMsg) { 
    $('#console').html($('#console').html()+'<br>'+errorMsg) 
}*/ 
$('#datetimepicker').datetimepicker({ 
dayOfWeekStart : 1, 
lang:'en', 
disabledDates:['1986/01/08','1986/01/09','1986/01/10'], 
startDate: '1986/01/05' 
}); 
$('#datetimepicker').datetimepicker({value:'2015/04/15 05:03',step:10}); 

$('.some_class').datetimepicker(); 

$('#default_datetimepicker').datetimepicker({ 
    formatTime:'H:i', 
    formatDate:'d.m.Y', 
    //defaultDate:'8.12.1986', // it's my birthday 
    defaultDate:'+03.01.1970', // it's my birthday 
    defaultTime:'10:00', 
    timepickerScrollbar:false 
}); 

$('#datetimepicker10').datetimepicker({ 
    step:5, 
    inline:true 
}); 
$('.datetimepicker_mask').datetimepicker({ 
    mask:'9999/19/39 29:59' 
}); 

$('#datetimepicker1').datetimepicker({ 
    datepicker:false, 
    format:'H:i', 
    step:5 
}); 
$('#datetimepicker2').datetimepicker({ 
    yearOffset:222, 
    lang:'ch', 
    timepicker:false, 
    format:'d/m/Y', 
    formatDate:'Y/m/d', 
    minDate:'-1970/01/02', // yesterday is minimum date 
    maxDate:'+1970/01/02' // and tommorow is maximum date calendar 
}); 
$('#datetimepicker3').datetimepicker({ 
    inline:true 
}); 
$('#datetimepicker4').datetimepicker(); 
$('#open').click(function(){ 
    $('#datetimepicker4').datetimepicker('show'); 
}); 
$('#close').click(function(){ 
    $('#datetimepicker4').datetimepicker('hide'); 
}); 
$('#reset').click(function(){ 
    $('#datetimepicker4').datetimepicker('reset'); 
}); 
$('#datetimepicker5').datetimepicker({ 
    datepicker:false, 
    allowTimes:['12:00','13:00','15:00','17:00','17:05','17:20','19:00','20:00'], 
    step:5 
}); 
$('#datetimepicker6').datetimepicker(); 
$('#destroy').click(function(){ 
    if($('#datetimepicker6').data('xdsoft_datetimepicker')){ 
     $('#datetimepicker6').datetimepicker('destroy'); 
     this.value = 'create'; 
    }else{ 
     $('#datetimepicker6').datetimepicker(); 
     this.value = 'destroy'; 
    } 
}); 
var logic = function(currentDateTime){ 
    if (currentDateTime && currentDateTime.getDay() == 6){ 
     this.setOptions({ 
      minTime:'11:00' 
     }); 
    }else 
     this.setOptions({ 
      minTime:'8:00' 
     }); 
}; 
$('#datetimepicker7').datetimepicker({ 
    onChangeDateTime:logic, 
    onShow:logic 
}); 
$('#datetimepicker8').datetimepicker({ 
    onGenerate:function(ct){ 
     $(this).find('.xdsoft_date') 
      .toggleClass('xdsoft_disabled'); 
    }, 
    minDate:'-1970/01/2', 
    maxDate:'+1970/01/2', 
    timepicker:false 
}); 
$('#datetimepicker9').datetimepicker({ 
    onGenerate:function(ct){ 
     $(this).find('.xdsoft_date.xdsoft_weekend') 
      .addClass('xdsoft_disabled'); 
    }, 
    weekends:['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014'], 
    timepicker:false 
}); 
var dateToDisable = new Date(); 
    dateToDisable.setDate(dateToDisable.getDate() + 2); 
$('#datetimepicker11').datetimepicker({ 
    beforeShowDay: function(date) { 
     if (date.getMonth() == dateToDisable.getMonth() && date.getDate() == dateToDisable.getDate()) { 
      return [false, ""] 
     } 

     return [true, ""]; 
    } 
}); 
$('#datetimepicker12').datetimepicker({ 
    beforeShowDay: function(date) { 
     if (date.getMonth() == dateToDisable.getMonth() && date.getDate() == dateToDisable.getDate()) { 
      return [true, "custom-date-style"]; 
     } 

     return [true, ""]; 
    } 
}); 
$('#datetimepicker_dark').datetimepicker({theme:'dark'}) 


</script> 

jqueryのダイアログボックス：

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <script type="text/javascript"> 
      $(document).ready(function() { 

       $('#wrapper').dialog({ 
        autoOpen: false, 
        title: 'Basic Dialog' 
       }); 
       $('#opener').click(function() { 
        $('#wrapper').dialog('open'); 
//     return false; 
       }); 
      }); 
     </script> 


<button id="opener">Open the dialog</button> 
<div id="wrapper"> 
    <p>Some txt goes here</p> 
</div> 

Answer 1

あなたはjqueryのjsの二回jquery.jsとcode.jquery.com/jquery-1.10.2.jsが含まれています。一番上にそれらの1つを含めて、あなたが得るものを見てください。