Jak możemy zaimplementować funkcjonalność onclick w widoku siatki tytanu pozycji

Question

wyrobiłem GridView aplikacji przy użyciu widżet (od tego Kodeksu)

https://github.com/pablorr18/TiDynamicGrid

mam zmodyfikowany kod, jak na moje wymagania klienta. Teraz, jeśli chcę kliknąć przycisk koszyka na widok elementu listy, zostanie wyświetlony komunikat "Kliknięty". Ale próbowałem w różny sposób. Ale nie mogę znaleźć rozwiązań. Czy ktoś może mi wyjaśnić, w jaki sposób jesteśmy pisać kod dla tego.

Mam następujący kod poniżej w mojej aplikacji:

var items = []; 
var showGridItemInfo = function(e){ 
    alert("Onclick the row"); 
}; 

var delay = (OS_ANDROID) ? 1000:500; 

$.tdg.init({ 
    columns:3, 
    space:5, 
    delayTime:delay, 
    gridBackgroundColor:'#e1e1e1', 
    itemBackgroundColor:'#fff', 
    itemBorderColor:'transparent', 
    itemBorderWidth:0, 
    itemBorderRadius:5, 
    onItemClick: showGridItemInfo 
}); 

function createSampleData(){ 
    var sendit = Ti.Network.createHTTPClient({ 
     onerror: function(e){ 
      Ti.API.debug(e.error); 
      alert('There was an error during the connection'); 
     }, 
     timeout:10000, 
    });   
    sendit.open('GET', url+'android_livedev/client/test.php?action=listitems&categoryid='+subcategorylist_category_id+'&productmin=0&productmax=50'); 

    sendit.send(); 
    sendit.onload = function(){ 
     var response = JSON.parse(this.responseText); 
     if(response[0].success == 0){ 
      alert("No Products Found"); 
     } 
     else { 
      items = []; 
      for (var x=0;x<response[0].data.length;x++){ 
       var view = Alloy.createController('item_layout',{ 
        image:imageurl+response[0].data[x].thumb_image, 
        product:response[0].data[x].product, 
        productprice:"$"+" "+response[0].data[x].price, 
        onItemClick: addcart, 
       }).getView(); 
       var values = { 
        product: response[0].data[x].product, 
        image: response[0].data[x].thumb_image, 
        productid : response[0].data[x].productid, 
       }; 
       items.push({ 
        view: view, 
        data: values 
       }); 
      }; 
      $.tdg.addGridItems(items); 
      reateSampleData(); 

      $.tdg.clearGrid(); 
      $.tdg.init({ 
       columns:nColumn, 
       space:nSpace, 
       delayTime:delay, 
       gridBackgroundColor:'#e1e1e1', 
       itemHeightDelta: 0, 
       itemBackgroundColor:'#fff', 
       itemBorderColor:'transparent', 
       itemBorderWidth:0, 
       itemBorderRadius:5, 
       onItemClick: showGridItemInfo 
      }); 
      createSampleData(); 

     }); 

     $.win.open(); 

Kod item_layout.xml patrzy jak:

<Alloy> 
    <View id="mainView"> 
     <ImageView id="thumb"/> 
     <Label id="product"></Label> 
     <Label id="productprice"></Label> 
     <Button id="addcart" onClick="additemtocart"/> 
    </View> 
</Alloy> 

EDIT:

teraz otrzymuję widok i identyfikator przycisku z tego określonego widoku. Ale jeśli spróbuję kliknąć przycisk, nie można tego zrobić. możesz sprawdzić mój kod i podać rozwiązanie.

dodałem poniższy kod:

var view = Alloy.createController('item_layout',{ 
     image:imageurl+response[0].data[x].thumb_image, 
     product:response[0].data[x].product, 
     productprice:"$"+" "+response[0].data[x].price 
    }).getView(); 
    var controller = Alloy.createController('item_layout'); 
    var button = controller.getView('addcart'); 
    button.addEventListener('click', function (e){ 
    alert("click"); 
    Ti.API.info('click'); 
    }); 

Answer 1

pierwszy przełącznik identyfikatory klas, ponieważ są one non-unikalny. Używaj tylko identyfikatorów, jeśli musisz. Po drugie, spróbuj coś takiego:

spróbować czegoś takiego:

$('.addCart').click(function() { 
    var item = $(this).silblings('.product').text; 
    addItemToCart(item); 
}); 

Jeszcze lepiej, dodać atrybut data-productId przycisku Koszyk i można zrobić coś takiego:

$('.addCart').click(function() { 
    var itemId = $(this).attr('data-productId'); 
    addItemToCart(itemId); 
}); 

Jest to o tyle lepsze, że potrzebujesz tylko przycisku koszyka na zakupy na ekranie.

Wszystko to powiedziawszy, prawdopodobnie będziesz musiał dołączyć element zastępczy, który dodaje element do koszyka, gdy javascript nie jest dostępny na stronie.