Transfer data from table

后端 未结 2 1305
傲寒
傲寒 2021-01-29 12:19

I have a table in HTML.


  JOHN DOE
  DO         


        
相关标签:
2条回答
  • 2021-01-29 13:02

    With the assumption that popup opens when you click on the <a> then you could just use $(this).text() and do something like this:

    $(document).ready(function(){
        $('.name1 a').click(function() {
               $('.popup1 h3').text($(this).text());
            });
        });
    

    Full example:

    <table><td class="name1"><a href="#">JOHN DOE</a></td>
              <td class="company1">DOE TRUCKING</td>
              <td class="position1">TRUCKER</td>
              <td class="mc1">1234-567-8901</td>
              <td class="dot1">1234-567-8901</td>
              <td class="status1"><img src="images/cross.png" width="12" height="12" alt="cross"></td>
    </table>
    
    <div class="popup1">
        <div class="cross3"><a href="#"><img src="images/closr-arrow.png" width="19"   height="19" alt="closr-arrow"></a></div>
        <h3>TABLE NAME</h3>
        <a href="#" class="approve">APPROVE ACCOUNT</a>
        <a href="#" class="deny">DENY ACCOUNT</a>
    </div>
    
    <script>
        $(document).ready(function(){
            $('.name1 a').click(function() {
                $('.popup1').lightbox_me({}); // <-- whatever your popup is, it plays no role here
                $('.popup1 h3').text($(this).text());
            });
        });
    </script>
    

    Sorry, you say lightbox but I cannot see how it's called or what lightbox given that lightbox is more of a gallery thing.

    That's why I have used jQueryUI dialog instead, if this will not help then someone should take away your keyboard, and I hope this one will save you some duplication too (guessing given your class names).

    <?php
    
    $rows=array(
        0=>array("id"=>'1',"name"=>'Tom',"company"=>'U',"status"=>'active'),
        1=>array("id"=>'2',"name"=>'Hre',"company"=>'E',"status"=>'suspended'),
        2=>array("id"=>'3',"name"=>'Peter',"company"=>'Pawtucket',"status"=>'wasted'),
        3=>array("id"=>'4',"name"=>'Griffin',"company"=>'Patriot',"status"=>'drunk'),
    );
    
    ?>
    <!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="content-type" content="text/html;charset=utf-8" />
            <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    
            <link href="/jquery-ui-1.10.4/css/ui-lightness/jquery-ui-1.10.4.css" rel="stylesheet">
            <script type="text/javascript" src="/jquery-ui-1.10.4/js/jquery-ui-1.10.4.js"></script>
            <style>
                .name {color:#00F;}
            </style>
            <script>
            $(document).ready(function(){    
                $("#popup").dialog({
                    autoOpen: false,
                    modal: true,
                    width: 500,
                    height: 500,
                    title: "Content From Row",
                    closeOnEscape: true,
                    closeText: "fechar",
                    show: {
                        effect: "fadeIn",
                        duration: 1000
                    },
                    hide: {
                        effect: "fadeOut",
                        duration: 1000
                    }
                });
            });
            </script>
    
            <script>
                $(document).ready(function(){
                    $('.name a').click(function() {
                        $('#popup h3').text($(this).text());
                        $(this).parent().siblings().each(function(){
                            if($(this).hasClass('company')){
                                $('#popup .popup_company').text($(this).text());
                            }
                            if($(this).hasClass('status')){
                                $('#popup .popup_status').text($(this).text());
                            }
                        });
                        $("#popup").dialog('open');
                    });
                });
            </script>
    
        </head>
        <body>
    
            <?php 
            if(is_array($rows)){
                ?><table>
                    <tr><td>Row No</td><td>ID</td><td>Name</td><td>Company</td><td>Status</td></tr>    
                <?php
                foreach($rows as $row_key=>$row){
                    ?><tr><?php
                        if(is_array($row)){
                            echo('<td>'.$row_key.'</td>');
                            foreach($row as $value_key=>$value){
                                if($value_key == "name"){
                                    echo('<td class='.$value_key.'><a>'.$value.'</a></td>');
                                }else{
                                    echo('<td class='.$value_key.'>'.$value.'</td>');
                                }
                            }
                        }
                    ?></tr><?php
                }
                ?></table><?php
            }
            ?>
    
            <div style="display:none;"><div id="popup">
                <div class="cross3">
                    <a href="#"><img src="images/closr-arrow.png" width="19"   height="19" alt="closr-arrow"></a>
                </div>
                <h3>TABLE NAME</h3>
                <a href="#" class="popup_company"></a>
                <a href="#" class="popup_status"></a>
                <a href="#" class="approve">APPROVE ACCOUNT</a>
                <a href="#" class="deny">DENY ACCOUNT</a>
            </div></div>
    
        </body>
    </html>
    
    0 讨论(0)
  • 2021-01-29 13:22

    Here is the jsfiddle I don't know how you handle your popup but this is how your js should be structured.

    $(function(){
        $('a').click(function(){
          $('h3').html($(this).html())
        });
    });
    
    0 讨论(0)
提交回复
热议问题