2012-05-02 36 views
5

です。 写真のようにチェックボックスにユーザーがクリックするとき、私はマップ(AJAX)をリフレッシュしたいと思います:<a href="http://www.yiiframework.com/" rel="nofollow noreferrer">Yii framework</a>とYii <a href="http://www.yiiframework.com/extension/egmap" rel="nofollow noreferrer">egmap extension</a>を使用してインタラクティブマップを作成しています.YYとEGMapの拡張機能(Googleマップ)の更新マップは

yii-egmap-screenshot は、私が唯一の次のコードでそれをサーバー側に(ページ全体をリフレッシュ)を行うことができますよ
<?php 
    Yii::app()->clientScript->registerScript('filterscript'," 
     $('#filter_all').click(function() { 
      $(\"input[name='filter\[\]']\").prop('checked', this.checked); 
      window.location.href = 'http://' + window.location.host + window.location.pathname + '?tags=sale,rent,residential,commercial,agricultural'; 
     }); 
     $(\"input[name='filter\[\]']\").click(function() { 
      var tags = '?tags='; 
      var tmp=new Array(); 
      $('#filter_all').prop('checked', !$(\"input[name='filter\[\]']:not(:checked)\").length); 
      $('input[type=checkbox]').each(function() { 
       if (this.checked) 
        tmp.push($(this).val()); 

      }); 
      tags += tmp.join(','); 
      window.location.href = 'http://' + window.location.host + window.location.pathname + tags; 
     }); 
     $('#filter_all').prop('checked', !$(\"input[name='filter\[\]']:not(:checked)\").length); 
    ",CClientScript::POS_READY); 
?> 

そしてマップは、このコードでEGMap拡張子を使用して生成されます。

<?php 

// Get latlong from location-aware web browser saved in cookie 
if (isset($_COOKIE['latlng'])){ 
    list($lat,$long) = explode(',',htmlentities(htmlspecialchars(strip_tags($_COOKIE['latlng'])))); 
}else{ 
    $lat = 3.159553312559541; 
    $long = 101.71481802016604; 
} 
Yii::import('ext.gmap.*'); 

$gMap = new EGMap(); 
$gMap->setJsName('map'); 
$gMap->zoom = 10; 
$mapTypeControlOptions = array(
    'sensor'=>true, 
    'position'=> EGMapControlPosition::LEFT_BOTTOM, 
    'style'=>EGMap::MAPTYPECONTROL_STYLE_DROPDOWN_MENU 
); 

$gMap->mapTypeControlOptions= $mapTypeControlOptions; 
$gMap->setWidth('100%'); 
$gMap->setHeight(500); 
$gMap->setCenter($lat, $long); 

$icon = new EGMapMarkerImage("http://".$_SERVER['HTTP_HOST'].Yii::app()->baseUrl."/images/bighouse.png"); 

$icon->setSize(32, 37); 
$icon->setAnchor(16, 16.5); 
$icon->setOrigin(0, 0); 

// Status label 
$status_type = array(
    0=>'success', 
    1=>'warning', 
    2=>'important', 
    3=>'important', 
); 

$condition = ''; 
$sale_cond = ''; 
$rent_cond = ''; 

if ($match['sale']==='' && $match['rent']==='' && $match['residential']==='' && $match['commercial']==='' && $match['agricultural']===''){ 
    $condition = "AND (
     (MATCH (tags) AGAINST ('sale') 
     AND MATCH (tags) AGAINST ('residential')) 
     OR 
     (MATCH (tags) AGAINST ('rent') 
     AND MATCH (tags) AGAINST ('residential')) 
     OR 
     (MATCH (tags) AGAINST ('sale') 
     AND MATCH (tags) AGAINST ('commercial')) 
     OR 
     (MATCH (tags) AGAINST ('rent') 
     AND MATCH (tags) AGAINST ('commercial')) 
     OR 
     (MATCH (tags) AGAINST ('sale') 
     AND MATCH (tags) AGAINST ('agricultural')) 
     OR 
     (MATCH (tags) AGAINST ('rent') 
     AND MATCH (tags) AGAINST ('agricultural')) 
    )"; 
}else{ 
    if ($match['sale']!=''){ 
     $sale_cond = "MATCH (tags) AGAINST ('sale')"; 
     if ($match['residential']!=''){ 
      $cond[1] = "(".$sale_cond." AND MATCH (tags) AGAINST ('residential'))"; 
     } 
     if ($match['commercial']!=''){ 
      $cond[2] = "(".$sale_cond." AND MATCH (tags) AGAINST ('commercial'))"; 
     } 
     if ($match['agricultural']!=''){ 
      $cond[3] = "(".$sale_cond." AND MATCH (tags) AGAINST ('agricultural'))"; 
     } 
     if ($match['residential']!='' || $match['commercial']!='' || $match['agricultural']!=''){ 
      $sale_cond = implode(' OR ', $cond); 
     } 
    } 
    if ($match['rent']!=''){ 
     $rent_cond = "MATCH (tags) AGAINST ('rent')"; 
     if ($match['residential']!=''){ 
      $cond[1] = "(".$rent_cond." AND MATCH (tags) AGAINST ('residential'))"; 
     } 
     if ($match['commercial']!=''){ 
      $cond[2] = "(".$rent_cond." AND MATCH (tags) AGAINST ('commercial'))"; 
     } 
     if ($match['agricultural']!=''){ 
      $cond[3] = "(".$rent_cond." AND MATCH (tags) AGAINST ('agricultural'))"; 
     } 
     if ($match['residential']!='' || $match['commercial']!='' || $match['agricultural']!=''){ 
      $rent_cond = implode(' OR ', $cond); 
     } 

    } 
    if ($sale_cond!=''){ 
     $condition = 'AND '.$sale_cond; 
     if ($rent_cond!=''){ 
      $condition .= ' OR '.$rent_cond; 
     } 
    }elseif ($rent_cond!=''){ 
     $condition = 'AND '.$rent_cond; 
    } 
} 

$props = Property::model()->findAll('active=1 '.$condition); 
if ($props!==null){ 
    foreach ($props as $prop){ 
     // Prepare status label for info box 
     $status_label='<span class="label label-'.$status_type[(int)$prop['status']].'">'.$list_status[(int)$prop['status']].'</span>'; 
     $prop_photo = ''; 
     $win_height = '110px'; 
     // Check if photo exist 
     if (is_file('images/property/'.$prop['photo'])){ 
      $prop_photo = '<img src="http://'.$_SERVER['HTTP_HOST'].Yii::app()->baseUrl.'/images/property/'.$prop['photo'].'" /><br />'; 
      $win_height = '310px'; 
     } 

     $email_img = '<img src="http://'.$_SERVER['HTTP_HOST'].Yii::app()->baseUrl.'/site/strtoimg?pid='.$prop['id'].'" />'; 

     $view_link = '<div style="float:left"><a href="'.Yii::app()->baseUrl.'/public/view/'.$prop['id'].'">View this property</a></div>'; 
     $edit_link = ''; 
     if (!Yii::app()->user->isGuest && (int)$prop['user_id']===(int)Yii::app()->user->id){ 
      $edit_link = '<div style="float:right"><a href="'.Yii::app()->baseUrl.'/prop/update/'.$prop['id'].'">Edit this property</a></div>'; 
     } 
     $links = '<div>'.$view_link.'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'.$edit_link.'</div>'; 

     $info_window = new EGMapInfoWindow('<div style="height:'.$win_height.'">'. 
       $prop_photo. 
       substr($prop['description'],0,40).'...'.'<br />'. 
       'Price: '.$prop['price'].'<br />'. 
       'Email: '.$email_img.'<br />'. 
       'Tel: '.$prop['contact_phone'].'<br />'. 
       $status_label.' Added: '.$prop['date_upload'].'<br />'. 
       $links. 
       '</div>'); 
     $marker = new EGMapMarker($prop['latitude'], $prop['longitude'], array('title' => $prop['title'],'icon'=>$icon)); 
     $marker->addHtmlInfoWindow($info_window); 
     $gMap->addMarker($marker); 
    } 
} 
$gMap->renderMap(); 

?> 

これらのすべてのコードはビューファイルです。マップは、idがEGMapContainer0のhtml要素のEGMap拡張によって生成されます。任意のアイデアどのようにチェックボックスのクリックのイベントでは、ajaxを介して地図をリフレッシュを達成するために?

ありがとうございました。

答えて

1

私はこのマップで作業していますが、使いやすくて問題はありません。renderPartialでそれを使うことはできません。単にレンダリングしません.Only SolutionはIframeを使用します。 Ajaxの更新単に動作しません。

+0

あなたの答えをありがとう。 renderPartialは実際にはビューファイルにまっすぐには使用しません。 DOMの準備ができたら、EGMapContainer0を何とか操作することはできないでしょうか? –

+0

私はあなたがそれを試して、あなたの所見を与えてくれると言っています。 –

関連する問題