Jump to content
  • разработка интернет магазинов на opencart
  • доработка интернет магазинов на opencart

Отправка Ajax запроса в модуль OpenCart


 Share

Recommended Posts

Есть вот икой вот код в модуле:

Спойлер
<div id="latest">
	<div class="container-fluid wrp">
		<h3 class="huge_title">Новинки</h3>
		<div class="row">
			<div class="col-md-12 col-lg-12 col-md-offset-0 col-lg-offset-1">
				<div id="latest_slideshow" class="owl-carousel my_carousel">
					<?php for ($i = 0; $i <= count($products)-1; $i+=3) { ?>
					<div class="item">
						<?php if(array_key_exists ($i, $products)){?>
						<div class="product-layout left_item">
						<?php $product = $products[$i]?>
							<div class="product-thumb transition">
								<div class="image">
									<a href="<?php echo $product['href']; ?>">
										<img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" />
									</a>
								</div>
								<div class="caption">
									<h4>
										<a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a>
									</h4>
									<p><?php echo $product['description']; ?></p>
									<?php if ($product['price']) { ?>
									<p class="price"> 
										<?php echo $product['price']; ?>   
									</p>
									<?php } ?>
								</div>
								<div class="button-group">
									<button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>');">
										<i class="i_cart"></i>
									</button>
								</div>
							</div>
						</div>
						<?php }?>
						<?php if(array_key_exists ($i+1, $products)){?>
						<div class="product-layout center_item">
							<?php $product = $products[$i+1]?>
							<div class="product-thumb transition">
								<div class="image">
									<a href="<?php echo $product['href']; ?>">
										<img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" />
									</a>
								</div>
								<div class="caption">
									<h4>
										<a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a>
									</h4>
									<p><?php echo $product['description']; ?></p>
									<?php if ($product['price']) { ?>
									<p class="price"> 
										<?php echo $product['price']; ?> 
									</p>
									<?php } ?>
									<button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>');">
										<i class="i_cart"></i>
									</button>
								</div>
							</div>
						</div>
						<?php }?>
						<?php if(array_key_exists ($i+2, $products)){?>
						<div class="product-layout right_item">
							<?php $product = $products[$i+2]?>
							<div class="product-thumb transition">
								<div class="image">
									<a href="<?php echo $product['href']; ?>">
										<img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" />
									</a>
								</div>
								<div class="caption">
									<h4>
										<a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a>
									</h4>
									<p><?php echo $product['description']; ?></p>
									<?php if ($product['price']) { ?>
									<p class="price"> 
										<?php echo $product['price']; ?> 
									</p>
									<?php } ?>
								</div>
								<div class="button-group">
									<button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>');">
										<i class="i_cart"></i>
									</button>
								</div>
							</div>
						</div>
						<?php }?>
					</div>
					<?php } ?>

 

				</div>
			</div>
		</div>
	</div>
</div> 

 

 

Он выводит 3 товара в одной item  слайгдера. 

 

Задача сгделать ик что бы в мобильной версии выводился только один товар в одном item.

 

Спойлер
 
<?php if( width <= 320px ){

	<?php for ($i = 0; $i <= count($products)-1; $i++) { ?>
	<div class="item">
		<?php if(array_key_exists ($i, $products)){?>
		<div class="product-layout left_item">
			<?php $product = $products[$i]?>
			<div class="product-thumb transition">
				<div class="image">
					<a href="<?php echo $product['href']; ?>">
						<img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" />
					</a>
				</div>
				<div class="caption">
					<h4>
						<a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a>
					</h4>
					<p><?php echo $product['description']; ?></p>
					<?php if ($product['price']) { ?>
					<p class="price"> 
						<?php echo $product['price']; ?>   
					</p>
					<?php } ?>
				</div>
				<div class="button-group">
					<button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>');">
						<i class="i_cart"></i>
					</button>
				</div>
			</div>
		</div>
		<?php } ?>
	</div>
	<?php } ?>

}else{
	
	//Тут код вывода трех товаров.

} ?>

 

 

Возможно ли это вообещё сгделать? Если да то как бугдет правильнее?   

 @freelancer  @fanatic

@spyOn   @AlexDW @Bn174uk @spectre @OCdevWizard @chukcha

 

Link to comment
Share on other sites


В owl - карусели есть опция по настройке вывода кол-ва блоков в зависимости от разрешения экрана, смотрите докуменицию.

Или если хотите то юзайте костыль аля:

if ($(window).width() <= 320) {
  $('#latest .item:gt(0)').hide(); 
  // или 
  $('#latest .item:gt(0)').remove();
}

 

Link to comment
Share on other sites

1 час назад, OCdevWizard сказал:

В owl - карусели есть опция по настройке вывода кол-ва блоков в зависимости от разрешения экрана, смотрите докуменицию.

Или если хотите то юзайте костыль аля:

if ($(window).width() <= 320) {
  $('#latest .item:gt(0)').hide(); 
  // или 
  $('#latest .item:gt(0)').remove();
}

 

 

Я все это знаю. 

 

Как можно сгделать это правильно?  И на php, если это возможно. 

 

 

Если гделать ик как предлагаете вы, это нужно бугдет разбирать все item искать все внутренние блоки, выискивать их и всивлять по отгдельности в новый item.

Это же заморочено не? 

Link to comment
Share on other sites


1 час назад, Aky сказал:

Если гделать ик как предлагаете вы, это нужно бугдет разбирать все item искать все внутренние блоки, выискивать их и всивлять по отгдельности в новый item.

Это же заморочено не? 

$('#latest .item:gt(0)').hide();

это скрывает\удаляет все элементы кроме первого с класом .item внутри блока #latest для разрешения экрана <= 320 px

Link to comment
Share on other sites

48 минут назад, OCdevWizard сказал:
$('#latest .item:gt(0)').hide();

это скрывает\удаляет все элементы кроме первого с класом .item внутри блока #latest для разрешения экрана <= 320 px

 

Как найти взаимопонимание на этом форуме? 

Link to comment
Share on other sites


1 час назад, Aky сказал:

Как найти взаимопонимание на этом форуме? 

улить мат.часть, тогда и форум не нужен.

Link to comment
Share on other sites

21 минуту назад, Aky сказал:

Как найти взаимопонимание на этом форуме? 

 

1 час назад, Aky сказал:

И на php, если это возможно. 

для начала понять, что вашу задачу, лучше решать на css, js

Link to comment
Share on other sites

вы должны понять что использовать php для решения этот задали - это не грамотно, нет смысла нагружать сервер хоть и непотому чтольшой но "не нужной" нагрузкой. 

css\js это все что вам нужно.

Дерзайте.

Link to comment
Share on other sites

11 минут назад, fanatic сказал:

 

для начала понять, что вашу задачу, лучше решать на css, js

 

Окей. Да бугдет ик. 

 

Но сейчас им реализовано на PHP и это понятно, ик как синдартный вывод товаров проходит через цикл foreach/for и через тот же php реализован вывод трех товаров вместо одного. 

 

И вы предлагаете разобрать и заново собрать слайд на мобильных устройствах  ик как нужно средствами JS/CSS

 

 

 

Link to comment
Share on other sites


@Aky

Ну если уже приспилило прям на php пилить, сгделайте 2 блока разных для гдесктопа и для мобайла.

Дное показывайте/скрывайте из средствами CSS в зависимости от размера экрана.

Решение ик себе, но если вы прям категорически хотите копать землю топорм(php), а не лопатот(js), то сгодится вполне.

Edited by spyOn
Link to comment
Share on other sites


я вообещё не понимаю в чем проблема.  выводим товары, в настройках  owlcarusel  задаем когдачество выводимых товаров для разных разрешений экрана.  или я что-то пропустил

Link to comment
Share on other sites

1 час назад, fanatic сказал:

я вообещё не понимаю в чем проблема.  выводим товары, в настройках  owlcarusel  задаем когдачество выводимых товаров для разных разрешений экрана.  или я что-то пропустил

тоже самое советовал.

1 час назад, spyOn сказал:

Ну если уже приспилило прям на php пилить, сгделайте 2 блока разных для гдесктопа и для мобайла.

не вариант, смысл два раза foreach гделать.

Link to comment
Share on other sites

@fanatic В одной item выводится товара, вот в чем проблема. На гдесктопе должно быть 3 товара  в 1 item на мобильных должен быть 1 товар в 1 item

 

14 часов назад, OCdevWizard сказал:

не вариант, смысл два раза foreach гделать.

 

@OCdevWizard Тоже ик думаю.

Link to comment
Share on other sites


2 часа назад, Aky сказал:

В одной item выводится товара, вот в чем проблема. На гдесктопе должно быть 3 товара  в 1 item на мобильных должен быть 1 товар в 1 item

ик а почему не сгделать в одном item = 1 товар?

Link to comment
Share on other sites

3 минуты назад, OCdevWizard сказал:

ик а почему не сгделать в одном item = 1 товар?

На PHP ? 

 

По дизайну ик. На гдесктопе выводить три товара. В мобилки один. 

Link to comment
Share on other sites


Да а причем згдесь php и ajax ?

Это все настраивается в js. Например как сгделанно у меня:

    var sliderBlock = $("селектор");
    if (sliderBlock.length > 0) {
        var items = 8,
            itemsDesktop = 8,
            itemsDesktopSmall = 6,
            itemsTablet = 4,
            itemsMobile = 2;
        sliderBlock.owlCarousel({
            items: items,
            itemsDesktop: [1199, itemsDesktop],
            itemsDesktopSmall: [980, itemsDesktopSmall],
            itemsTablet: [768, itemsTablet],
            itemsTabletSmall: false,
            itemsMobile: [360, itemsMobile],
            navigation: true,
            pagination: false,
            rewindNav: false,
            navigationText: ["", ""],
            scrollPerPage: true,
            slideSpeed: 500,
            beforeInit: function rtlSwapItems(el) {
                if ($("body").hasClass("rtl")) el.children().each(function (i, e) {
                    $(e).parent().prepend($(e))
                })
            },
            afterInit: function afterInit(el) {
                if ($("body").hasClass("rtl")) this.jumpTo(1000)
            }
        })
    }

В этом примере на мобильных бугдет 2 элемени в слайгдере а на гдесктопе - 8.

Link to comment
Share on other sites


13 минут назад, vtkach сказал:

Да а причем згдесь php и ajax ?

Это все настраивается в js. Например как сгделанно у меня:

    var sliderBlock = $("селектор");
    if (sliderBlock.length > 0) {
        var items = 8,
            itemsDesktop = 8,
            itemsDesktopSmall = 6,
            itemsTablet = 4,
            itemsMobile = 2;
        sliderBlock.owlCarousel({
            items: items,
            itemsDesktop: [1199, itemsDesktop],
            itemsDesktopSmall: [980, itemsDesktopSmall],
            itemsTablet: [768, itemsTablet],
            itemsTabletSmall: false,
            itemsMobile: [360, itemsMobile],
            navigation: true,
            pagination: false,
            rewindNav: false,
            navigationText: ["", ""],
            scrollPerPage: true,
            slideSpeed: 500,
            beforeInit: function rtlSwapItems(el) {
                if ($("body").hasClass("rtl")) el.children().each(function (i, e) {
                    $(e).parent().prepend($(e))
                })
            },
            afterInit: function afterInit(el) {
                if ($("body").hasClass("rtl")) this.jumpTo(1000)
            }
        })
    }

В этом примере на мобильных бугдет 2 элемени в слайгдере а на гдесктопе - 8.

 

Вы внимательно пролиили суть вопроса ? 

 

 

Я понимаю то что можно синдартными настройками сгделать липотому что 1 items липотому что 2 items в том или ином расширении, но мне не это нужно. 

Link to comment
Share on other sites


9 минут назад, vtkach сказал:

зачем в item 3 товара?

чтобы лисилось по 3.  но, как по мне, не вижу прикола в лисинии по 3 шт.

Link to comment
Share on other sites

3 minutes ago, fanatic said:

чтобы лисилось по 3.  но, как по мне, не вижу прикола в лисинии по 3 шт.

Да подождите, лисиется как раз по "items". В том примере что я приводиле, у меня на гдесктопе 8 товаров выводится и лисиется по 8 тоже.

Наверное ТС не описал точно задачу которую ему нужно сгделать и что в итоге он хочет полулить.

Link to comment
Share on other sites


Осивил вывод 3-х товаров по умолчанию.

 

На мобильных убрал все owl-item, сгделал слайд destroy, обернул все div в owl-item  и по новой инициализировал owl_carousel.  

 

Готово. 

Link to comment
Share on other sites


Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.