[РЕШЕНО]ajax не дружит с динамическими ссылками, как?

Главные вкладки

Аватар пользователя makbuk makbuk 25 февраля 2017 в 18:38

Я сделал сайт с использование карты Leaflet на которой маркеры - это экологически проблемы, при нажатии на маркер необходимо выводить содержание ноды. Я написал модуль (код ниже) которые загружает ajax содержимое ноды в регионе, он хорошо работает с статическими ссылками Ajax test, problem179 Демо, но плохо работает с маркерами.
Если навести на маркер, появится попап окно с названием ноды, при нажатии на ссылку содержимое ноды должно загрузиться в правой части экрана, но в место этого прогружается некоректный текст. http://drupal.ru/files/marker.png
Заставить загрузиться ноду в нужном регионе можно, для этого нужно навести на нужный маркер появится попап окно (не нажимать на название(ссылку), потом нажать 1-2 раза на ссылки Ajax test или problem179, и после при нажатии на названием ноды в попап окне содержимое прогрузиться в нужном регионе.
Но ВАЖНО если после нажатия ссылок Ajax test или problem179 вы наведете на другой маркер и появится другое попап окно, при нажатии на ссылку будет прогружен некорректный текст.

Кто-то знает как можно устранить этот глюк?

Содержание статических ссылок:

<a class="btn use-ajax" href="node/231">Ajax Test</a>          
<a class="btn use-ajax" href="problem/179">problem179</a>

Содержание ссылок маркеров:
<a class="use-ajax" href="problem/133">Истребление рыбы...</a>

Код модуля:

<?phpfunction test_module_init() {
  drupal_add_library('system', 'drupal.ajax');
  drupal_add_library('system', 'jquery.form');
}

function test_module_menu_alter(&$items) {
  $items['node/%node']['page callback'] = 'test_module_node_page_view';
  $items['problem/%node']['page callback'] = 'test_module_node_page_view';
}

function test_module_node_page_view($node, $type = 'ajax') {
    if ($node->type == 'addproblem') {
        $vnode = node_page_view($node);
        $output = is_string($vnode) ? $vnode : drupal_render($vnode);
      if ($type == 'ajax') {
        $commands = array();
        //$replaceString =  '';
          
        $commands[] = ajax_command_replace('#problemContent', '<div id="problemContent" class=""><div class="block-right-side"><button id="problemContentClose" class="close" type="button">×</button>' . $output . '</div></div></div>');
        $page = array(
          '#type' => 'ajax',
          '#commands' => $commands
        );
        ajax_deliver($page);
      }
      elseif ($nid > 0) {
        drupal_goto('node/' . $nid);
      }
      else {
        $output = '<div id="problemContent" class="">
                    <div class="block-right-side">
                    <button id="problemContentClose" class="close" type="button">×</button>
                    ' . $output . '</div></div></div>';
        return $output;
      }        
      } else {
        return node_page_view($node);
      }
}?>

ВложениеРазмер
Иконка изображения marker.png15.86 КБ

Комментарии

Аватар пользователя makbuk makbuk 3 марта 2017 в 17:10

Кажется я нашел в чем причина, причина в том что ссылки которые появляются на карте динамические. Осталось разобраться как это реализовать.
http://drupal.stackexchange.com/questions/35245/change-href-attribute-in-ajax-enabled-links/52788#52788
Если у кого-то есть живой пример поделитесь, пожалуйста.

Аватар пользователя makbuk makbuk 17 марта 2017 в 12:31

Я нашел решение, для загрузки попап окна я использую модуль IP Geolocation Views & Maps у него есть js файл ip_geoloc_leaflet_goto_content_on_click.js, куда я добавляю строку Drupal.attachBehaviors (); Теперь все работает как положено.

jQuery(document).bind('leaflet.feature', function(event, marker, feature) {
  // marker is the feature just added to the map, it could be a polygon too.
  // feature.feature_id is the node ID, as set by ip_geoloc_plugin_style_leaflet.inc
  // Need to set this up for code below.
  // The same code is used for cross-highlighting. See ip_geoloc_leaflet_sync_content.js
  if (feature.feature_id) {
    marker.feature_id = feature.feature_id;
  }
});

jQuery(document).bind('leaflet.map', function(event, map, lMap) {

  if (map.settings.gotoContentOnClick) {
    for (var leaflet_id in lMap._layers) {
      lMap._layers[leaflet_id].on('click', function(e) {
        var id = e.target ? e.target.feature_id : null;
        if (!id && e.layer) id = e.layer.feature_id;
        if (id) {
            //document.location.href = Drupal.settings.basePath + 'node/' + id;
            document.location.href = Drupal.settings.basePath + 'load_node/' + id;
        }
      });
    }
  }
  if (map.settings.openBalloonsOnHover) {
    for (var leaflet_id in lMap._layers) {
      lMap._layers[leaflet_id].on('mouseover', function(e) {
        this.openPopup();
         Drupal.attachBehaviors(); <<<<--------ДОБАВИЛ ЛИНИЮ
      });
    }
  }

});