Отключить текущую нажатую кнопку с помощью ajax

Question

Я хочу отключить кнопку, которая в данный момент нажата на странице, но не могу этого сделать. Вот моя последняя попытка, которая все еще не сработала. Я попытался вернуть значение со страницы Ajax, которая является serverii, и сопоставить его с текущим идентификатором, чтобы показать отключение, но это не сработало.

php:

    <?php
       if (isset($_GET['movie'])) {
        
       
       $id=$_GET['movie'];
$get = $data->show(" SELECT * FROM servers WHERE movie_id='$id' ORDER BY server_id DESC");
foreach ($get as $row) {
 $id=$row['server_id'];
 $name=$row['server_name'];
 $link=$row['link'];
?>
       <button type="button" id="btn" value="<?php $id ?>" class="btn btn-warning m-2 p-2 <?php if($id==$serverii) echo 'disabled'?>" onclick="getmovie(<?php echo $id ?>)" > <?php echo "$name"; ?> </button>
        <?php }} ?>

Ajax:

    <script type="text/javascript">
    
         function getmovie(serverid){
    
            $.ajax({
    
            url:"../../control/operation/view_movie.php",
            method:"POST",
            data:{serverid:serverid},
            success:function(data)
                {
    
                    $("#show").html(data);
                }
            });
        }
    
        </script>

view_mov ie. php page:

      if (isset($_POST['serverid'])) {
        
    
        $id=$_POST['serverid'];
        $getuser = $data->getdata("SELECT * FROM servers WHERE server_id='$id'");
        $link=$getuser['link'];
        $name=$getuser['film_name'];
        $serverii=$getuser['server_id'];
      
         ?>
      <iframe class="embed-responsive-item" src="<?php echo $link ?>" allowfullscreen></iframe>
    
    <?php } ?>

Кто-нибудь знает простой способ сделать это? Мне просто нужен знак, который сообщает пользователю, что он сейчас находится на этом сервере. Измените цвет или что-нибудь отличное от других кнопок.

Answer 1

Звонок по клику: $("#btn").prop('disabled', true);

Answer 2

Я немного изменил код кнопки и принцип работы функции javascript getmovie. Вместо того, чтобы жестко кодировать идентификатор в качестве параметра функции, вы можете обратиться к кнопке из функции javascript, используя this, и получить идентификатор, который является value для кнопки.

Я отметил ниже о необходимости использования подготовленного оператора, а также передал комментарий к этому эффекту, поэтому sql ниже "как было"

<?php
    if ( isset( $_GET['movie'] ) ) {
        /*
            This really should be using a prepared statement!!!
        */
        $id = filter_input( INPUT_GET, 'movie', FILTER_SANITIZE_STRING );
        $get = $data->show("SELECT 
                                `server_id`,
                                `server_name`,
                                `link` 
                            FROM `servers` 
                            WHERE `movie_id`='$id' 
                            ORDER BY server_id DESC");
        
        
        
        
        foreach( $get as $row ) {
            $id=$row['server_id'];
            $name=$row['server_name'];
            $link=$row['link'];
?>
        <!-- 
        
            "echo" the ID in the value and modify function 
            call to accept `event` as the single argument.
            
            There is no specific need for the ID as this 
            would be duplicated in the loop and we can refer
            to button in Javascript using `this`
            
        -->
        <button type='button' value='<?php echo $id; ?>' class='btn btn-warning m-2 p-2 <?php if( $id==$serverii ) echo 'disabled'; ?>' onclick='getmovie( event );'>
            <?php echo $name; ?>
        </button>
<?php 
        }
    }
?>






<script>

    function getmovie( e ){
        //perhaps not strictly required for a regular button...
        e.preventDefault();
        
        //disable the button.
        e.target.disabled=true;
        
        $.ajax({
            url:'../../control/operation/view_movie.php',
            method:'POST',
            data:{ 'serverid':e.target.value },
            success:function( data ){
                $('#show').html( data );
            },
            error:function( err ){
                alert( err )
            }
        });
    }
</script>

Я собрал быструю демонстрацию

<?php

    error_reporting( E_ALL );
    ini_set( 'display_errors', 1 );
    
    if( $_SERVER['REQUEST_METHOD']=='POST' ){
        /* random nonsense as response... */
        $_POST['date']=date(DATE_ATOM);
        $_POST['ip']=$_SERVER['REMOTE_ADDR'];
        exit(json_encode($_POST));
    }
    
    
    
    $rs=array(
        array( 'server_id'=>'pdc', 'server_name'=>'corp-dc-01', 'link'=>'\\example.com\corp-dc-01' ),
        array( 'server_id'=>'adfs', 'server_name'=>'corp-adfs-01', 'link'=>'\\example.com\corp-adfs-01' ),
        array( 'server_id'=>'file', 'server_name'=>'corp-fs-01', 'link'=>'\\example.com\corp-fs-01' ),
        array( 'server_id'=>'bdc', 'server_name'=>'corp-dc-02', 'link'=>'\\example.com\corp-dc-02' ),
        array( 'server_id'=>'adfs-2', 'server_name'=>'corp-adfs-02', 'link'=>'\\example.com\corp-adfs-02' ),
        array( 'server_id'=>'file-2', 'server_name'=>'corp-fs-02', 'link'=>'\\example.com\corp-fs-02' )
    );
    
    # to emulate a chosen server... selected at random
    $serverii=$rs[mt_rand(0,count($rs)-1)]['server_id'];
    
?>
<!DOCTYPE html>
<html lang='en'>
    <head>
        <meta charset='utf-8' />
        <title></title>
        <script src='//code.jquery.com/jquery-latest.js'></script>
        <script>
            function getmovie( e ){
                e.preventDefault();
                e.target.disabled=true;

                $.ajax({
                    url:location.href,  //'../../control/operation/view_movie.php'
                    method:'POST',
                    data:{
                        'serverid':e.target.value,
                        'link':e.target.dataset.link,
                        name:e.target.innerText
                    },
                    success:function( data ){
                        $('#show').html( data );
                    },
                    error:function( err ){
                        alert( err )
                    }
                });
            }
        </script>
        <style>
            button{padding:1rem;margin:1rem;}
            .disabled{color:red;}
            :disabled{background:red;color:white}
        </style>
    </head>
    <body>
        <form method='post'>
            <div id='show'></div>
            <?php
            
                printf( '<h1>Active:%s</h1>',$serverii );
            
            
                foreach( $rs as $svr ){
                    $id=$svr['server_id'];
                    $name=$svr['server_name'];
                    $link=$svr['link'];
                    $disabled=$id==$serverii ? 'disabled' : '';
                    
                    printf(
                        '<button type="button" value="%s" data-link="%s" class="btn btn-warning m-2 p-2 %s" onclick="getmovie( event );">
                            %s
                        </button>',
                        $id,
                        $link,
                        $disabled,
                        $name
                    );
                }
            ?>
        </form>
    </body>
</html>