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 ブロックの正しいセレクターを見つけようとしましたが、取得できません。

私がする必要があるのは、現在の行の href 属性のみを設定するように、if/else ブロックでセレクターを正しく取得することだけだと思います。

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 に答える