Script to remove readonly

Asked

Viewed 58 times

1

I have a user registration system and a page where I show all registered users.

I display 8 users per page - each user has the option to click an anchor Info which details the user. In these details there is an option to reset the password, and when you click on the button to reset the password it releases the input so it can be typed.

The problem is that as it is a pagination and 8 users are shown per page, the button that releases the input for editing only works when I click on the 1° user shown. Example:

  • user 1 user 2 user 3

I want to reset the user password2, but when I click the button it does nothing. But when I click to reset the user password 1 it releases the input for editing the 3 users. I release the inputs through a script (he removes the readonly).

visualizaru.php:

<!------------------------------------------------------- modal visualizar número --------------------------------------------------------------------->
<?php 
include_once("../../conn/conexao.php");//faz a conexao com o banco de dados
     
//verifica a página atual caso seja informada na URL, senão atribui como 1ª página 
$pagina = (isset($_GET['pagina']))? $_GET['pagina'] : 1; 
 
//seleciona todos os itens da tabela 
$cmd = "select * from tb_usuario"; 
$produtos = mysqli_query($conexao, $cmd); 
 
//conta o total de itens 
$total = mysqli_num_rows($produtos); 
 
//seta a quantidade de itens por página, neste caso, 2 itens 
$registros = 8; 
 
//calcula o número de páginas arredondando o resultado para cima 
$numPaginas = ceil($total/$registros); 
 
//variável para calcular o início da visualização com base na página atual 
$inicio = ($registros*$pagina)-$registros; 
 
//seleciona os itens por página 
$cmd = "select * from tb_usuario limit $inicio,$registros"; 
$produtos = mysqli_query($conexao, $cmd); 
$total = mysqli_num_rows($produtos); 
     
//exibe os produtos selecionados 
   	 		
                           
echo "<div class='container'>
    <div class='row pricing text-center'>

";
$cont=0;
while ($produto = mysqli_fetch_array($produtos)){
    echo"<div class='col-md-3'>
        <div class='well'>";
            echo "<h3><b>".$produto['nome']."</b></h3>
                <hr>
                    <p>Email:&nbsp;".$produto['email']."</p>
                <hr>
                    <div class='col-xs-6'>
                        <a href='deletaru.php?email=".$produto['email']."' class='btn btn-danger btn-block'><span class='glyphicon glyphicon-trash'></span></a></div>
                        <div class='col-xs-6'><a href='#info".$cont."' data-toggle='modal' class='btn btn-success btn-block'><span class='glyphicon glyphicon-plus'></span>&nbsp;Info</a></div>


                        <div class='modal fade' id='info".$cont."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
    <div class='modal-dialog'>
        <div class='modal-content'>
          <div class='modal-header'>
                <button type='button' class='close' data-dismiss='modal'><span aria-hidden='true'>×</span><span class='sr-only'>Close</span></button>
                <h3 class='modal-title' id='lineModalLabel' align='center'>Dados do Usuario</h3>
			
            <div class='modal-body'>
			<form method='post' action='atualizaru.php'>
                <div class='form-group'>
                    <div class='col-xs-12'><center>
                    <label for='exampleInputPassword1'>Nome</label></center>
                    <input type='text' name='nome' class='form-control' value=".$produto['nome']." style='text-align: center;' readonly='readonly' id='letras' required>
                    <br></div>
                </div>

                <div class='form-group'>
                    <div class='col-xs-12'><center>
                    <label for='exampleInputPassword1'>Email</label></center>
                    <input type='text' name='email' class='form-control' id='exampleInputPassword1' value=".$produto['email']." style='text-align: center;' readonly='readonly' >
                    <br></div>
                </div>
				
				 <div class='form-group'>
                    <div class='col-xs-12'><center>
                    <label for='exampleInputPassword1'>Senha</label></center>
                    <input type='password' name='senha' class='form-control' id='exampleInputPassword1' value=".$produto['senha']." style='text-align: center;' readonly='readonly' >
                    <br></div>
                </div>
				
                <div class='form-group'>
					<div class='col-xs-6'>
					<button type='button' class='btn btn-success btn-block' role='button' id='btnEditar'><span class='glyphicon glyphicon-lock'></span>&nbsp;Redefinir Senha</button>
					</div>
				</div>
				
				<div class='form-group'>
					<div class='col-xs-6'><center>
					<button class='btn btn-success btn-block' role='button' type='submit' value='Cadastrar' name='salvar'><span class='glyphicon glyphicon-ok'></span>&nbsp;Salvar</button>
					</center></div>
				</div>
			</form>
            </div>
            </div>
        </div>
    </div>
</div>
             </div>
             </div>
             ";


            $cont++;
                }

			echo "<div class='text-center'><ul class='pagination pagination-large'>";
				for($i = 1; $i < $numPaginas + 1; $i++) { 
					echo "              
		<li><a href='visualizaru.php?pagina=$i'>".$i."</a></li> "; 
				} 
	echo"</ul></div>
	</div>
		</div>
	";
		
         
?>
<!---------------------------------------------------------------- Fim modal visualizar número ---------------------------------------------------------------------------->

Script used to release input:

<script language='JavaScript'>
 $("#btnEditar").on('click', function() {
  $('input[name="senha"]').removeAttr('readonly');
  
});

</script>

  • The problem is that you are working with ID, which generates conflict in DOM, soon I will publish the answer

1 answer

2


I added a class to your button and your password input to avoid conflicts:

<?php
include_once("../../conn/conexao.php");//faz a conexao com o banco de dados

//verifica a página atual caso seja informada na URL, senão atribui como 1ª página
$pagina = (isset($_GET['pagina']))? $_GET['pagina'] : 1;

//seleciona todos os itens da tabela
$cmd = "select * from tb_usuario";
$produtos = mysqli_query($conexao, $cmd);

//conta o total de itens
$total = mysqli_num_rows($produtos);

//seta a quantidade de itens por página, neste caso, 2 itens
$registros = 8;

//calcula o número de páginas arredondando o resultado para cima
$numPaginas = ceil($total/$registros);

//variável para calcular o início da visualização com base na página atual
$inicio = ($registros*$pagina)-$registros;

//seleciona os itens por página
$cmd = "select * from tb_usuario limit $inicio,$registros";
$produtos = mysqli_query($conexao, $cmd);
$total = mysqli_num_rows($produtos);

//exibe os produtos selecionados


echo "<div class='container'>
    <div class='row pricing text-center'>

";
$cont=0;
while ($produto = mysqli_fetch_array($produtos)){
    echo"<div class='col-md-3'>
        <div class='well'>";
    echo "<h3><b>".$produto['nome']."</b></h3>
                <hr>
                    <p>Email:&nbsp;".$produto['email']."</p>
                <hr>
                    <div class='col-xs-6'>
                        <a href='deletaru.php?email=".$produto['email']."' class='btn btn-danger btn-block'><span class='glyphicon glyphicon-trash'></span></a></div>
                        <div class='col-xs-6'><a href='#info".$cont."' data-toggle='modal' class='btn btn-success btn-block'><span class='glyphicon glyphicon-plus'></span>&nbsp;Info</a></div>


                        <div class='modal fade' id='info".$cont."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
    <div class='modal-dialog'>
        <div class='modal-content'>
          <div class='modal-header'>
                <button type='button' class='close' data-dismiss='modal'><span aria-hidden='true'>×</span><span class='sr-only'>Close</span></button>
                <h3 class='modal-title' id='lineModalLabel' align='center'>Dados do Usuario</h3>

            <div class='modal-body'>
            <form method='post' action='atualizaru.php'>
                <div class='form-group'>
                    <div class='col-xs-12'><center>
                    <label for='exampleInputPassword1'>Nome</label></center>
                    <input type='text' name='nome' class='form-control' value=".$produto['nome']." style='text-align: center;' readonly='readonly' id='letras' required>
                    <br></div>
                </div>

                <div class='form-group'>
                    <div class='col-xs-12'><center>
                    <label for='exampleInputPassword1'>Email</label></center>
                    <input type='text' name='email' class='form-control' id='exampleInputPassword1' value=".$produto['email']." style='text-align: center;' readonly='readonly' >
                    <br></div>
                </div>

                 <div class='form-group'>
                    <div class='col-xs-12'><center>
                    <label for='exampleInputPassword1'>Senha</label></center>
                    <input type='password' name='senha' class='form-control senha' id='exampleInputPassword1' value=".$produto['senha']." style='text-align: center;' readonly='readonly' >
                    <br></div>
                </div>

                <div class='form-group'>
                    <div class='col-xs-6'>
                    <button type='button' class='btn btn-success btn-block btnEditar' role='button' id='btnEditar'><span class='glyphicon glyphicon-lock'></span>&nbsp;Redefinir Senha</button>
                    </div>
                </div>

                <div class='form-group'>
                    <div class='col-xs-6'><center>
                    <button class='btn btn-success btn-block' role='button' type='submit' value='Cadastrar' name='salvar'><span class='glyphicon glyphicon-ok'></span>&nbsp;Salvar</button>
                    </center></div>
                </div>
            </form>
            </div>
            </div>
        </div>
    </div>
</div>
             </div>
             </div>
             ";


    $cont++;
}

echo "<div class='text-center'><ul class='pagination pagination-large'>";
for($i = 1; $i < $numPaginas + 1; $i++) {
    echo "              
        <li><a href='visualizaru.php?pagina=$i'>".$i."</a></li> ";
}
echo"</ul></div>
    </div>
        </div>
    ";


?>

And in js we will work with them that way:

<script language='JavaScript'>
    $(".btnEditar").on('click', function() {
        $(this).parent().parent().parent().find('.senha').removeAttr('readonly');

    });

</script>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.