Jquery UIでラジオボタンを作成する方法は？

Question

このチェックボックスをラジオボタンにするにはどうすればよいですか？ By bufferとBy polygonの前にラジオボタンを追加したいと思います。

dialog1.empty(); 
var header = $('<h5></h5>').text('By buffer'); 
var toggleBtn = $('<button><i id="toggle-icon" class="fa fa-circle"></i></button>').attr('id', 'toggle-buffer-btn').attr('class', 'btn btn-default btn-sm');      
var inputRadius = $('<input type="text"/>').attr('id', 'radius').attr('class', 'btn btn-default btn-sm').attr('disabled', 'disabled'); 
var helpLabel = $('<span id="help-label">Click and drag mouse to create buffer</span>'); 
var polyBufferChkbx = $('<input type="checkbox">').attr('id', 'polygon-buffer'); 
var polyBufferLabel = $('<span id="polygon-buffer-label"> &nbsp By polygon</span>'); 
var val; 

dialog1.append(header); 
dialog1.append(toggleBtn); 
dialog1.append(inputRadius); 
dialog1.append(helpLabel); 
dialog1.append('<br/>'); 
dialog1.append('<br/>'); 
dialog1.append(polyBufferChkbx); 
dialog1.append(polyBufferLabel); 

Answer 1

あなたはjQueryのUIを使用するつもりなら、なぜそれがあなたを助けることはできませ。

例：https://jsfiddle.net/Twisty/wfqv3orm/

HTML

<div id="dialog1"> 
</div> 

JavaScriptのリトルビット速いだけで構築し、私の意見ではすべてを一度に要素を追加する

$(function() { 
    var dialog1 = $("#dialog1"); 
    dialog1.empty(); 
    var header = $("<h5>", { 
    class: "dialog-header" 
    }).text("By buffer").appendTo(dialog1); 
    $("<button>", { 
    id: "toggle-buffer-btn", 
    class: "btn btn-default btn-sm" 
    }).appendTo(dialog1); 
    dialog1.find("button").append($("<i>", { 
    id: "toggle-icon", 
    class: "fa fa-circle" 
    })); 
    $("<input>", { 
    type: "text", 
    id: "radius", 
    class: 'btn btn-default btn-sm' 
    }).prop('disabled', true).appendTo(dialog1); 
    $("<span>", { 
    id: "help-label", 
    style: "margin-bottom: 2em;" 
    }).html("Click and drag mouse to create buffer").appendTo(dialog1); 
    $("<input>", { 
    type: "checkbox", 
    id: 'polygon-buffer' 
    }).appendTo(dialog1); 
    $("<label>", { 
    id: "polygon-buffer-label", 
    for: "polygon-buffer" 
    }).html("By polygon").appendTo(dialog1); 
    dialog1.controlgroup(); 
    var val; 
}); 

。