0

сначала я впервые использовал java-скрипт, а также jquery.i Мне нужно выполнить задачу, т.е. на картах Google, когда мы нажимаем на определенную область (многоугольник , circle) infowindow нужно открыть с помощью некоторых стилей. Поэтому я перешел в инфобокс и добавил некоторые css (jquery custom css ui lightness). В этом инфобоксе мне нужно показать календарь с временем. Так что я сделал много RD и написал кодМожно ли использовать jquery-ui-timepicker в инфобоксах карт google

я прописан код с помощью инструментов рисования, инфобокса, JQuery пользовательских CSS, JQuery-щ-timepicker

Теперь моя проблема JQuery-щ-timepicker не поднимая в Infobox. если я использую его в нормальном div, то он работает нормально.

вот некоторые из моего кода:.

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/themes/smoothness/jquery-ui.css" type="text/css" media="all" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script> 
<script type="text/javascript" src="Scripts/jquery-ui-timepicker-addon.js"></script> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('.datetimepicker').datetimepicker({}); 
    }); 
</script> 

var contentString = 
       '<table width="100%"' + 
       '<tr>' + '<td width="18%">From Date:</input></td>' + '<td> <input class="datetimepicker" id="start_time" name="start_time" type="text" /></td>' + '<td width="18%" align="center">To Date:</input></td>' + '<td><input class="datetimepicker" id="end_time" name="end_time" type="text" /></td>' + '</tr>' + 
       '</table>' 

function RaiseInfoWindow() { 
     google.maps.event.addListener(drawingModesType, 'click', function (event) { 
      if (infoBox) 
       infoBox.close(); 
      var bounds = new google.maps.LatLngBounds(); 
      message = GetMessage(drawingModesType); 
      InfoBoxType(InfoBox, message); 
      infoBox.setOptions({ content: message }); 
      infoBox.setPosition(bounds.getCenter()); 
      infoBox.open(map); 
      google.maps.event.addListener(infoBox, 'domready', function() { 
       jQuery("#tabs").tabs(); 
      }); 
     }); 
function GetMessage(polygon) { 
     coordinates = polygon.getPath().getArray(); 
     message = ['<div id="tabs">', '<ul>', '<li><a href="#tab-1" ><span>Modify</span></a></li>', '<li><a href="#tab-2"><span>Save</span></a></li>', '</ul>', 
      '<div id="tab-1">', '<li><div style="color:#000" class="divText" >Approximately area is ' + GetAreaInAcres(polygon) + ' kms</div></li>', '<div class="divbuttonText"><p><input type="button" value="Edit" title="Edit" class="buttonStyle" onclick="ShapeEditable(true);" />' + "  " + '<input type="button" value="Done" title="Done" class="buttonStyle" onclick="ShapeEditable(false);" />' + "  " + '<input type="button" value="Delete" title="Delete" class="buttonStyle" onclick="DeleteShape(drawingModesType);" /></p></div>', '</div>', 
      '<div id="tab-2">', '<p>' + contentString + '</p>', '</div>', '</div>'].join(''); 
     return message; 
    } 

Update

JsFiddle Вот мой Jsfiddle с моим полным кодом (не думаю, что я разозлилась я пытался добавить URL сценария но его не работает. Я видел так много jsfiddles (которые приведены в примерах с jQuery-ui-timepicker addon .js, там тоже одна и та же проблема), поэтому я добавил, что скрипт.my-код начинается с строки 2199.please пренебрегает предыдущими строками)

Update2:

here is my updated fiddle после применения @gaurrav предложения времени выбора является повышением, но это повышение после того, как 2 до 3 щелчков

+0

i see timepicker, работающий с полем ввода, вы можете указать мне на инфобокс, я не могу найти его на карте – Dave

+0

@ Давай, я работаю с полем ввода. Но он не работает внутри infobox.and то, что вы не можете найти его на карте – user595

+0

обычно на карте есть маркер, по щелчку маркера всплывает инфобокс .. так что здесь нет маркера ,, где инфобокс ,, назовите меня к нему – Dave

ответ

0

Infobox создаются dyanamically когда карта нагрузки, так что «$ (». datetimepicker ") 'не сможет найти ваш div. Попробуйте использовать '$ ("body"). Find (".datetimepicker")'.

+0

@ gaurraw5 благодарит за ваш ответ. Добавил find (".datetimepicker") в мой код, но без изменений. – user595

+0

вы можете создать скрипку. –

+0

@ gaurraw5 см. Мой отредактированный код обновлен с помощью JSfiddle – user595

Смежные вопросы