1

グリッドビューにいくつかのドロップダウンがあり、それぞれに 2 つの同じオプションがあります。これらすべてのドロップダウンから、option1 が選択された回数 (selectedIndex = 1) と 2 番目のオプションが選択された回数 (selectedIndex = 2) を使用して計算したいと思います。 jQuery。

<asp:GridView ID="gd1" runat="server" AutoGenerateColumns="False" 
        onrowdatabound="gd1_RowDataBound" >
        <Columns>
                   <asp:BoundField DataField="id"   Visible="False"/>
                   <asp:BoundField DataField="fullName" Visible="True"  
        HeaderText="Full Name"/>
                      <asp:TemplateField >
                          <ItemTemplate>
 <asp:DropDownList ID="ddl1" runat="server" ></asp:DropDownList>
                        </ItemTemplate>
                      </asp:TemplateField>

                      <asp:TemplateField >
                          <ItemTemplate>
 <asp:DropDownList ID="ddl2" runat="server"></asp:DropDownList>
                        </ItemTemplate>
                      </asp:TemplateField>

                      <asp:TemplateField >
                          <ItemTemplate>
 <asp:DropDownList ID="ddl3" runat="server"></asp:DropDownList>
                        </ItemTemplate>
                      </asp:TemplateField>

                      <asp:TemplateField>
                          <HeaderTemplate>
          <asp:Label ID="Count1" runat="server" Text="First Count"></asp:Label>
                          </HeaderTemplate>
                          <ItemTemplate>
          <asp:Label ID="CountSelected1" runat="server" ></asp:Label>
                          </ItemTemplate>
                      </asp:TemplateField>

                      <asp:TemplateField>
                          <HeaderTemplate>
       <asp:Label ID="Count2" runat="server" Text="Second Count"></asp:Label>
                          </HeaderTemplate>
                          <ItemTemplate>
           <asp:Label ID="CountSelected2" runat="server" ></asp:Label>
                          </ItemTemplate>
                      </asp:TemplateField>
       </Columns>

</asp:GridView>

最後の 2 列には、option1 と option2 の合計選択数を表示します。

4

3 に答える 3

1

最初のオプション: 2 つのグローバル変数を宣言できます

var first=0;
var second=0;

そして、次のようにします。

$(function(){
    $("#selectBox").change(function(){
        switch($(this).val())
        {
            case "0": first++;
                      break;
 case "1": second++;
                      break;
        }
    });
});

この関数はチェックボックス用に書かれています:

<select id="selectBox">
            <option value="0" id="first">FirstOption</option>
            <option value="1" id="second">SecondOption</option>
</select>

最初のオプションはあまり良くありませんが、迅速な解決策です。

2 番目のオプション:

選択をカウントできる jQuery ウィジェットを作成し、このウィジェットを使用してチェック ボックスをラップすることができます。これがウィジェットの例です（誰かのブログからコピーしましたが、ソースコードを取得するためのリンクを失いました。私の例が役立つことを願っています）

<script type="text/javascript">
    var Green = {
        // Set up the widget
        _create: function () {
        },
        _init: function () {
            this.setLevel(this.getLevel());
        },
        getLevel: function () { return this.options.level; },
        setLevel: function (x) {
            var greenLevels = this.options.greenLevels;
            var level = Math.floor(Math.min(greenLevels.length - 1, Math.max(0, x)));
            this.options.level = level;
            this.element.css({ background: greenLevels[level] });
        },
        options: {
            level: 5,
            greenLevels: ['#000', '#010', '#020', '#030', '#040', '#050', '#060', '#070', '#080', '#090', '#0a0', '#0b0', '#0c0', '#0d0', '#0e0', '#0f0', '#fff']
        },
        darker: function () {
            this.setLevel(this.getLevel() - 1);
        },
        lighter: function () {
            this.setLevel(this.getLevel() + 1);
        },
        off: function () {
            debugger;
            this.element.css({ background: 'none' });
            this.destroy();
        },
        _setOptions: function () {
            $.Widget.prototype._setOptions.apply(this, arguments);
            this._refresh();
        }
    };

    $(function () {
        (function ($, undefined) {
            $.widget('ui.green', Green);
        })(jQuery);
    });

    function on() {
        $('.targetDiv').green(
            { level: 8,
                greenLevels: ['#000', '#00f', '#088', '#0f0', '#880', '#f00', '#808', '#fff']
            });
    }

</script>

<p class="targetDiv">
    This is a test div text.</p>
<input type="button" value="On" onclick="return on()" />
<input type="button" value="Lighter" onclick="$('.targetDiv').green('lighter');" />
<input type="button" value="Darker" onclick=" $('.targetDiv').green('darker');" />
<input type="button" value="Off" onclick=" $('.targetDiv').green('off');" />
于 2012-09-03T11:33:03.707 に答える
1

RowDataBound イベントを使用する ドロップダウン リストの Onchange イベントで Javascript 関数を次のように宣言するには...

protected void grd_RowDataBound(object sender,GridViewRowEventArgs e)                     
{                         
  if (e.Row.RowType == DataControlRowType.DataRow)
  {                           
    DropdownList drpLst = ((DropdownList)e.Row.FindControl("ddl1"));
    Label lblCount2= (Label)e.Row.FindControl("Count2");

    drpLst.Attributes["onchange"]="calculate(this,'"+lblCount2.ClientID+"');"                   

  }   
}

Javascript:

var count=0;//This should be Global
function calculate(drpDownList,labelId) 
{
   if(drpDownList.selectedIndex==0)
     {
       count=count+1;
     }
  labelId.innerHTML=count;
}
于 2012-09-03T11:52:45.750 に答える
0

私はここで私の問題を解決します

動作する最終的なコード:

var collection = $('select.ddlJ');

for (var element in collection)
$(element).change(function(){})

 $(function() {
    $('select.ddlJ').change(function(e) {
        $(this).parent().parent().find('td:last').prev().find('span').html( 
            $(this).parent().parent().find( 'select.ddlJ' ).filter(function() {
                return $.trim($(this).val()) == 'm';
            }).length
         );
        $(this).parent().parent().find('td:last span').html( 
            $(this).parent().parent().find( 'select.ddlJ' ).filter(function() {
                return $.trim($(this).val()) == 'n';
            }).length
         );
    });
});
于 2012-09-05T14:39:43.993 に答える