O meu botão funciona corretamente e de repente não funciona mais: Ao atualizar as informações do usuário com os dados corretos, não entra no evento do botão para atualizar mas sim no evento de adicionar usuário pois é exibido Usuario novo não adicionado, preencha corretamente!
. Observei que isso ocorre apenas após adicionar usuário e ir editá-lo (alterando OU não as informações e elas corretas). Por que isso acontece? Os scripts de todo o site são num arquivo só (only single page), nenhum dado é passado por URL e consigo editar normalmente (sem adicionar usuários) ao recarregar a página.
HTML
<script type="text/x-handlebars-template" id="tpl-users-edit">
<button id="back" class="btn btn-info"><i class="glyphicon glyphicon-menu-left"></i> Voltar</button>
<div id="UserViewEdit">
<table class="table" id="users">
<thead>
<tr>
<th>Nome</th>
<th>Empresa</th>
<th>Perfil</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<td><div class="col-sm-9"><input class="form-control" id="nome" name="nome" type="text"/></div></td>
<td><div class="col-sm-9"><input class="form-control" id="empresa" name="empresa" type="text"/></div></td>
<td><div class="col-sm-9"><select class="form-control" id="perfil" name="perfil">
<option value="administrador">Administrador</option>
<option value="usuario">Usuário</option>
</select>
</div>
</td>
<td><div class="col-sm-9"><input class="form-control" id="email" name="email" type="email"/></div></td>
</tr>
</tbody>
</table>
<p style="text-align:right"><button id="recovery" type="button" class="btn btn-info"><i class="glyphicon glyphicon-share-alt"></i> Recuperar senha</button>
<button id="save" type="button" class="btn btn-success" data-id={{id}} ><i class="glyphicon glyphicon-save"></i> Salvar</button></p>
</div>
</script>
JS
'click button#save': function (evt) {
var nome = $('#nome').val();
var email = $('#email').val();
var empresa = $('#empresa').val();
console.log("Dados: " + nome + "\t" + empresa + "\t" + validateEmail(email));
if(nome != "" && empresa != "" && validateEmail(email)==true) {
console.log("entrou mas deu erro")
var json = {
id: localStorage.getItem('id'),
nome: nome,
email: email,
perfil: this.$el.find("#UserViewEdit select[name=perfil]").val(),
empresa: empresa
}
$.ajax({
url: 'api/user/update',
type: 'PUT',
contentType: 'application/json',
data: JSON.stringify(json),
success: function (data) {
alert("Alterado com sucesso!")
window.location = 'index.jsp#InstanciaManager';
}
});
}else{
alert('Preencha corretamente todos os campos!')
}
}
ValidateEmail
function validateEmail(email){
var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
}
Adicionar Usuário
JS
App.UserAddView = Backbone.View.extend({
el: $("#content"),
tpl: Handlebars.compile($('#tpl-user-add').html()),
initialize: function () {
this.render();
},
render: function () {
this.$el.html(this.tpl());
},
events: {
'click button#back': function (evt) {
evt.stopImmediatePropagation();
var instancia = Backbone.history.fragment.split("/")[1];
Backbone.history.navigate("UserView/"+instancia, {trigger : true});
},
'click button#save': function (evt) {
evt.stopImmediatePropagation();
var nome = this.$el.find("#edit-form input[name=nome]").val();
var email = this.$el.find("#edit-form input[name=email]").val();
var empresa = this.$el.find("#edit-form input[name=empresa]").val();
if(nome != "" && validateEmail(email) != false && empresa != "" ) {
var model = new App.UserModel({
instancia : localStorage.getItem('instancia'),
nome: nome,
email: email,
perfil: this.$el.find("#edit-form select[name=perfil]").val(),
empresa: empresa
});
model.save({}, {
success: function (model, response) {
var password = response.senha;
var dlg = Handlebars.compile($('#tpl-password-dialog').html());
var $modal = $(dlg()).modal();
$modal.show(function (evt){
$('.mensagem').append(password);
});
if(response.senha.toString() != "Erro: Esse email já está cadastrado!"){
$modal.on('click','#fechar', function(){
var instancia = Backbone.history.fragment.split("/")[1];
Backbone.history.navigate("UserView/"+instancia, {trigger : true});
});
$modal.on('hidden.bs.modal', function(){
var instancia = Backbone.history.fragment.split("/")[1];
Backbone.history.navigate("UserView/"+instancia, {trigger : true});
})
}
}
});
}else{
alert('Usuario novo não adicionado, preencha corretamente!')
}
}
}
});
HTML
<script type="text/x-handlebars-template" id="tpl-user-add">
<div id="UserAddView"> <div class="col-sm-4">
</div>
<div class="col-sm-4">
<h1>Adicionar Usuário</h1>
<div class="well">
<form id="edit-form" class="form-horizontal" role="form" action="">
<tr class="adicionar">
<div class="form-group">
<label class="col-sm-3 control-label" >Nome</label>
<div class="col-sm-9">
<input class="form-control" name="nome" type="text" />
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label" >Empresa</label>
<div class="col-sm-9">
<input class="form-control" name="empresa" type="text">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label" >Email</label>
<div class="col-sm-9">
<input class="form-control" name="email" type="email"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label" >Perfil</label>
<div class="col-sm-9">
<select class="form-control" name="perfil">
<option value="administrador">administrador</option>
<option value="usuario">usuario</option>
</select>
</div>
</div>
</tr>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<td>
<button id="back" type="button" class="btn btn-info"><i class="glyphicon glyphicon-menu-left"></i> Voltar</button>
</td>
<td>
<button id="save" type="button" class="btn btn-success"><i class="glyphicon glyphicon-save"></i> Salvar</button>
</td>
</div>
</div>
</form>
</div>
</div>
</tr>
<div class="col-sm-4"></div>
</div>
</script>
if(nome != "" && empresa != "" && validateEmail(email)==true) {
? Como é a funçãovalidateEmail
?console.log("Dados: " + nome + "\t" + empresa + "\t" + validateEmail(email));
não é exibido.alert('Preencha corretamente todos os campos!')
não deveria executar, tem como fornecer um exemplo funcional do problema? ... Opa achei uma coisa.handlebars.js
, poderia fornecer um exemplo funcional do problema? Está um pouco complicado reproduzi-lo