Question

我正在创建一个程序，其中在每个GridView行中都有一个复选框和一个文本框，默认情况下分别取消选中和禁用。勾选复选框后，我需要触发一些JavaScript来启用该文本框，反之亦然，以便在未选中时使用。到目前为止，我这样做：

JS：

    <script type="text/javascript">
    function onholdev(index) {
        var chk = document.getElementById('<%=grdCons.Rows[index].FindControl("chkHold").ClientID %>');
        var txt = document.getElementById('<%=grdCons.Rows[index].FindControl("txtReason").ClientID %>');

        if (chk.checked == true) {
            txt.disabled = false;
        }
        else {
            txt.disabled = true;
            txt.value = "";
        }
    }
</script>

C＃（RowDataBound事件）

            CheckBox chkHold = ((CheckBox)e.Row.FindControl("chkHold"));
        chkHold.Attributes.Add("onchange", "onholdev(" + e.Row.RowIndex + ")");

但在JS中，它表示'index'变量不存在，在函数的第一行（以var chk开头）。我这样做了吗？

Answer 1

问题是索引在字符串内部，而它应该是一个参数，这解决了它：

 var chk = document.getElementById('<%=grdCons.Rows[' + index + '].FindControl("chkHold").ClientID %>');

另一行也是如此

Answer 2

由于复选框将呈现为输入，因此我们可以使用$('.check input')找到它，因为它是动态添加的，所以我们需要使用jquery bind将click函数添加到复选框。所以在这里我得到了chk = $('.check input');的检查控件。每次当用户选中复选框时，函数会调用。我在这里设置所有文本框的可见性，当用户点击它时会找到下一个使用.hde控制并移除课程$(this).parent().next().removeClass('hide');。因此，复选框旁边会显示文本框。

在您的情况下，我认为默认情况下您会创建文本框disabled=false

.hide is used to set visiblity false.you can do disabling by adding attribute disabled to the textbox

CSS

  .hide
        {
            display: none;
        }

设计师代码

<ItemTemplate>
<asp:CheckBox ID="cbEnergyItems" runat="server" CssClass="check" />
<input type="text" id="txtQty" style="width: 25px" class="hide"
  value="0" runat="server" />
    <%# Eval("something") %>                                                        
 </ItemTemplate>

Jquery的

  $('.check input').bind("click", function() {
                        var chk = $('.check input');
                        if ($(this).attr('checked')) {
                            //$(this).parent().next().removeClass('hide'); //removing the class to visible. you can do removing the attribute 
                              $(this).parent().next().removeAttr("disabled");
                            if ($(this).parent().next().val() == ""0"")
                                showStatus(true, "Please enter the quantity");
                        }
                        else {
                               $(this).parent().next("disabled","disabled").
                           // $(this).parent().next().addClass('hide');

                        }

                    });

我认为这可以解决您的问题。

Answer 3

感谢大家的帮助，我通过不在服务器端进行“解决”。有点懒，但节省了很多JS头痛。

GridView行的TemplateFields的JavaScript

3 个答案: