从JSON数据渲染DataTables,如何在表上预选单选按钮?

我在我的数据集上渲染文本框和单选按钮。我能够在我的文本框内填充数据。但我如何根据JSON数据的值来选择单选按钮?


      $.getJSON(json, function(data) {
      table = $('#my_table').DataTable({
        "order":[[3, "desc"]],
        "bDestroy": true,
        data: data.items,
        columns: [{
          className: 'details-control',
          orderable: false,
          data: null,
          defaultContent: ''
        }, {
          className: 'eq',
          orderable: true,
          data:'eq'
        }, {
          className: 'prop',
          orderable: true,
          data: 'prop'
        }, {
          className: 'radio_type',
          orderable: false,
          data: null,
          render: function(data, type, row) {
            console.log(row.radio_type);
            return `<label class="radio-inline" for="true_${row.eq}_${row.prop}"><input id="true_${row.eq}_${row.prop}" value="true" type="radio" name="radio_type">True</label>
            <label class="radio-inline" for="false_${row.eq}_${row.prop}"><input id="false_${row.eq}_${row.prop}" value="false" type="radio" name="radio_type">False</label>
            <label class="radio-inline" for="ns_${row.eq}_${row.prop}"><input id="ns_${row.eq}_${row.prop}" value="ns" type="radio" name="radio_type">ns</label>`;
          }
        }, {
          className: 'notes',
          orderable: false,
          date: null,
          render: function(data, type, row) {
            return `<textarea class="form-control" rows="1" id="input_${row.eq}_${row.prop}">${row.notes}</textarea>`;
          }
        }]
      });
    });

我如何让单选按钮被选中基于 row.radio_type? 它总是会是要么 true, false or ns.

解决方案:

模板字元支持条件操作符 在每个单选按钮部分的结尾处添加一个三元操作符,然后在 > :

${row.radio_type == 'true' ? " checked" : ""}
${row.radio_type == 'false' ? " checked" : ""}
${row.radio_type == 'ns' ? " checked" : ""}

即:

return `<label class="radio-inline" for="true_${row.eq}_${row.prop}"><input id="true_${row.eq}_${row.prop}" value="true" type="radio" name="radio_type" ${row.radio_type == 'true' ? " checked" : ""}>True</label><label class="radio-inline" for="false_${row.eq}_${row.prop}"><input id="false_${row.eq}_${row.prop}" value="false" type="radio" name="radio_type" ${row.radio_type == 'false' ? " checked" : ""}>False</label><label class="radio-inline" for="ns_${row.eq}_${row.prop}"><input id="ns_${row.eq}_${row.prop}" value="ns" type="radio" name="radio_type" ${row.radio_type == 'ns' ? " checked" : ""}>ns</label>`;

给TA打赏
共{{data.count}}人
人已打赏
未分类

如何在ObjC中测试IBAction和Selector?

2022-9-8 11:44:38

未分类

读取文件而不截断,如果文件不存在,则创建文件

2022-9-8 11:44:40

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索