如何添加按钮到tpl

我不确定这是否可能，但我有一个应用程序没有按照我的要求做。首先它将数据库中的餐馆列表显示到面板中。如何添加按钮到tpl

tpl: [ 
    '<tpl for=".">', 
     '<div="my_div"><h2>{restaurant_name}</h2></div>', 
    '</tpl>' 
]

这工作正常，并给我一个我的餐厅的列表。现在出现这个问题。我想添加一个按钮，让“my_div”点击另一个面板。我可以使用停靠物品做到这一点，但这种想法不起作用，因为您可以点击任何餐厅并获取他们的信息。

我想我需要以某种方式调用一个事件处理程序（我可以从一个停靠项目工作）。我基本上坚持如何将一个按钮添加到模板，并且sencha帮助对此主题没有用处。

我的事件处理程序是这样的：

var restaurantListHandler = function(button,event){ 
    mainPanel.setActiveItem(restaurantList, {type: 'slide', direction: 'right'}); 
}

感谢

埃里克

来源

2011-03-23 Eric Reynolds

-1

也许你可以使用类似：

onclick="javascript:selectRestaurant(\'{Id}\');"

的股利或（什么我曾经做过）在图像上，并具有全局功能selectRestaurant。
Id然后将是唯一标识餐厅的数据库字段。

来源

2011-04-03 07:05:54 ppeatman

-1用于goto-markers（'javascript：'）的错用和使用突出的js。 – scheffield 2013-09-12 11:38:30

如果我理解正确的话，你正在寻找：

一个按钮添加到您的模板
事件处理程序绑定到该按钮是一个比你不同列表项必绑定到
该按钮必须在列表本身内;它不可能是一个单独的一块
按钮的事件处理程序必须将其路由到一个新的页面，而不是这是它的兄弟姐妹其他列表项的动作

是这一切是真的吗？

如果是的话，我会在你的列表事件处理程序中引入一个条件来检查元素上的类或ID（以最简单/最轻量级为准），并找到它后，让它采取不同的动作，例如，转到您的下一页。有点像jQuery.live（）或其他代表。让我知道你是否需要我详细说明。

如果不是，我会说看看我的3号;按钮是否必须在列表中？如果它与每个项目相关，那么我们会做一件事，但如果没有，我们会想做另一件事。因此，在我能够完全回答之前，我首先需要了解这一点。如果它必须在那里，请参阅上文。如果它不一定在列表中，那么我会将它从列表中取出并声明为新组件。从那里，你应该能够在配置到指定的处理程序，像

items: { xtype: 'button', handler: goAwesomePlaces }

其中goAwesomePlaces是你的处理器。

来源

2011-04-05 19:39:09

您可以使用选项onItemDisclosure of Ext。清单：

http://docs.sencha.com/touch/1-1/#!/api/Ext.List-cfg-onItemDisclosure

的演示是在煎茶触摸厨房水槽下，用户界面/列表/披露：

http://dev.sencha.com/deploy/touch/examples/kitchensink/

var serviceList = new Ext.List({ 
      id: 'servicelist', 
      blockRefresh: true, 
      pinHeaders: false, 
      itemTpl: serviceTemplate, 
      grouped: true, 
      indexBar: false, 
      singleSelect: true, 
      allowDeselect: false, 
      showAnimation: 'slide', 
      store: serviceStore, 
      emptyText: L10N[lang].msg.no_services, 
      multiSelect: false, 
      itemCls: 'servicemain', 
      cls: 'background', 
      onItemDisclosure: function(record, btn, index) { 
      Ext.Msg.alert('Service', 'Name: ' + record.get('service'), Ext.emptyFn); 
     } 
    });

来源

2011-10-14 10:27:13 FuePi

如果你想这样的事情：名单每个项目上都有一个按钮。那么这里是我的执行相同

var asListItemTpl = new Ext.XTemplate(
           '<tpl for=".">', 
           '<div class="sb-section-title">{label}</div>', 
           '<div class="as-button"><input type="button" id="btn{id}" value="btn{id}" width="12px"> </div>', 
           '</tpl>' 
          );

希望这是有道理的。

来源

2012-01-02 09:25:03 thesummersign

如何添加按钮到tpl

回答

相关问题