代码之家  ›  专栏  ›  技术社区  ›  Cudos

淘汰时预选第一个选项。js生成的无线电列表

  •  0
  • Cudos  · 技术社区  · 7 年前

    我是新手。js并设法生成单选按钮列表。但我不知道如何预选列表上的第一个单选按钮。以下是(我认为)代码重要部分的摘录:

    $.ajax({
        url: '/path/to/external/rest/api/' + zipCode,
        type: 'GET',
        context: document.body
    }).done(
        function (response) {
            $.each(response, function(key, droppoint) {
                self.droppoints.push(droppoint);
            });
        }
    ).fail(
    
    );
    

    HTML:

    <div data-bind="foreach: $parents[1].droppoints" >
      <label>
        <input class="droppoint_radio" type="radio"
               name="droppoint_location" 
               data-bind="attr: {value: number}" />
        <div class="droppoint_address">
          <div data-bind="text: company_name"></div>
        </div>
      </label>
    </div>
    
    1 回复  |  直到 7 年前
        1
  •  0
  •   jobB    7 年前

    您可以使用 checked 结合你可以添加一个可观察的 selectedPoint

    根据您的javascript,这可能如下所示:

    viewModel.selectedPoint = ko.observable();
    

    选中的 绑定到HTML:

    <div data-bind="foreach: $parents[1].droppoints" >
        <label>
            <input class="droppoint_radio" type="radio"
                name="droppoint_location" 
                data-bind="attr: {value: number},
                checked: $parents[2].selectedPoint" />
            <div class="droppoint_address">
                <div data-bind="text: company_name"></div>
            </div>
        </label>
    </div>
    

    最后,将第一个droppoint的数量设置为AJAX回调中的默认值:

    $.ajax({
        url: '/path/to/external/rest/api/' + zipCode,
        type: 'GET',
        context: document.body
    }).done(
        function (response) {
            $.each(response, function(key, droppoint) {
                self.droppoints.push(droppoint);
            });
            self.selectedPoint(response[0].number);
        }
    )