0

私のドロップダウン リストは、MySQL DB から正しく取り込まれています。

「ホーム」などの 1 つの単語のマーカーを選択すると、開始名と終了名の変数が正しく書き込まれますが、ドロップダウン リストにスペースを含む値がある場合、最初の単語のみが返されるという問題があります。

したがって、「Central Park」がドロップダウンの値である場合、変数は「Central」のみに設定されます

ドロップダウンのコードは次のとおりです。calcroute 関数の JavaScript は次のとおりです。

     <div id="control_panel" style="float:right;width:80%;text-align:left;padding-top:20px">
    <div style="margin:20px;border-width:2px;">
    <b>Start:</b>
    <select id="start">
<?php
  //php code to get data from mysql
    $prodQuery4=mysql_query("SELECT * FROM markers");
    while ($t=mysql_fetch_array($prodQuery4)) {
  //foreach/while to iterate through elements
    echo '<option value='.$t['name'].'>'.$t['name'].'</option>';
    }
  //end of foreach/while
?>    </select>
<br>
    <b>End:</b>
    <select id="end">
 <?php
  //php code to get data from mysql
    $prodQuery4=mysql_query("SELECT * FROM markers");
    while ($t=mysql_fetch_array($prodQuery4)) {
  //foreach/while to iterate through elements
    echo '<option value='.$t['name'].'>'.$t['name'].'</option>';
    }
  //end of foreach/while
?>    </select>
    <b>Waypoints:</b> 
    <select multiple id="waypoints">
<?php
  //php code to get data from mysql
    $prodQuery4=mysql_query("SELECT * FROM markers");
    while ($t=mysql_fetch_array($prodQuery4)) {
  //foreach/while to iterate through elements
    echo '<option value='.$t['name'].'>'.$t['name'].'</option>';
    }
  //end of foreach/while
?>    </select>
      <input type="submit" onclick="calcRoute();">
    </div>

Javascript 関数: 

function calcRoute() {
        var startname = document.getElementById('start').value;
        console.log(startname)
        var endname = document.getElementById('end').value;
        var waypts = [];
        var checkboxArray = document.getElementById('waypoints');
        for (var i = 0; i < checkboxArray.length; i++) {
          if (checkboxArray.options[i].selected == true) {
              $.ajax({
                    url:'phpsearch2.php', 
                    dataType:'json', 
                    data:{name:checkboxArray[i].value},
                    async:false,
                    success:function (result)
                    {
    //              console.log(result)
                    waypoint = new google.maps.LatLng(result[0].lat, result[0].             lng);
            }});
            waypts.push({
                location:waypoint,
                stopover:true});
          }
        }

$.ajax({
    url:'phpsearch2.php', 
    dataType:'json', 
    data:{name:startname},
    async:false,
    success:function (result)
{
//  console.log(result)
    origin = new google.maps.LatLng(result[0].lat, result[0].lng);
}});

$.ajax({
    url:'phpsearch2.php', 
    dataType:'json', 
    data:{name:endname},
    async:false,
    success:function (result)
{
//  console.log(result)
    end = new google.maps.LatLng(result[0].lat, result[0].lng);
}});

    var request = {
            origin: origin,
            destination: end,
            waypoints: waypts,
            optimizeWaypoints: true,
            travelMode: google.maps.DirectionsTravelMode.WALKING
        };

            directionsService.route(request, function(response, status) {
        document.write('<b>'+ origin +'</b>');
          if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
            var route = response.routes[0];
            var summaryPanel = document.getElementById('directions_panel');
            summaryPanel.innerHTML = '';
            // For each route, display summary information.
            for (var i = 0; i < route.legs.length; i++) {
              var routeSegment = i + 1;
              summaryPanel.innerHTML += '<b>Time for a Walkabout </b><br>';
              summaryPanel.innerHTML += '<b>From ' + startname + '   </b>';
              summaryPanel.innerHTML += '<b>to ' + endname + '('+ route.legs[i].distance.text +')</b><br>';
//            summaryPanel.innerHtml += '<b>' + waypts.toString() + '   </b>';
          } 
          }
        });
     }
//}
4

1 に答える 1

2

オプション値の属性を引用していないため、スペースは属性値の終わりを意味します

echo '<option value="'.htmlspecialchars($t['name']).'">'.htmlspecialchars($t['name']).'</option>';
                  //^                                ^
于 2013-04-17T02:27:30.737 に答える