这是一个搜索框模块(经过大量清理以满足老板)。除more
事件外,这一切都有效。我得到了结果,它们出现了,而且#34;加载更多" div出现了。
点击more
后,我希望search
事件重新运行。在more
中,我做了一些简单的会话计算,我需要将其传递给search
事件,该事件有效。 click()
没有。
我已尝试将more
事件移至search
事件之外,但未成功。
This fiddle seems to work, albeit with the node ID instead
define([
'dojo/dom',
'dojo/dom-construct',
'dojo/on',
'dojo/query'
'dojo/domReady!'
], function(
dom,
domConstruct,
on,
query
) {
var search = {
display: function(){
sb = '<div id="searchWrapper" class="searchWrapper"><h3>Search</h3>
<input id="searchString" type="text" />';
sb += '<h3>Search</h3><select id="sBy">';
sb += '<option value="0">Choose...</option>';
sb += '<option value="f">Foo</option>';
sb += '<option value="b">Bar</option>';
sb += '<option value="fb">Foo & Bar</option>';
sb += '</select>';
sb += '<div class="searchBtn">
<button type="button" id="search">Search</button></div>';
sb += '</div>';
domConstruct.place(sb, dom.byId('body'), 1);
on(dom.byId('search'), 'click', function(e){
var r = thisIsWhereDataIsRetrieved(params, whatever);
// r is the response from the db call
if(typeof r === 'object'){
var sr = 'here are the results!';
for (var result in r) {
sr += 'this particular result';
}
if(r.length === 50) {
sr += '<div id="more" class="more">Load More</div>';
}
domConstruct.place(sr, dom.byId('searchWrapper'), 'last');
}
on(query('.more'), 'click', function(e){
// get next results having done stuff
// to track the state of the search, which works
dom.byId('search').click(); <<<<< not working
});
});
}
}
return search;
});
编辑:我通过在thisIsWhereDataIsRetrieved
事件中重新调用more
并在more
节点之前追加下一个结果来解决这个问题,但看起来似乎仍然如此。我最好做我能做的事情!
EDIT2:添加了more
节点!
答案 0 :(得分:1)
除了匿名功能外,您还需要使用其他功能 例如,像这样: (注意你可能需要一个比实际方法更好的结构,如果你没有正确清理dom,使用查询可能会产生副作用。我鼓励你写一个合适的小部件并使用附加点)
define([
'dojo/dom',
'dojo/dom-construct',
'dojo/on',
'dojo/query'
'dojo/domReady!'
], function(
dom,
domConstruct,
on,
query
) {
var search = {
display: function() {
sb = '<div id="searchWrapper" class="searchWrapper"><h3>Search</h3>
<input id="searchString" type="text" />';
sb += '<h3>Search</h3><select id="sBy">';
sb += '<option value="0">Choose...</option>';
sb += '<option value="f">Foo</option>';
sb += '<option value="b">Bar</option>';
sb += '<option value="fb">Foo & Bar</option>';
sb += '</select>';
sb += '<div class="searchBtn">
<button type="button" id="search">Search</button></div>';
sb += '</div>';
domConstruct.place(sb, dom.byId('body'), 1);
var onSearchClick = function(e) {
var r = thisIsWhereDataIsRetrieved(params, whatever);
// r is the response from the db call
if (typeof r === 'object') {
var sr = 'here are the results!';
for (var result in r) {
sr += 'this particular result';
}
if (r.length === 50) {
sr += '<div id="more" class="more">Load More</div>';
}
domConstruct.place(sr, dom.byId('searchWrapper'), 'last');
}
on(query('.more'), 'click', function(e) {
// get next results having done stuff
// to track the state of the search, which works
onSearchClick();
});
}
on(dom.byId('search'), 'click', function(e) {
// get next results having done stuff
// to track the state of the search, which works
onSearchClick();
});
}
}
return search;
});