0

我有一个 Knockout js foreach 循环围绕一个返回多个用户的表和一个搜索按钮,供每个返回的用户搜索该记录。按钮和数据按应有的方式绘制,但是当我单击任何搜索按钮时,它只返回第一个用户。我相信这是因为搜索按钮的 id 总是相同的,需要与 DOM 交互以添加每个功能?这是正确的,如果是这样,这是如何完成的?

    <!-- ko foreach: $data -->
    <table class="table table-striped, table-bordered" id="customer-results-policy">
        <thead>
            <tr>
                <th>
                    Title
                </th>
                <th>
                    First Name
                </th>
                <th>
                    Surname
                </th>
                <th>
                    Date of birth
                </th>
                <th>
                    Email
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <span data-bind="text: Customer.Title"></span>
                </td>
                <td>
                    <span data-bind="text: Customer.Forename"></span>
                </td>
                <td>
                    <span data-bind="text: Customer.Surname"></span>
                </td>
                <td>
                    <span data-bind="dateString: Customer.DateOfBirth"></span>
                </td>
                <td>
                    <div><input type="text" id="email-search-box-customer" class="span3 search-query" readonly="readonly" data-bind="value: Customer.Email"  /> <br/>
                    <button type="submit" data-bind="click: $parent." class="btn btn-primary submit-email-search-customer">Search for this customer</button>  </div>

                </td>
            </tr>
        </tbody>
    </table>
    <!-- /ko -->

JS

$('#page-parent').on('click', '.submit-email-search-customer', function () {

        $('.submit-email-search-customer').each(function() {
        });

        var email = $('#email-search-box-customer').val();

        var dataExists;
        {
            dataExists = viewModel.refreshViewByEmail(email);
        }

        if (!dataExists) {
            $('#error-message').html("<strong>The email address wasn't recognised -- please check and try again</strong>");
            $('#error-display').show('slow');
            return false;
        } else {
            $('#search-results-many').hide();
            $('#customer-results-email').show();
            $("#search-results").show('slow');
            $("#modify-button").show('slow');
            $("#customer-modify").show();
            $("#account-results").show();
            $("#address-results").show();

        }
4

1 回答 1

1

首先,您不能在 foreach 中使用常量值作为 id,因为这会使您的 html 具有多个具有相同 id 的元素(这是不允许的)

而且因为您使用敲除来管理您的模板,所以我应该使用敲除点击绑定来管理点击事件。请参阅淘汰赛的文档 http://knockoutjs.com/documentation/click-binding.html

于 2013-02-27T10:43:24.200 回答