Вопросы Теги

Аякс - PHP - Ошибка изменил состояние button

Я располагаю таблицей, где я показываю пользователи с колонной / идентификацией "состояния". Где у него будет два типа стоимости: зеленый цвет (activo, estado=1) или красный цвет (inactivo, estado=0). У меня есть следующий код, чтобы менять состояние, но показывает мне зеленый начальный цвет, но меня не делает изменение clickear на button.

Где у меня есть ошибка?

index.php

<table class="table table-striped" border="2" cellspacing="3" cellpadding="3" style="font-size: 10pt"> <!-- table-hover === se selecciona la fila indicada con el raton -->
                    <center>
                    <!-- Indicamos el nombre de las columnas de la tabla a visualizar. -->
                    <!-- TABLE = crear una tabla        TR = crear una fila        TD = crear una columna -->
                    <tr>
                        <thead style="background-color:#A9F5A9">
                        <td>
                            <font face="verdana" color="blue"><b><center>ID</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Login</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Email</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Nombre</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Apellidos</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Ciudad</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Teléfono</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Fecha registro</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Estado</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Modificar</center></b></font>
                        </td>
                        <td>
                            <font face="verdana" color="blue"><b><center>Eliminar</center></b></font>
                        </td>
                        </center>
                        </thead>
                    </tr>

                    </center>
                    <?php
                        //Extraemos la informacion de ambas tablas relacionadas con el foreign key (ID_OBLIGATORIO).
                        $query = "SELECT * FROM usuarios_obligatorios JOIN usuarios_datos ON usuarios_obligatorios.ID_OBLIGATORIO = usuarios_datos.ID_OBLIGATORIO ORDER BY usuarios_obligatorios.ID_OBLIGATORIO ASC";
                        $result = mysql_query($query);
                        $numero = 0;
                        //Mientras existen datos, los agregamos en la tabla (mediante filas).
                        while($row = mysql_fetch_array($result)){
                            echo "<tr>";
                                echo "<td width=\"05%\"><font face=\"verdana\"><font size='2'>".$row["ID_OBLIGATORIO"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["login"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["email"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["nombre"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["apellidos"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["ciudad"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["telefono"]."</font></font></td>";
                                echo "<td width=\"10%\"><font face=\"verdana\"><font size='2'>".$row["fecha_registro"]."</font></font></td>";

                                echo "<td width=\"08%\">" ?>
                                    <!-- Columna ESTADO del usuario. (estado verde/rojo). -->
                                    <center>
                                        <?php
                                            $estado = 1;
                                            $class = "activo";
                                        ?>
                                        <button class="activar <?php echo $class;?>" data-estado="<?php echo $estado?>" style="height: 14px; width:14px;"></button>
                                    </center>
                                <?php 
                                echo "</td>";   

                                echo "<td width=\"08%\">" ?>    
                                    <!-- Columna MODIFICAR usuarios. Nos redirige a modificar.php (formulario ya con los datos cargados) gracias a: <a href="modificar.php?Id=<?=$row["ID_OBLIGATORIO"]?>"> 
                                         Al pasar el raton encima de cada modificar, abajo en el navegador podemos ver el valor de cada ID: osmar.fyb3/modificar.php?Id=7 -->
                                    <center><a href="modificar.php?Id=<?=$row["ID_OBLIGATORIO"]?>"><img src="imagenes/modificar.png" height='24' width='26' onmouseover="this.src='imagenes/modificar_in.png';" onmouseout="this.src='imagenes/modificar.png';"></center> <?php echo "</td>";
                                echo "<td width=\"08%\">" ?> 
                                    <!-- Columna ELIMINAR usuarios (checkbox). Sabemos el valor de cada fila mediante: value="<?php echo $row['ID_OBLIGATORIO']; ?>" 
                                         Al dar en el boton ELIMINAR_SELECCIONADOS, los borraremos. Guardamos los marcados en un array llamado seleccionados[] cuyo
                                         valor lo extraemos mediante: value="<?php echo $row['ID_OBLIGATORIO']; ?>" 
                                    -->
                                    <center><img src="imagenes/eliminar.png" height='23' width='24' alt="Eliminar">&nbsp;&nbsp;<input type="checkbox" name="seleccionados[]" id="seleccionados" value="<? echo $row['ID_OBLIGATORIO']; ?>">
                                    </center> <?php echo "</td>";
                            echo "</tr>"; 
                            $numero++;
                        }
                        mysql_free_result($result);
                    ?>
                </table>

                <!-- Boton ELIMINAR SELECCIONADOS -->
                <div class="boton_eliminar" class="table-responsive" align="right">
                    <font face="verdana">
                    <b><input type="submit" style="width:200px; height:28px;" name="eliminar_seleccionados" id="eliminar_seleccionados" onclick="return confirm('¿Deseas realmente eliminar estos usuarios?');" value="Eliminar seleccionados"></b></font><br/><br/>
                </div>
                <?php
                    //Si no existen datos ($filas == 0), icono de la BBDD vacia.
                    }else{
                ?><br/><h1><b><font size="16"><center>BASE DE DATOS SIN DATOS</center></font></b></h1><br/><center><img src="imagenes/bbdd.png" height="180" width="160"/></center>
                <?php
                    }
                ?>
            </div>
        </div>
        </form>
        <?php
            //Aqui va el codigo del boton eliminar_seleccionados...
            //Si pulsamos el boton "Eliminar seleccinados"... 
            if(isset($_POST['eliminar_seleccionados'])) {
                if(empty($_POST['seleccionados'])) {
                    echo "<center><h2>No se ha seleccionado ningun usuario.</center></h2>";
                }else{
                    foreach($_POST['seleccionados'] as $valor){
                        $res1 = mysql_query("DELETE FROM usuarios_obligatorios WHERE ID_OBLIGATORIO=".$valor."");
                        $res2 = mysql_query("DELETE FROM usuarios_datos WHERE ID_OBLIGATORIO=".$valor."");
                        $res3 = mysql_query("DELETE FROM usuarios_aficiones WHERE ID_OBLIGATORIO=".$valor."");
                    }
                    echo "<meta http-equiv=\"refresh\" content=\"0;URL=index.php\">";
                }
            }
        ?>
    </body>
</html>




<script>
    //Funcion al clickear el button del ESTADO.
    $('.activar').click(function(){
        //Recogemos el valor de la variable "data-estado".
        var estado = $('.activar').attr('data-estado'); 
        //Llamamos al cambiar_estado.php y le pasamos el valor a la funcion.
        $.post('cambiar_estado.php', {estado:estado}, function(response){
            //Dato = responde = 0, entonces desactivamos (color rojo). 
            if(response == 0){
                $('.activar').removeClass("activo");
                $('.activar').addClass("inactivo");
            }else{
                $('.activar').removeClass("inactivo");
                $('.activar').addClass("activo");
            }
        //Retornamos de nuevo el dato.
        $('.activar').attr('data-estado', response); 
        });
    });
</script>

index.js

$('.activar').on('click', cambiarEstado);

function cambiarEstado () {
  var estado = $(this).attr('data-estado');
  $.post('cambiar_estado.php', {estado:estado});
}

cambiar_estado.php

<?php
  $estado = $_POST['estado'];
  if ($estado == '1'){
    $dato = 0;
  }
  else{
    $dato = 1;
  }

?>
2
задан 14.11.2016, 16:08
2 ответа

Ну, первое, которое сделало бы серьезным избегать помещать эти имена в твои классы css и также добавлять . так как это правильный способ определять класс.

.inactivo{
   background-color: red;
}
.activo{
   background-color: green;
}

Секунда, твой код php он ничего не возвращает, ты был бы должен добавлять:

<?php
  $estado = $_POST['estado'];
  if ($estado == 1){
    $dato = 0;
  }
  else{
    $dato = 1;
  }
  echo $dato;
?>

Третий, после получая информацию, ты был бы должен менять класс, у которого есть твоя кнопка.

<?php
  $estado = 1;
  $class = "activo";
?>
<button class="activar <?php echo $class;?>" data-estado="<?php echo $estado?>">Cambiar estado</button>


<script>
$('.activar').click(function(){
    var estado = $('.activar').attr('data-estado'); 
    $.post('cambiar_estado.php', {estado:estado}, function(response){
        if(response == 0){
            $('.activar').removeClass("activo");
            $('.activar').addClass("inactivo");
        }else{
            $('.activar').removeClass("inactivo");
            $('.activar').addClass("activo");
        }
    $('.activar').attr('data-estado', response); 
    });
});
</script>

РЕДАКТИРОВАНИЕ

Так как ты изменил твой вопрос, не занимайте весь твой код, но я сделал пример, который меняет состояние кнопки, которая соответствует.

<table>
    <tr>
        <thead>
            <td>
                Id
            </td>
            <td>
                Boton
            </td>   
        </thead>
    </tr>
    <?php
        for ($i = 1; $i <= 3; $i++) {
            echo "<tr>";
            echo "<td class='id' data-id='$i'>$i</td>";
            $estado = 1;
            $clase = "activo"; 
    ?>
            <td><button class="activar <?php echo $class;?>" data-estado="<?php echo $estado ?>">Boton</button></td>
    <?php
        echo "</tr>";
        }
    ?>
</table>

И рукописный шрифт остался:

<script>
$('.activar').click(function(){
    var row = $(this).closest("tr");
    var estado = row.find(".activar").attr('data-estado'); 
    alert(row.find(".id").attr('data-id'));
    console.log("estado "+estado)  
    $.post('cambiar_estado.php', {estado:estado}, function(response){
    estado = response;
    console.log(estado);
        if(response == 0){
            row.removeClass("activo");
            row.addClass("inactivo");
        }else{
            row.removeClass("inactivo");
            row.addClass("activo");
        }
        row.find(".activar").attr('data-estado', estado); 
    });  
});
</script>

Кликнув в кнопке линии таблицы, я получаю эту линию. Потом я получаю класс "включать" этой линии в особенности (что является твоей кнопкой) и там получаю данные, посылаю их и изменяю их.

Получив var row = $(this).closest("tr"); ты получаешь <tr> я завершаю, следовательно ты можешь соглашаться в Ваш <td>. Идеальное состояло бы в том, чтобы у каждого поля твоих пользователей был класс например в этом случае class="id", с этим ты можешь искать внутри тебя <tr> <td> у которого был этот класс или другая. И в конце концов ты соглашаешься на Ваш признак.

2
ответ дан 24.11.2019, 12:37
  • 1
    Благодаря обоим из-за ответа. То, что он перемещает " sioesi" что меняет мне состояние в течение centé пропасти секунды он не является постоянным. И он меняет это мне во всем пользователям таблицы, не в который clickeo. –  omaza1990 14.11.2016, 16:00
  • 2
    Если функциональность эта, ты был бы должен оставлять весь твой код и объяснять хорошо, что ты хочешь, потому что, если ты помещаешь 1 случай в особенности, помощь, которую мы дадим тебе, будет для этого случая. Если он меняется тебе все пользователи, он, потому что ты оставил здесь " одна clase" и не одна " id" поскольку он был бы должен ссылки на каждого пользователя –  sioesi 14.11.2016, 16:03
  • 3
    Я заканчиваюсь añ adir có я говорю целое число таблицы, где у меня есть колонна, которую называются ГОСУДАРСТВО, где для каждого пользователя она является кнопкой, чтобы мочь дезактивировать это или включать это (когда пользователь сохранять в таблице, кнопка - (включенная) зелень). Я хотел бы, чтобы у каждой идентификации был его собственный button, чтобы его мочь давать ему разрешения активного / бездеятельного. –  omaza1990 14.11.2016, 16:09
  • 4
    @omaza1990 уже издайте мой ответ –  sioesi 14.11.2016, 16:38
  • 5
    ¿ Có mo podrí когда та же lí говорит в; nea có я говорю { < button class =" включать <? php я бросаю $class;? > " дата - состояние =" <? php я бросаю $estado? > " style =" height: 14px; width:14px; " > < / button> } линия / идентификация, которому он принадлежит? –  omaza1990 14.11.2016, 16:44

Есть несколько причин, из-за которых код может не функционировать:

  1. В css нет точки (.) чтобы показывать класс. Так в boton0 как в boton1.

  2. В вызове AJAX ( $.post), ты ничего не делаешь, чтобы читать результат или менять состояние кнопки, когда будет получен результат cambiar_estado.php.

    Тебе осталось бы добавлять третий параметр, который был бы функцией, которую было бы нужно выполнять, когда будет получен результат. И что изменил бы класс кнопки в зависимости от полученной стоимости.

  3. В cambiar_estado.php ты реализуешь операции, но не возвращаешь Ваш результат, которым язык сценариев JavaScript ничего не получает обратно.

    Тебе не хватало бы чего-то как echo $dato;.

Начиная с информации и нового кода, который ты добавил к вопросу:

//Funcion al clickear el button del ESTADO.
$('.activar').click(function(){
    //Recogemos el valor de la variable "data-estado".
    var estado = $('.activar').attr('data-estado'); 
    //Llamamos al cambiar_estado.php y le pasamos el valor a la funcion.
    $.post('cambiar_estado.php', {estado:estado}, function(response){
        //Dato = responde = 0, entonces desactivamos (color rojo). 
        if(response == 0){
            $('.activar').removeClass("activo");
            $('.activar').addClass("inactivo");
        }else{
            $('.activar').removeClass("inactivo");
            $('.activar').addClass("activo");
        }
    //Retornamos de nuevo el dato.
    $('.activar').attr('data-estado', response); 
    });
});

Проблема, которая у тебя есть сейчас, чем в функции, которая контролирует результат $.post ты используешь класс ".activar", что появляется в многочисленных элементах и не только в том, который был нажат.

Попытайся менять это для того, чтобы, вместо которого все элементы с классом "включать" были целями, это был исключительно тот, который был нажат:

//Funcion al clickear el button del ESTADO.
$('.activar').click(function(){

    // guardamos el elemento que se ha pulsado
    var $this = $(this);

    //Recogemos el valor de la variable "data-estado".
    var estado = $this.attr('data-estado'); 
    //Llamamos al cambiar_estado.php y le pasamos el valor a la funcion.
    $.post('cambiar_estado.php', {estado:estado}, function(response){
        //Dato = responde = 0, entonces desactivamos (color rojo). 
        if(response == 0){
            $this.removeClass("activo");
            $this.addClass("inactivo");
        }else{
            $this.removeClass("inactivo");
            $this.addClass("activo");
        }

        //Retornamos de nuevo el dato.
        $this.attr('data-estado', response); 
    });
});
1
ответ дан 24.11.2019, 12:37
  • 1
    Он продолжает за мной, что, не функционируя..., я начинаю " < td width =\" 08 %\" > "? > <! - Колонна ГОСУДАРСТВО пользователя. (зеленое / красное состояние). - > < center> <? php $estado = 1; $class = " activo";? > < button class =" включать <? php я бросаю $class;? > " datadata-состояние =" <? php я бросаю $estado? > " style =" height: 14px; width:14px; " > < / button> < / center> <? php я начинаю " < / td> "; –  omaza1990 15.11.2016, 10:01

Теги

Похожие вопросы