Question

这是我的第一个问题，如果结构不合理，请原谅我。

我正在使用C#学习MVC 5 Entity-Framework 6。

我正在尝试使用javascript来显示和检查checkbox及其div中封装的文本，以便隐藏/显示完整的checkbox和价值。

我正在努力为ID="??"和div创建一个独特的checkbox，以便我的javascript可以根据需要访问DOM的每个部分。

以下是我的观看代码：

@foreach (var item in ViewBag.allDocketTypes)
    {
        <div id="DockDIV @item.DocketTypeID" style="display:none" class="col-md-6">
            <input type="checkbox" class="input" id="DockCB @item.DocketTypeID" name="selectedDocketTypes" value="@item.DocketTypeID" />@item.DocketClassification
        </div>
    }

接下来是我用来检查checkbox的javascript函数，现在将.style = "display:none"的{{1}}更改为div：

.style = "display:block"

现在我在javascript执行时遇到以下错误：

function addDocketType() {
    var e = document.getElementById("DocketClassification");
    var strDocketTypeID = e.options[e.selectedIndex].value;

    document.getElementById("DockCB " & strDocketTypeID).checked = true;
    document.getElementById("DockDIV " & strDocketTypeID).style = "display:block";
};

关于如何正确设置这些对象的Uncaught TypeError: Cannot set property 'checked' of null的任何想法都将不胜感激。或者我也会更好地建议我如何展示和选中一个复选框以及它的价值。

Answer 1

如果可以的话，我设法通过@ stephen.vakil +1的帮助和指示来解决这个问题。）

简而言之，它只是语法......

在视图中，在尝试使用_语法内联创建唯一ID时使用razor

 @foreach (var item in ViewBag.allDocketTypes)
    {
        if (item.TypeSelected)
            {
                <div id="DockDIV_@item.DocketTypeID" style="display: block" class="form-group-sm"><input type="checkbox" class="form-control" id="DockCB_@item.DocketTypeID" name="selectedDocketTypes" value="@item.DocketTypeID" checked="checked"/>@item.DocketClassification</div>
            }
        else
            {
                <div id="DockDIV_@item.DocketTypeID" style="display: none" class="form-group-sm"><input type="checkbox" class="form-control" id="DockCB_@item.DocketTypeID" name="selectedDocketTypes" value="@item.DocketTypeID" title="TEST"/>@item.DocketClassification</div>
            }
    }

javascript中的字符串连接是使用+。

完成的

function addDocketType() {
    var e = document.getElementById("DocketClassification");
    var strDocketTypeID = e.options[e.selectedIndex].value;

    document.getElementById("DockCB_" + strDocketTypeID).checked = true
    document.getElementById("DockDIV_" + strDocketTypeID).style.display = "block"
};

我们有它......

使用剃刀动态生成DIV和CHECKBOX的唯一ID

1 个答案: