我开始用主干/ js 创建一个网络应用程序, 并遇到了一点问题。 它允许我创建新项目, 没有任何问题。 但是, 它并没有将事件约束到根据 Mature () 方法创建的按钮上。 基本上, 每次我添加一个新项目, 我就会得到一个编辑和删除按钮, 我想将模型绑在它们上, 这样我就可以追溯编辑或删除该特定项目 。
我的骨干视图 :
ClientView = Backbone.View.extend({
el: $("body"),
initialize: function () {
this.clients = new Clients(null, { view: this });
},
events: {
"click #add-client": "AddClient",
"click .edit-client": "EditClient",
"click #save-client": "SaveNewClient"
},
render: function (model) {
var compiled_template = _.template($("#Client-Template").html());
$("#client-rows").append(compiled_template(model.toJSON()));
$("input:button", $("#client-rows")).button();
$("#addClientModal").modal("hide");
return this;
},
AddClient: function (model) {
$("#addClientModal h3").text("Add Client");
$("#addClientModal").modal("show");
},
EditClient: function (model) {
$("#addClientModal h3").text("Edit Client");
$("#addClientModal").modal("show");
},
SaveNewClient: function () {
var client_firstName = $("#clientFirstName").val();
var client_lastName = $("#clientLastName").val();
var client_email = $("#clientEmail").val();
var client_address = $("#clientAddress").val();
var client_model = new Client({ FirstName: client_firstName, LastName: client_lastName, Email: client_email, Address: client_address });
this.clients.add(client_model);
$("#clientFirstName, #clientLastName, #clientEmail, #clientAddress").val("");
$("#addClientModal").modal("hide");
}
});
我的模板 :
<script id="Client-Template" type="text/template">
<tr>
<td><%=FirstName%></td>
<td><%=LastName%></td>
<td><%=Address%></td>
<td>
<input type="button" class="btn btn-info .edit-client" value="Edit" />
<input type="button" class="btn btn-danger" value="Delete" />
</td>
</tr>
</script>
不幸的是,我不能把整个申请都粘贴在纸上,但幸运的是,注意到我提供的内容哪里有问题应该比较简单。 显然,如果你需要我提供更多细节,请问一下。