javascript - Knockout.js を使用してコンボ ボックスで動的に作成されたオプションを保持する必要がある

Question

選択ボックスに「オプション」を動的に作成するコードセットがあります。しかし、Knockout を使用しているため、新しく作成したオプションを選択してクリックすると、削除されます。ふふっ!!!!

したがって、作成スクリプトは次のとおりです。

    function createNewGroup()
    {

        var htmlSelect = document.getElementById('groups');
        var optionValue = document.getElementById('newgroupname');

        if (optionValue.value === '')
        {
            alert('Please enter group name.');
            optionValue.focus();
            return false;
        }

        if (isOptionAlreadyExist(htmlSelect, optionValue.value))
        {
            optionValue.value = "";
            alert('Group name already exists.\n\nPlease try again.');
            optionValue.focus();
            return false;
        }

        var selectBoxOption = document.createElement("option");
        selectBoxOption.value = optionValue.value;
        selectBoxOption.text = optionValue.value;
        htmlSelect.add(selectBoxOption, null);

        optionValue.value = "";
        alert("New group has been added successfully.");
        optionValue.focus();
        return true;

    };

これは KNOCKOUT オブザーバブルであるため、選択したときにボックス内に保持する方法、さらにその新しい値を JSON オブジェクトに戻す方法を教えてください。その例を次に示します。

{「グループ」:[

    {
        "groupname" : "Administrator",
        "attr" : {  "id" : "li.attr.node_1",
                    "href" : "#", 
                    "data-bind" : "click: grpMgmt('Administrator');" }
    },
    {
        "groupname" : "Guest",
        "attr" : {  "id" : "li.attr.node_2",
                    "href" : "#", 
                    "data-bind" : "click: grpMgmt('Guest');"  }
    }
]

}

したがって、管理者ユーザーは新しいユーザーを作成できるため、次のようになります。

{「グループ」:[

    {
        "groupname" : "Administrator",
        "attr" : {  "id" : "li.attr.node_1",
                    "href" : "#", 
                    "data-bind" : "click: grpMgmt('Administrator');" }
    },
    {
        "groupname" : "Guest",
        "attr" : {  "id" : "li.attr.node_2",
                    "href" : "#", 
                    "data-bind" : "click: grpMgmt('Guest');"  }
    }
],

"ユーザー":[

    {
        "groupname" : "Joes Users",
        "attr" : {  "id" : "li.attr.node_1",
                    "href" : "#", 
                    "data-bind" : "click: grpMgmt('Joe');" }
    }
]

}

わかりました、今は書くのをやめます...ありがとう...