如何在jQuery中提取元素的递增ID [英] How to pull the Incrementing id of the elements in the jquery

问题描述

问题是，当我尝试通过使用$（＃[rowcount] .Service_Line）。change（function（）{来拉动递增ID时，由于每个循环的行数都为++，所以它不能正常工作如果我有一组ID为[1] .Service_Line，[2] .Service_Line，[3] .Service_Line，...的行，请帮忙，以便我可以从数据库
**中填充下拉列表。 ....然后我如何使用$符号在jquery中获取它们。**

The problem is when i try to pull the incrementing id's by using $("#[rowcount].Service_Line").change(function () { as the rown count goes ++ for every loop it's not working can any one please help so that i can populate the dropdowns from the database ** if i have a set of rows with id's like [1].Service_Line,[2].Service_Line,[3].Service_Line,.......then how can i get them in jquery using $ symbol.**

以下是从源代码中html读取的代码

Here is the code as follows of html from the view source

 <table id="dataTable" border="0" cellpadding="0" cellspacing="0">
        <thead>
            <tr>
                <th>UserName</th>
                <th>Password</th>
                <th>Service line</th>
                <th>Track</th>
                <th>subtrack</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            @if (Model != null && Model.Count > 0)
             {
                int j = 0;
                foreach (var i in Model)
                {
                    <tr id="TemplateRow" style="border:1px solid black">
                        <td>@Html.TextBoxFor(a => a[j].UserName)</td>
                        <td>@Html.TextBoxFor(a => a[j].Password)</td>
                        <td>
                            @if (ViewBag.ServiceLineList != null)
                            {
                                @Html.DropDownListFor(a => a[j].Service_Line, ViewBag.ServiceLineList as SelectList, "--Select--", new { @id = "Service_Line", @class = "wrapper-dropdown Service_Line" })
                            }
                        </td>
                        <td>
                            @Html.DropDownListFor(a => a[j].Track, new SelectList(" "), "--Select--", new { @id="Track", @class = "wrapper-dropdown Track" })
                        </td>
                        <td>
                            @Html.DropDownListFor(a => a[j].Sub_Track, new SelectList(" "), "--Select--", new { @class = "wrapper-dropdown Sub_Track" })
                        </td>

                        <td>
                            @if (j > 0)
                            {
                                <a href="#" class="remove">Remove</a>
                            }
                        </td>
                    </tr>
                    j++;
                }
             }
        </tbody>
    </table>

Jquery代码如下

The Jquery code is as follows

 $(document).ready(function () {
    /* 1. Initialise our variable to keep count of the rows added */
    var rowcount = 1;

    //Add new row
    $("#addNew").click(function (e) {
        e.preventDefault();
        var $tableBody = $("#dataTable");
        var $trLast = $tableBody.find("tr:last");

        // 2. Create the new id with the row count
        var newId = "TemplateRow-" + rowcount;

        // 3. clone the row with our new id
        var $trNew = $trLast.clone(true).prop({ id: newId });

        // 4. rename each input and give an id
        $.each($trNew.find(':input'), function (i, val) {

            oldName = $(this).attr('name');
            inputParts = oldName.split(".");

            // set the  name and id with the base name and rowcount
            $(this).attr('name', '[' + rowcount + '].' + inputParts[1]);
            $(this).attr('id', '[' + rowcount + '].' + inputParts[1]);

            $(this).removeClass("input-validation-error");
        });
        $("#[rowcount].Service_Line").change(function () {
            $.get("/Users/GetTrackList", { Service_Line_ID: $("#[rowcount].Service_Line").val() }, function (data) {
                $("#[rowcount].Track").empty();
                $.each(data, function (index, row) {
                    $("#[rowcount].Track").append("<option value='" + row.Track_ID + "'>" + row.Track_Options + "</option>")
                });
            });
        })

        $trLast.after($trNew);

        rowcount++;
    });
});

问题是当我尝试使用$（＃[rowcount]从jquery中提取克隆行的id时.Service_Line）。change（function（）{无法正常工作，请提供帮助

The problem is when i try to pull the id's of cloned row from the jquery using $("#[rowcount].Service_Line").change(function () { it's not working can any one please help

推荐答案

注意如何使用变量 rowcount 在这里的字符串中：

Notice how you use the variable rowcount in a string here:

'[' + rowcount + '].'

并注意如何在此处以字符串形式使用它：

And notice how you try to use it in a string here:

"#[rowcount].Service_Line"

看看区别吗？在后一个示例中，您实际上并没有使用 rowcount 变量，您只有一个字符串，其中包含文字文本 rowcount 。就像在前面的示例中一样使用变量：

See the difference? In the latter example you're not actually using the rowcount variable, you just have a string which contains the literal text "rowcount". Use the variable just like you did in the former example:

"#[" + rowcount + "].Service_Line"

（在您要在字符串中使用变量的其他任何地方重复此操作。）

(Repeat this for any other places where you want to use a variable in a string.)

你甚至可能是能够使用更新的模板文字语法：

You may even be able to use the somewhat newer template literal syntax:

`#[${rowcount}].Service_Line`

（请注意，Stack Overflow上此处突出显示的语法当前无法正确突出显示此语法。）

(Note that the syntax highlighting here on Stack Overflow currently doesn't highlight this syntax correctly.)

但是在这两种语法中，关键的区别在于使用变量之间与仅使用带有变量名称的字符串相比。

But in either syntax, the key difference is between using the variable vs. just using a string with the name of the variable.

这篇关于如何在jQuery中提取元素的递增ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！