пошагово - тяжеловато. Голова уже другой задачей занята. Честно: само всплывающее окно взяла здесь на форуме, и доработала.
Подключаем js
<script type="text/javascript" src="templates/<?php echo $cur_template; ?>/interface.js"></script>
<script type="text/javascript" src="templates/<?php echo $cur_template; ?>/jQuery.js"></script>
Кнопка в модуле "сравнение" правиться так чтобы:
<a title="Сравнивать выбранные товары" alt="Сравнивать выбранные товары" onclick="load();">Сравнивать выбранные товары</a>
<script type="text/javascript">
function load () {
//var obj = document.getElementById("spid").name;
//alert (obj);
jQuery("#spid").load('
http://www.dilectus.org/index.php?option=com_virtuemart&page=shop.compare&compare_type=1&no_html=1'); return false;
}
</script>
У меня еще jQuery конфликтовала с mootools, поэтому в
начале функций прописала:
<script type="text/javascript">
jQuery.noConflict();
</script>
Далее делаем блок, куда будем вставлять сравнение:
у меня:
<div id="spid" class=nub name="mu"></div>
Ему прописываете свойства нужные.
Результат: при нажатии на кнопке - сравнение в диве spid.
Чтобы при сбрасывании чекбоксов сравнение не перескакивало в основной блок на странице:
Правим чекбокс на
<input type="checkbox" class="compare2_checkbox" onclick="return CompareProduct2( this,1);" checked="checked" title="Сравнить товар" alt="Сравнить товар" id="compare2_cart_2" name="compare2_2">
В vm_comparison.js (/modules/mod_virtuemart_comparison/vm_comparison)
function CompareProduct2(el, type_id) {
var Product_ID = el.name;
Product_ID = Product_ID.replace("compare2_","");
//alert("ДО: productID="+Product_ID+" ProductsInCart.length="+ProductsInCart.length);
if (el.checked && CompareTypeID != -1 && type_id!=CompareTypeID) {
alert("нельзя сравнивать товары разного типа!");
return false;
}
else if (el.checked && ProductsInCart.length>=MaxProductToCompare) {
alert("Нельзя сравнивать более " + MaxProductToCompare + " продуктов одновременно");
return false;
}
else if (el.checked) {
CompareTypeID = type_id;
AddCompare(Product_ID);
}
else {
RemoveCompare2(Product_ID);
RemoveComparePage2(Product_ID);
}
//alert("ПОСЛЕ: productID="+Product_ID+" ProductsInCart.length="+ProductsInCart.length);
return true;
}
function RemoveCompare2(product) {
//alert(product);
removeByElement(ProductsInCart,product);
if (ProductsInCart.length<=0) CompareTypeID=-1;
//alert(ProductsInCart.length);
//alert(ProductsInCart[0]);
var frm= $("frmProductCompare");
//var ss= document.getelementbyid('spid');
frm.product_id.value=product;
frm.func.value="comparisonDelete";
load();
handleUpdateCompare(frm);
//handleUpdateCompare(ss);
}
function RemoveComparePage2(product) {
//alert(product);
removeByElement(ProductsInCart,product);
var page;
if (ProductsInCart.length<=0){ CompareTypeID=-1; page = "shop.browse";}
else page = "shop.compare";
//alert(ProductsInCart.length);
var frm= $("frmProductCompare");
var ss= $("spid");
// не верно null var tt= $("mu");
frm.product_id.value=product;
frm.func.value="comparisonDelete";
frm.page.value=page;
frm.compare_type.value = CompareTypeID;
//frm.submit();
load();
handleUpdateCompare2(frm);
//alert ($("#spid").name);
}
function handleUpdateCompare2( frm ) {
load();
var callback = function(responseText) {
updateComparison2()
//$("Compare_Thumb_Container").innerHTML=responseText;
ToggleCompareCheck(false);
}
var opt = {
method: "post",
data: frm,
onComplete: callback,
evalScripts: true
}
ToggleCompareCheck(true);
new Ajax(frm.action, opt).request();/**/
}
function updateComparison2() {
var callbackCart = function(responseText) {
carts = $$( '.vmComparisonModule' );
if( carts ) {
try {
for (var i=0; i<carts.length; i++){
carts
.innerHTML = responseText;
color = carts.getStyle( 'color' );
bgcolor = carts.getStyle( 'background-color' );
if( bgcolor == 'transparent' ) {
// If the current element has no background color, it is transparent.
// We can't make a highlight without knowing about the real background color,
// so let's loop up to the next parent that has a BG Color
parent = carts.getParent();
while( parent && bgcolor == 'transparent' ) {
bgcolor = parent.getStyle( 'background-color' );
parent = parent.getParent();
}
}
var fxc = new Fx.Style(carts, 'color', {duration: 1000});
var fxbgc = new Fx.Style(carts, 'background-color', {duration: 1000});
fxc.start( '#222', color );
fxbgc.start( '#fff68f', bgcolor );
if( parent ) {
setTimeout( "carts[" + i + "].setStyle( 'background-color', 'transparent' )", 1000 );
}
}
} catch(e) {}
}
}
option = { method: 'POST', onComplete: callbackCart }
new Ajax('index2.php?only_page=1&page=shop.comparison_short&option=com_virtuemart', option).request();
}
По-моему все.
Важно!: в ИЕ не работает (выдает ошибку на строке: var frm= $("frmProductCompare"); он ее НЕ понимает и элемент не находит). Кто поможет найти ошибку, буду признательна.
Как справиться с этой ошибкой и что она значит?
Я в js совсем плоха, а с jquery встретилась первый раз...
13.06.2013, 01:04:46