0

一个$.ajax函数正在返回一些我放入成功函数中的表中的数据。

这是我构建表格行的方式:

$.each(branchList, function(index,element) {
    $('table#tblViewEditAllBranches tbody').append('<tr class="viewEditRow">' +
        '<td class="deleteBranch">' +
            '<input type="checkbox" class="chkDeleteBranch" name="deleteBranches[]" value="' + element['id'] + '" /><br />' +
            '<input type="submit" class="cancelListEditBranch edit hideOnLoad" value="Cancel" title="Cancel editing this branch" /><br />' +
            '<input type="submit" class="submitListEditBranch edit hideOnLoad" value="Save" title="Save the changes" />' +
        '</td>' +
        '<td class="viewEditBranchName">' +
            '<label class="viewBranchName detailDisplay">' + element['name'] + '</label>' +
            '<input type="text" class="edit editBox editName hideOnLoad" value="' + element['name'] + '" /><br /><br />' +
            '<label id="lblBranchesListEditError" class="errorMsg"></label>' +
        '</td>' +
        '<td class="viewEditBranchUrl">' +
            '<label class="viewBranchUrl detailDisplay"><a href="#" class="branchDetailLink" title="Click to go the branch\'s web page">' + element['url'] + '</a></label>' +
            //'<label class="viewBranchUrl detailDisplay">' + element['url'] + '</label>' +
            '<input type="text" class="edit editBox editUrl hideOnLoad" value="' + element['url'] + '" />' +
        '</td>' +
    '</tr>');
    // Get the first part of the url
    var targetFolder = BuildUrlTargetFolder();
    console.log('full url:' + targetFolder + '/index.php/coverage-area/' + element['url']); // Displays correct url for the current branch
    // Set the href attribute for the branch link otherwise have an empty anchor tag
    if (element['url'] !== '') {
        $(this).find('tr a.branchDetailLink').attr('href', targetFolder + '/index.php/coverage-area/' + element['url']);
    } else {
        $(this).find('tr a.branchDetailLink').attr('href', '#');
    }
});

如您所见,在代码的底部,在迭代到下一个表行之前,我正在构建链接,然后尝试设置 href 属性。

正如当前的代码一样,控制台输出显示正确的 url,因为每一行都被迭代。但是,发生的事情是所有 href 属性都设置为检索到的最后一个 url。因此,在每次迭代中,代码会将表中的所有链接设置为当前 url。

我尝试通过更改选择器并检查控制台输出来为 if/else 块找到正确的选择器,但我无法得到它。

认为我需要做的就是在 if/else 块中正确设置选择器,以便它只设置当前行的 href 属性。

4

1 回答 1

1

为什么不先构建 URL,然后在添加 HTML 时附加它?这样您就不必在 DOM 上进行选择来查找链接。

此外,选择每个表之外的表将为您提供速度提升。

  var myTable = $('table#tblViewEditAllBranches tbody');
  $.each(branchList, function(index,element) {

        // Get the first part of the url
        var targetFolder = BuildUrlTargetFolder();
        var branchUrl = '#';
        console.log('full url:' + targetFolder + '/index.php/coverage-area/' + element['url']); // Displays correct url for the current branch
        // Set the href attribute for the branch link otherwise have an empty anchor tag
        if (element['url'] !== '') {
            branchUrl =  targetFolder + '/index.php/coverage-area/' + element['url'];
        }

        myTable.append('<tr class="viewEditRow">' +
            '<td class="deleteBranch">' +
                '<input type="checkbox" class="chkDeleteBranch" name="deleteBranches[]" value="' + element['id'] + '" /><br />' +
                '<input type="submit" class="cancelListEditBranch edit hideOnLoad" value="Cancel" title="Cancel editing this branch" /><br />' +
                '<input type="submit" class="submitListEditBranch edit hideOnLoad" value="Save" title="Save the changes" />' +
            '</td>' +
            '<td class="viewEditBranchName">' +
                '<label class="viewBranchName detailDisplay">' + element['name'] + '</label>' +
                '<input type="text" class="edit editBox editName hideOnLoad" value="' + element['name'] + '" /><br /><br />' +
                '<label id="lblBranchesListEditError" class="errorMsg"></label>' +
            '</td>' +
            '<td class="viewEditBranchUrl">' +
                '<label class="viewBranchUrl detailDisplay"><a href=' + branchUrl + ' class="branchDetailLink" title="Click to go the branch\'s web page">' + element['url'] + '</a></label>' +
                '<label class="viewBranchUrl detailDisplay">' + element['url'] + '</label>' +
                '<input type="text" class="edit editBox editUrl hideOnLoad" value="' + element['url'] + '" />' +
            '</td>' +
        '</tr>');

    });
于 2013-02-06T01:47:12.173 回答