2012-07-31 2 views
0

내 장바구니 내가 쇼핑 카트에 해당 제품을 추가하기위한 제품에 사용자가 버튼을 보여주고 싶습니다 여기에 http://jsfiddle.net/bkw5p/48/버튼이

된 장바구니에 제품을 추가합니다. 예 : 제품에서 버튼을 클릭하면 장바구니로 드래그하는 대신 카트에 추가해야합니다. 해당 제품을 장바구니에 추가하려면 버튼이 필요합니다.

시도했지만 시도 할 수 없습니다. 친절 가능한 한 빨리

덕분에이 문제를 해결하는 데 도움이 및

s.varun

+2

힌트 : 버튼 클릭에 대한 코드에서'onDrop' 핸들러와 거의 동일 할 것이다 암호. – darksky

답변

2

가 타격 코드를 사용하고 그것을 시도 아래이

솔루션입니다 시도

<a data-role="link" href="javascript:linkHandler('<%= obj.productname %>', '<%= obj.price %>')" class="get" >Add <a> 



function linkHandler(name, price) 
{ 
    alert(name); 
    alert(price); 
    var name = name; 
    var price = price; 
    var cartItem = new item(name, parseFloat(price)); 
      // check duplicate 
      var match = ko.utils.arrayFirst(viewModel.cartItems(), function(item){ return item.name == name; }); 
      if(match){ 
       match.qty(match.qty() + 1); 
      } else { 
       viewModel.cartItems.push(cartItem); 
var rowCount = document.getElementById("cartcontent1").getElementsByTagName("TR").length; 
document.getElementById("Totala").innerHTML = rowCount; 
      } 
} 
3

@ClarkeyBoy에 관하여 - 나는하기 Varun 꽤 실제로 가게 '작업'의 제작에 대해 물어 생각하지 않습니다 이 단계. darksky와 같은 것을 이해했다면 드롭 기능과 동일한 작업을 수행하는 버튼을 추가하는 것입니다. 나는 'http://jsfiddle.net/joevallender/VTtUr/6

(아래 설명에 따라) JS 바이올린 최신 상태로

편집 더 허용하는 드래그 핸들로 IMG를 사용하여 http://jsfiddle.net/joevallender/VTtUr/4/ :

내가 여기서 일하기 위해 바이올린을 해킹했습니다 easyui 대신 일반 jQuery UI를 사용하는 것이 좋습니다. 전자는 핸들 http://forum.jquery.com/topic/how-do-i-prevent-dragging-when-a-button-is-clicked-within-the-draggable-container

약간의 리팩토링하고 '장바구니에 추가'기능에 대한 선택을 제외하고 모든 것을 할 수있는 '취소'옵션을 가지고 있습니다 가능한 내 다른 이벤트

그래서 사용할 수 있습니다
function addToCart(source) { 
    var name = source.find('p:eq(0)').html(); 
    var price = source.find('p:eq(1)').html(); 
    var cartItem = new item(name, parseFloat(price.split('$')[1])); 
    var match = ko.utils.arrayFirst(viewModel.cartItems(), function(item) { 
     return item.name == name; 
    }); 
    if (match) { 
     match.qty(match.qty() + 1); 
    } else { 
     viewModel.cartItems.push(cartItem); 
     var rowCount = document.getElementById("cartcontent1").getElementsByTagName("TR").length; 
     document.getElementById("Total").innerHTML = rowCount; 
    } 
} 

드롭에 의해

$('.cart').droppable({ 
    onDrop: function(e, source) { 
     addToCart($(source)); 
    } 
}); 

내가가는 아니에요

$('.item .add-to-cart').click(function() { 
    addToCart($(this).parent()); 
}); 

을 클릭 g 당신이 여전히 테스트하고 엉망이고 특정 답변을 원한다는 것을 알 수 있기 때문에 나머지 코드의 특성을 파악하기 시작합니다.

+0

드래그 앤 드롭이 작동하지 않습니까 ?? 내 예제에서는 –

+0

드래그 앤 드롭과 버튼이 모두 작동합니다. 그것을 시도하십시오 http://jsfiddle.net/joevallender/VTtUr/4/ – joevallender

+0

예를 들어, (qeasyui를 사용하기 때문에) 버튼 작동이 허용되도록 드래그해야합니다 – joevallender