Capture and change the value of a column of its respective row in a table with numerous rows

Question

Capture and change the value of a column of its respective row in a table with numerous rows

Navigation

#1 by (0 votes)

2

Futuredatafromthetablewillbeshownthroughthecodebelow:

<?phpwhile($linhaAssociativa=mysqli_fetch_assoc($query)){?><tr><tdclass="cmenu2"><?php echo $linhaAssociativa["CommonName"]; ?></td>
  <td><?php echo $linhaAssociativa["RealAddress"]?></td>
  <td><?php echo $linhaAssociativa["BytesSent"]?></td>
  <td><?php echo $linhaAssociativa["BytesReceived"]?></td>
  <td><?php echo $linhaAssociativa["VirtualAddress"]?></td>
  <td><?php echo $linhaAssociativa["Since"]?></td>
  <td><?php echo $linhaAssociativa["Status"]?></td>
</tr>
<?php
            } ?>

Where each row is a customer and has a status column (the last column of each row) with the value 0 or 1 .

I'musinga contextMenu plugin to create a Block / Unblock by clicking the first column of each line and a plugin of confirm clicking block (image 3).

WhatI'mtryingtodo:Whenyouright-clickonaline,iftheLock/strong>will1,ifyouunlock1will0.LaterI'llgettheinformationfromthetdthatwillsavethevalueofthestatus(0or1)andI'llplayitinadatabase-butthisisapparentlyeasy.WhatIcannotdo:IfIrightclickonGarretWintersthecontextMenuofthepluginwillopenandifitisclickedonblock,0willbecome1.HoweverIcannotrepeatthelogicforalltheotherlines(Wintersandallotherlinesbelow).

Thefunctioncode:

$(function(){$.contextMenu({selector:'NOMEDOSELETOR',callback:function(key,options){varm="clicked: " + key;
            window.console && console.log(m) || alert(m); 
        },
        items: {
            "bloquear": {name: "Bloquear", icon: "edit"},
            "desbloquear": {name: "Desbloquear", icon: "cut"},


        }
    });

    $('.context-menu-one').on('click', function(e){
        console.log('clicked', this);
    })    
});

E

$.confirm({
    title:"Você tem certeza?",
    content:"Você REALMENTE tem certeza que quer bloquear este cliente?",
    confirmButton: 'Eu quero',
    cancelButton: 'Não, nunca!',
    confirm: function(){
      $.alert('Ok... Como o senhor quiser');
    }
  });

Trying to make it as clear as possible - Let's say the table has 10 rows, and each row contains a column NAME and a STATUS column (by default with a value of 0). If I click on the first line with the right button and go on lock, it will change the STATUS (the class td cmenu2 ) to 1. BUT if I put the td of the second line also as class cmenu2 and I try to apply logic as I showed in photos / code, and right click on line two, go on lock, it will change the status of line one and not two! >

php javascript jquery

asked by anonymous 16.06.2016 / 04:09

1 answer

GLMER, longitudinal data, random factor, Binomial [closed] How to store images in a Javascript object?

score 0 · Answer 1

I used the samples from the Sakila database from MySQL.

In the script below, the last column has a context menu. When you click on it, the lock and unlock options will appear. Finally, when you click on the desired option, the value of it will be shown, then you can do whatever you want with it.

Tip: Make good use of the callback functions available in the plugin.

<?php
include 'conexao.php';

$query = 'select first_name, last_name from sakila.actor limit 10';

$result = mysqli_query($db, $query);
?>
<!DOCTYPE html>
<html>
    <head>
        <title>:: Login</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.2.0/jquery.contextMenu.min.css">
    </head>
    <body>
        <div class="container">
            <div class="col-sm-5" id="login-container">
                <table class="table table-condensed table-bordered">
                    <?php
                    while ($r = mysqli_fetch_array($result)) {
                    ?>
                        <tr>
                            <td><?php echo $r['first_name']; ?></td>
                            <td class="context-menu-one"><?php echo $r['last_name']; ?></td>
                        </tr>
                    <?php
                    }
                    ?>
                </table>
            </div>
        </div>
        <script src="http://code.jquery.com/jquery-2.0.0.min.js"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.2.0/jquery.contextMenu.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.2.0/jquery.ui.position.min.js"></script>
        <script>
            $(function () {
                
                function createSomeMenu() {
                    return {
                        callback: function(key, options) {
                            var m = "clicked: " + key;
                            window.console && console.log(m) || alert(m);
                        },
                        items: {
                            "bloquear": {name: "Bloquear", icon: "edit"},
                            "desbloquear": {name: "Desbloquear", icon: "cut"}
                        }
                    };
                }
                
                $('.context-menu-one').on('mouseup', function(e){
                    var $this = $(this);
                    // store a callback on the trigger
                    $this.data('runCallbackThingie', createSomeMenu);
                    var _offset = $this.offset(),
                        position = {
                            x: _offset.left + 10, 
                            y: _offset.top + 10
                        }
                    // open the contextMenu asynchronously
                    setTimeout(function(){ $this.contextMenu(position); }, 1000);
                });

                // setup context menu
                $.contextMenu({
                    selector: '.context-menu-one',
                    trigger: 'none',
                    build: function($trigger, e) {
                        // pull a callback from the trigger
                        return $trigger.data('runCallbackThingie')();
                    }
                });
            });
        </script>
    </body>
</html>

The code is as it can be seen. I did not take any precautions with PHP, because the goal was to bring the data from the database.