Я просмотрел каждый ответ, который я могу найти здесь, и не могу решить это. Я почти уверен, что не пропустил ничего очевидного.
Я пытаюсь загрузить маркеры карт на основе long long. Проблема в том, что когда я пытаюсь вернуть ответ AJAX, поскольку responseXML всегда имеет значение null, если я использую responseText, он работает нормально, но, очевидно, следующий шаг не работает.
Это PHP, который генерирует XML:
<?php header('Content-type: text/xml'); ?> <?xml version="1.0" encoding="ISO-8859-1"?> <properties> <![CDATA[ <?php if ($body != null): foreach ($body as $property): ?> <property> <lat><?php echo $property -> lat; ?></lat> <long><?php echo $property -> long; ?></long> <name><?php echo $property -> property_name; ?></name> </property> <?php endforeach; endif; ?> ]]> </properties> Я вижу в Fiddler, что запрос сделан одобренным
GET /letsgo/index.php/hotmaps/get_properties_ajax/22.270888501350186/22.288560098193066/114.13720860290528/114.19827713775635 HTTP / 1.1
Entity Content-type: text / xml
Хотя, когда я рассматриваю это в представлении XML в скрипаче, он кажется пустым,
вот сырой ответ
HTTP/1.1 200 OK Date: Tue, 15 Jan 2013 11:04:27 GMT Server: Apache/2.4.2 (Win32) PHP/5.4.4 X-Powered-By: PHP/5.4.4 Expires: Thu, 19 Nov 1981 08:52:00 GMT Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0 Pragma: no-cache Content-Length: 310 Keep-Alive: timeout=5, max=100 Connection: Keep-Alive Content-Type: text/xml <?xml version="1.0" encoding="ISO-8859-1"?> <properties> <![CDATA[ <property> <lat>22.2776</lat> <long>114.173</long> <name>Kaxo Tower test</name> </property> <property> <lat>22.2803</lat> <long>114.16</long> <name>Kuno Tower</name> </property> ]]> </properties>
Вот функция маркера create, которая вызывается каждый раз, когда карта перемещается
// make the ajax request function loadXMLDoc(downUrl){ var xmlhttp; if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { //var propertiesXml = xmlhttp.responseText; // WORKS FINE!! var propertiesXml = xmlhttp.responseXML; // ALWAYS null //alert(propertiesXml); var propertiesRows = propertiesXml.getElementsByTagName("property"); for (var i = 0; i < propertiesRows.length; i++) { var propertiesRow = propertiesRows[i]; var xmlLat = propertiesRow.getElementsByTagName("lat")[0]; var xmlLong = propertiesRow.getElementsByTagName("long")[0]; var propertyLatLong = new google.maps.LatLng(parseFloat(xmlLat.firstChild.data),parseFloat(xmlLat.firstChild.data)); // create each marker createMarker(propertyLatLong); } } } xmlhttp.open("GET", downUrl, false); // false or true? makes no difference xmlhttp.setRequestHeader("Content-type", "text/xml"); xmlhttp.send(); }
и это ошибка, которую я получаю для загрузки getElementsByTagName с нулевым значением, консоль Chrome говорит
Uncaught TypeError: Невозможно вызвать метод 'getElementsByTagName' из null
Это работает на моем локальном Apache
Какие-либо предложения?
/ ** ОБНОВЛЕНИЕ – КОД РАБОТЫ ** /
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } </style> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=APIKEYHERE&sensor=false"> </script> <script type="text/javascript"> // initialise map function initialize() { // set starting latlong var myLatlng = new google.maps.LatLng(22.2776, 114.173); // set initial map options var mapOptions = { center: myLatlng, zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP }; // create the map var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); // listen for changes in map bounds - after map has stopped moving!! google.maps.event.addListener(map,'idle', function () { loadByBounds(map); }); } // if the bounds have changed function loadByBounds(map) { var bounds = map.getBounds(); var swPoint = bounds.getSouthWest(); var nePoint = bounds.getNorthEast(); // specific co ordinates var swLat = swPoint.lat(); var swLng = swPoint.lng(); var neLat = nePoint.lat(); var neLng = nePoint.lng(); var downUrl = "<?php echo site_url('hotmaps/get_properties_ajax'); ?>/"+swLat+"/"+neLat+"/"+swLng+"/"+neLng; // load the loadXMLDoc(downUrl, map); // clear icons outside of bounding box //.... } // make the ajax request function loadXMLDoc(downUrl, map){ var xmlhttp; if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { var propertiesXml = xmlhttp.responseText; // WORKS FINE!! // remove whitespaces from start and end (.trim() doesnt work) propertiesXml = propertiesXml.replace(/^\s+|\s+$/g,''); // manually parse to XML DOM object var parser = new DOMParser(); var xmlDoc; try { xmlDoc = parser.parseFromString (propertiesXml, "text/xml"); } catch (e) { alert ("XML parsing error."); return false; }; //console.log(xmlDoc); // get each property var propertiesRows = xmlDoc.getElementsByTagName("property"); //alert(console.log(propertiesRows)); for (var i = 0; i < propertiesRows.length; i++) { var propertiesRow = propertiesRows[i]; var xmlLat = propertiesRow.getElementsByTagName("lat")[0]; var xmlLong = propertiesRow.getElementsByTagName("long")[0]; var propertyLatLong = new google.maps.LatLng(parseFloat(xmlLat.firstChild.data),parseFloat(xmlLong.firstChild.data)); // create each marker createMarker(propertyLatLong, map); } } } xmlhttp.open("GET", downUrl, false); xmlhttp.setRequestHeader("Content-type", "text/xml"); xmlhttp.send(); } // create new markers function createMarker(propertyLatLong, map){ var dynamicMarker = new google.maps.Marker({ map:map, draggable:false, position: propertyLatLong }); debugger; } </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width:100%; height:100%"></div> </body> </html>
Вы можете попробовать самостоятельно разобрать XML:
var parser = new DOMParser(); var xmlDoc = parser.parseFromString(xmlhttp.responseText, "application/xml");
Как это.
ваши теги находятся в секции CDATA, поэтому они игнорируют в качестве тега парсер.
Интересно, почему вы хотите, чтобы синтаксический анализатор пропустил почти весь ваш блок ответа HTTP, кажется, что нет необходимости, он не содержит ничего, что могло бы быть неверно истолковано. Это даже данные, которые вы хотите разобрать, что вы скрываете в своем примере без видимых причин.
Посмотрите здесь некоторое объяснение CDATA: http://www.w3schools.com/xml/xml_cdata.asp
Вы можете попробовать прокомментировать заявление об открытии и закрытии CDATA, как указано здесь: http://de.selfhtml.org/html/xhtml/unterschiede.htm
Они также заявляют, что парсер XML предполагает кодировку UTF-8 по умолчанию и откажется от синтаксического анализа, если он не настроен правильно, и что перезапись ожидаемого типа с помощью заголовка ответа не рекомендуется.
Я предпочитаю не открывать и закрывать php-блоки внутри блочных операторов так, как вы это делали, но я не совсем обновляюсь с последними соглашениями о кодировании, поэтому я могу ошибаться в этом.
<?php header('Content-type: text/xml'); header ('Cache-Control: no-cache'); header ('Cache-Control: no-store' , false); $response ='<?xml version="1.0" encoding="UTF-8"?> <properties>'; if ($body != null): foreach ($body as $property): $response .='<property> <lat>'.$property->lat.'</lat> <long>'.$property->long'.</long> <name>'.$property->property_name.'</name> </property>'; endforeach; endif; $response .='</properties>'; echo responseText; ?>