获取选择选项值已更改的行的列的值

问题描述:

我试图对允许用户给某些项目评分并在后台存储这些评分的网页建模。我有这样的桌子 项目标题|标题|评级。在评分栏中,我有条件地选择某些栏中的标签,否则有一些文字。我在选择哪个触发了javascript函数时添加了一个onchange事件,当选项的值被更改时,但是我想提取选择值已更改的行的project_id feild的值。我是一个新手在javascript中,所以我找不到任何可以解决我的问题,我需要该项目的id值,因为我需要将该值存储在我的数据库中,我已经通过Ajax调用它的工作。这里是我的表格: 代码:获取选择选项值已更改的行的列的值

<?php if($row['status']==='complete' && $result2->num_rows==0) 
      { ?> 

       <select id="rating select" onchange="rating()" class="form-control" name="projectrating"> 
        <option selected>0</option> 
        <option value="1" >1</option> 
        <option value="2">2</option> 
        <option value="3">3</option> 
        <option value="4">4</option> 
        <option value="5">5</option> 
       </select> 

      <?php } ?> 

       <?php if($row['status']==='complete' && $result2->num_rows > 0) 
      { $row2=$result2->fetch_assoc(); 
       $rating=$row2['rating']; 
       echo "You have already rated this Project!,You have given the project a rating of $rating"; 
       } ?> 

      <?php 
      if($row['status']!=='complete') { ?> 
       <?php echo "Ratings only for complete projects" ?> 





      <?php } ?> 
        </td> 
      <?php } ?> 

的Javascript :(我需要填写可变参数是没有价值的,所以我可以把它使用Ajax的PHP脚本发送)

<script> 

    function rating() 
    { 
     var xhttp = new XMLHttpRequest(); 
     xhttp.onreadystatechange = function() { 
    if (this.readyState === 4) { 
     if(this.status===400){ 
     alert("There was a problem while giving the rating"); 
    } 
     if(this.status===200) 
     { 

      alert("Rating given succesfully"); 
      window.location.reload(true); 


     } 

      } 
    }; 
     xhttp.open("POST", "rating.php", true); 
     xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
     var param= 
     xhttp.send(param); 

     } 

+0

什么是**评级()**功能?请显示您的js –

+0

发布javascript – user3930213

为了达到预期的结果,使用低于选项

选项1:

  1. 使用最接近tr和孩子,你可以改变得到完整的行值
  2. 每个单元可以通过以下方式获得 “EQ()文本()。”

Codepen - https://codepen.io/nagasai/pen/YVERRv

JS:

$(document).ready(function(){$('select').on('change',function(){ 
    var $td= $(this).closest('tr').children('td'); 
    var project= $td.eq(0).text(); 
    console.log(project) 
}) 
          }) 

选项2:使用带有parentElement和平原的childNodes javascript和使用等级()函数电平变化

HTML:

<select onchange="rating(this)" class="form-control" name="projectrating"> 

JS:

function rating(a){ 
    console.log((a.parentElement) .parentElement.childNodes[1].innerHTML) 
} 

a.parentElement会给td包含它的select和parentElement是tr元素,并且第一个孩子innerHTML给出第一列值

https://codepen.io/nagasai/pen/qmVQwp

+0

嗨,这可以在java脚本中完成?我不太了解jQuery库。 – user3930213

+0

请检查我的第二代codepen - https://codepen.io/nagasai/pen/qmVQwp使用普通的javascript –

+0

非常感谢你 – user3930213

第一,你不能使用多个ID的一个元素

<select id="rating" onchange="rating()" class="form-control" name="projectrating"> 

,那么你应该确定要发送

var paramToSend = document.getElementById("rating").value; 

什么让你的js将要去像这样

function rating(){ 
var paramToSend = document.getElementById("rating").value; 
var xhttp = new XMLHttpRequest(); 
xhttp.onreadystatechange = function() { 
    if (this.readyState === 4) { 
     if(this.status===400){ 
      alert("There was a problem while giving the rating"); 
     } 
     if(this.status===200){ 
      alert("Rating given succesfully"); 
      //window.location.reload(true); 
     } 

    } 
}; 
xhttp.open("POST", "rating.php", true); 
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
var param="postedParam=" + paramToSend ;  
xhttp.send(param); } 

所以在您的评级.php你会得到$ _POST ['postedParam']