Алгоритм выведения двух одинаковых элементов на странице?

[AleninK]

Добрый день, подскажите пожалуйста, как вывести 2 одинаковых элемента - допустим 2 поиска(в шапке и в футере). Если просто копипастить - у них одинаковый id и ругается w3c валидатор - как правильно меняется id у второго поиска? В контроллере? Буду благодарен если распишите поэтапно, что бы не выстрелить себе в ногу забыл что нибудь.

PS: визуально 2 поиска реализовал, всё работает, js поправил - последнее что осталось - одинаковые id.

Змінено 20 лютого 2020 користувачем AleninK

[LTRay]

Что подразумевается под элементом?

[AleninK]

Только что, LTRay сказал:

Что подразумевается под элементом?

<?php echo $search; ?> у меня выведен в двух местах - в header\footer. Верстку в шаблонах tpl воправил, в common.js тоже. Но теперь у двух поисков один и тот же id. w3c выдает ошибку.

[LTRay]

Продублируйте в контроллере

[AleninK]

1 минуту назад, LTRay сказал:

Продублируйте в контроллере

В контроллере header.php и footer.php?

Или вы имеете ввиду полностью продублировать search.php и дать ему id search2?

Змінено 20 лютого 2020 користувачем AleninK

[LTRay]

В зависимости от того где нужно. Ну и шаблон новый также

[AleninK]

4 часа назад, LTRay сказал:

В зависимости от того где нужно. Ну и шаблон новый также

Поправьте если я не прав: попробовал вывести  -  и не получилось.

 

Создание дубликата и вывод в контроллере
 

$data['search'] = $this->load->controller('common/search');  /// в контроллере header

$data['search'] = $this->load->controller('common/searchmobile');

Создаю шаблон searchmobile.php в контроллере

<?php
class ControllerCommonSearchMobile extends Controller {
	public function index() {
		$this->load->language('common/search');

		$data['text_search'] = $this->language->get('text_search');

		if (isset($this->request->get['search'])) {
			$data['search'] = $this->request->get['search'];
		} else {
			$data['search'] = '';
		}

		return $this->load->view('common/searchmobile', $data);
	}
}

Создаю шаблон seacrhmobile.tpl во view

<div id="searchmobile" class="input-group"> /// старый id search - новый searchmodile
  <input type="text" name="search" value="<?php echo $search; ?>" placeholder="<?php echo $text_search; ?>" class="form-control input-lg" />
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-lg"><i class="fa fa-search"></i></button>
  </span>
</div>

Вывожу $search в header.tpl

 

В итоге двум поискам на сайте задается один и тот же id - searchmobile. И так как у второго поиска новый id

Змінено 20 лютого 2020 користувачем AleninK

[LTRay]

2 раза одно и тоже присваиваете search

[fanatic]

как вариант. вместо идентификатора сделать класс search

и подправить js 

как-то так

    $('.search input[name=\'search\']').parent().find('button').on('click', function () {
        var url = $('base').attr('href') + 'index.php?route=product/search';

        var value = $(this).parent().prev().val();

        if (value) {
            url += '&search=' + encodeURIComponent(value);
        }

        location = url;
    });

    $('.search input[name=\'search\']').on('keydown', function (e) {
        if (e.keyCode == 13) {
            $(this).next().find('button').trigger('click');
        }
    });

 

[AleninK]

11 часов назад, fanatic сказал:

как вариант. вместо идентификатора сделать класс search

и подправить js 

как-то так

    $('.search input[name=\'search\']').parent().find('button').on('click', function () {
        var url = $('base').attr('href') + 'index.php?route=product/search';

        var value = $(this).parent().prev().val();

        if (value) {
            url += '&search=' + encodeURIComponent(value);
        }

        location = url;
    });

    $('.search input[name=\'search\']').on('keydown', function (e) {
        if (e.keyCode == 13) {
            $(this).next().find('button').trigger('click');
        }
    });

 

Спасибо, я думал об этом, но боялся нарушить саму архитектуру opencart. Наверное так и сделаю.