Я привязываю, чтобы вставить некоторый html в div на моей странице, но он не работает. Я пытаюсь вставить шаблонный html $ ('# users-found'). Html (tpl), но он не будет работать. Он работает, когда я использую это. $ El.append, но я хочу, чтобы он менялся каждый раз, когда они ищут пользователя. Есть идеи?
define([
'jquery',
'underscore',
'backbone',
'parse',
'text!templates/searchUsers_tpl.html',
'text!templates/userList_tpl.html'
], function($, _, Backbone, Parse, SearchUsersTpl, UserListTpl){
var SearchUsersView = Backbone.View.extend({
el: '#content',
initialize: function(){
console.log('search users');
this.render();
},
render: function(){
this.$el.html(SearchUsersTpl);
},
events: {
'click #submit-search': 'search'
},
search: function(){
var self = this;
var input = $('#search-users-input').val();
console.log('search input: ' + input);
var query = new Parse.Query(Parse.User);
query.equalTo('username', input);
query.find({
success: function(results){
console.log("Successfully retrieved " + results.length + " users.");
for (var i = 0; i < results.length; i++) {
var object = results[i];
console.log(object.id + ' - ' + object.get('username'));
}
var tpl = _.template(UserListTpl, {users: results});
$('#users-found').html(tpl);
},
error: function(){
console.log('search for user failed');
}
});
}
});
return SearchUsersView;
});
Html, который загружается при создании представления, SearchUsersTpl
<h1>Find Friends</h1>
<br>
<br>
<input id='search-users-input' type="search" value="" placeholder="search username" class="topcoat-search-input">
<button type='search' id='submit-search' class='topcoat-button'>Search</button>
<br>
<br>
<div id='#users-found'></div>
Шаблон
<div>
<% _.each(users, function(user) { %>
<li><%= user.get('username') %></li>
<% }); %>
</div>
У вашего DIV неверный идентификатор. это должно быть <div id = 'users-found'> </div> not <div id = '# users-found'> </div>
Значение h используется только как селектор, но не требуется при указании его как идентификатора.
убедитесь, что шаблон пользователя преобразован в объект jQuery. Попробуйте заменить:
$('#users-found').html(tpl);
с
$(tpl).appendTo($('#users-found').empty());
.empty()
и использовать форматирование кода