如何从javascript中的表中获取列名和第一行值?

时间:2015-05-13 14:00:38

标签: javascript php html

我想以某种方式将行的第一个数据的列名和值保存到变量Row,Column,然后将其发送到update_table.php,其中我更新了表。我可以这样做,但只有当我传递var newContent(更改所选单元格的值)时才能这样做。我把//放在非工作代码行前面。另外,行如何:

xmlhttp.open("GET","update_table.php?newContent="+newContent,true);

看起来还有2个参数(Column,Row)?

    $(function () { 

     $("td").dblclick(function () { 
     var OriginalContent = $(this).text(); 

    $(this).addClass("cellEditing");
    $(this).html("<input type='text' value='" + OriginalContent + "' />"); 
    $(this).children().first().focus(); 

    $(this).children().first().keypress(function (e) { 
        if (e.which == 13) { 
            var newContent = $(this).val(); 
            //var Row = $(this).parent().find('td');
            //var Column = $('#pregled1 tr th').eq($(this).index()); //pregled1 is a name of the table

            $(this).parent().text(newContent); 
            $(this).parent().removeClass("cellEditing");



        ///////////////////SEND TO update_table//////////// 
            if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
            xmlhttp.open("GET","update_table.php?newContent="+newContent,true);
            xmlhttp.send();

        ////////////////////////////////////////////////////        
        } 
    }); 

    $(this).children().first().blur(function(){ 
        $(this).parent().text(OriginalContent); 
        $(this).parent().removeClass("cellEditing"); 
    }); 
}); 

});

这是表格:

<?php

 header('Content-Type: text/html; charset=utf-8');

 include("config.php");

        print("<table class='pregled1' id='pregled1'>");
        $query = "SELECT * FROM radovi WHERE vrsta_kolegija='diplomski' ORDER BY ime_prezime ASC";
        $result = mysqli_query($link,$query);

        ////header of the table////
            print("<tr><th>JMBAG</th>");
            print("<th>IME I PREZIME</th>");
            print("<th>LOK.MAT.BR.</th>");
            print("<th>KLASIFIKACIJSKA OZNAKA</th>");
            print("<th>URUDŽBENI BROJ</th>");
            print("<th>ODABRANI KOLEGIJ</th>");
            print("<th>ODABRANI MENTOR</th>");
            print("<th>PRVI IZBOR</th>");
            print("<th>PRVI MENTOR</th>");
            print("<th>DRUGI IZBOR</th>");
            print("<th>DRUGI MENTOR</th>");
            print("<th>MENTOR D.Z.</th>");
            print("<th>STUDENT P.Z.</th>");
            print("<th>ZADATAK PREDAN</th>");
            print("<th>NAPOMENA</th></tr>");

        while($row=mysqli_fetch_array($result)){


            print("<tr>");

            print("<td>".$row["jmbag"]."</td>");
            print("<td>".$row["ime_prezime"]."</td>");
            print("<td>".$row["lok_mat_br"]."</td>");
            print("<td>".$row["klas_ozn"]."</td>");
            print("<td>".$row["uru_br"]."</td>");
            print("<td>".$row["odabrani_kolegij"]."</td>");
            print("<td>".$row["odabrani_mentor"]."</td>");
            print("<td>".$row["kolegij1"]."</td>");
            print("<td>".$row["mentor1"]."</td>");
            print("<td>".$row["kolegij2"]."</td>");
            print("<td>".$row["mentor2"]."</td>");
            print("<td>".$row["ch1"]."</td>");
            print("<td>".$row["ch2"]."</td>");
            print("<td>".$row["ch3"]."</td>");
            print("<td>".$row["napomena"]."</td>");
            print("</tr>");

        }
        print("</table>");
 ?>

2 个答案:

答案 0 :(得分:1)

为什么不使用jQuery,因为看起来你已经在项目中使用了它。

$.get('update_table.php', {column: 'col 1', row: 'row 1'}).done(function(data){});

然后您可以删除与IE6和7相关的代码 因为jQuery应该在内部处理它。

https://api.jquery.com/jquery.get/

答案 1 :(得分:0)

您需要发送两个分区的行是:

xmlhttp.open("GET","update_table.php?newContent="+newContent+"&row="+rowvalue,true);

感谢html ,,希望这会对你有所帮助!我做了一个jsfiddle来看看

http://jsfiddle.net/aoak63dL/

这是你认为最需要的部分..

$('td').on('click', function(){
    var inx = $(this).index() ;
    var hdr = $(this).closest('table').find('th').eq(inx).text();
})