Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   jCart. Не работает ajax для динамически созданных товаров. (https://javascript.ru/forum/jquery/26445-jcart-ne-rabotaet-ajax-dlya-dinamicheski-sozdannykh-tovarov.html)

Whitetown 08.03.2012 23:58

jCart. Не работает ajax для динамически созданных товаров.
 
Хочу чтобы список товаров на странице выводился не весь, потому что их может быть слишком много в какой-то категории, а по выбору пользователя: 30..60..90..Все
В первых трех случаях хочу чтобы это были не отдельные страницы
с навигацией вида: первая/предыдущая/1..2..3/следующая/последняя
а кнопка "еще.." которая будет подгружать очередную порцию данных на эту же страницу.
Сделал это с использованием jQuery. Все это замечательно работает.

Потом я прицепил сюда jCart и начались грабли.
для первой порции товаров при нажатии кнопки "добавить в корзину"
все срабатывает как надо. без перезагрузки страницы товары добавляются.

а для тех товаров, что подгрузились потом - товар добавляется, но происходит перезагрузка страницы.

Подскажите, пожалуйста, как добиться правильной работы?

я набросал небольшой пример (для одного товара), который иллюстрирует проблему:
http://www.whitetown.com/jcarttest/1.php

вот содержимое файлов 1.php и 2.php
<html>
<?
	include_once('jcart/jcart.php');
	session_start();
?>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
	<title>Jcart + Jquery</title>
	<script type="text/javascript" src="jquery-1.7.1.min.js"></script>  
	<script type="text/javascript" src="jcart/js/jcart.min.js"></script>

<script>
	function AddContent(doc, st) 
	{
//		alert('#btn'+st);
		$('#btn'+st).hide();
		$.post( "2.php?start="+st, "", success, "html" );
	
	    function success( answer )
		{  
			var div = doc.getElementById('main');
			div.innerHTML += answer;
	    } 
	}


</script>  
</head>
<body>
<? include "2.php"; ?>
<div id="main"></div>

<div id="more"></div>
	
<div id="jcart"><?	$jcart->display_cart(); ?></div>	
	
</body>
</html>



<? if (!$start) $start=1; ?>      
    Page <? echo $start; ?><br>  

	<form method="post" action="" class="jcart">
	<fieldset>
    <input type="hidden" name="my-item-id" value="<? echo $start; ?>" />
    <input type="hidden" name="my-item-name" value="Product <? echo $start; ?>" />
    <input type="hidden" name="my-item-price" value="<? echo $start*10; ?>" />
    <input type="hidden" name="my-item-url" value="" />

    <ul>
      <li><strong>Product <? echo $start; ?></strong></li>
      <li>Price: $<? echo $start*10; ?></li>
      <li>
        <label>Qty: <input type="text" name="my-item-qty" value="1" size="3" /></label>
      </li>
    </ul>

    <input type="submit" name="my-add-button" value="add to cart" class="button" />
	</fieldset>
	</form>	
<br>

	<button id="btn<? echo $start+1; ?>" onclick="AddContent(document, <? echo $start+1; ?>)">Next page JS (<? echo $start+1; ?>)</button>

T-sh 09.03.2012 00:51

<input type="submit" name="my-add-button" value="add to cart" class="button" />

заменить на <input type="button" name="my-add-button" value="add to cart" class="button" />

Whitetown 09.03.2012 08:31

не.. так совсем не работает.
да и форма с товаром - это тот кусок что идет с jCart в поставке, думаю там лучше не менять ничего кроме стилей.


Часовой пояс GMT +3, время: 17:10.