Question

My requirement is to display a row if all drop downs in the above row s value is not "Select Answer".If Any drop down s answer is "Select Answer" all the drop downs in the below row of its row should be hidden. How can i achieve that. Any idea.
Below is my HTML code..

 <table>
<tr>
    <td>
         <select  id="S1"  class="dropdown">
            <option value="" selected="selected">Select answer</option>
            <option value="1" >A</option>
            <option value="2">B</option>
            <option value="3">C</option>
        </select>
    </td>
            <td>
    <select id="S2"  class="dropdown">
        <option value="" selected="selected">Select answer</option>
        <option value="1">A</option>
        <option value="2" >B</option>
        <option value="3">C</option>
    </select>
    </td>

</tr>
<tr>
    <td>
    <select id="S2"  class="dropdown">
        <option value="" selected="selected">Select answer</option>
        <option value="1">A</option>
        <option value="2" >B</option>
        <option value="3">C</option>
    </select>
    </td>
            <td>
    <select id="S2"  class="dropdown">
        <option value="" selected="selected">Select answer</option>
        <option value="1">A</option>
        <option value="2" >B</option>
        <option value="3">C</option>
    </select>
    </td>
    </tr>
 </table>

Answer 1

我创建了一个jsFiddle,其中有工作守则。我建议加以修改,以使用更多的分辨率,而且你必须补充一些逻辑,以检查分数(最高点),以确保只显示需要显示的分数,但这应当使你有一个很好的起点来回答你的问题。

Answer 2

首先是使用直线风格的隐蔽,或最好用碎打。之后,情况如下:

$( select.dropdown ).bind( change ,function() {
    var showNext = true;
    $( select.dropdown:visible ).each( function() {
        if ( $(this).val() ==    ) showNext = false; 
    });
    if ( showNext ) {
       $( select.dropdown:hidden:first ).show();
    }
});

我认为,它可能做得更好,但不能坐在一个桌子上,你应该真正有你选择的标签内容。这需要藏匿,并与相关的选择显示。

Answer 3

首先,所有女方都应在一页上独一无二,这在你所指明的标志上并非一页。请参看以下法典:

$(function(){
var firstTr = $("table tr:first");
firstTr.next("tr").hide();

firstTr.find( select.dropdown ).bind( change ,function() {
    var showNextTr = $(this).val() != "";
    if(showNextTr){
      firstTr.find( select.dropdown ).each( function() {
          if ( $(this).val() ==    ){ 
             showNextTr = false; 
             return false;
          }
      });
    }

    if ( showNextTr ) {
       firstTr.next("tr").show();
    }
    else{
       firstTr.next("tr").hide();
    }
});
});

友情链接