使用radioButton時的奇怪行爲（）

Question

下面的代碼給了我一些頭痛的問題。 這是一個非常簡單的應用程序，有2個單選按鈕和一個按鈕。這個應用程序的想法是在電子表格中記錄所選單選按鈕的值。 現在，如果我選擇第一個單選按鈕（「one」），然後切換到第二個單選按鈕（「two」），然後回到「one」並單擊「Record」按鈕，應用程序將在電子表格。這種積累的選擇。

不知道我說清楚了，但這裏有模擬問題的步驟：

1以下運行的應用; 2-選擇單選按鈕「one」，然後選擇「two」和「one」並按下「Record」按鈕; 3-檢查電子表格中的重複值。

您繼續點擊單選按鈕的次數越多，記錄的重複值越多。

任何想法爲什麼發生這種情況，我該如何克服這個問題？

function myAppFunction() { 
var mydoc = SpreadsheetApp.getActiveSpreadsheet(); 
var app = UiApp.createApplication().setTitle('Here is the title bar'); 
var panel = app.createVerticalPanel().setId('panel'); 

//using setName will give you the ability to get the value 
var myRadio1 = app.createRadioButton("group","one").setName('myRadio1').setId('myRadio1'); 
var myRadio2 = app.createRadioButton("group","two").setName('myRadio2').setId('myRadio2'); 
var button = app.createButton("Gravar").setId("record_"); 
//A label will be used to give feedback on the value of the checkBox 
var infoLabel = app.createLabel('Check the box and click submit').setId('infoLabel'); 

//handlers 
var handler = app.createServerChangeHandler('radio1'); 
handler.addCallbackElement(panel); 
myRadio1.addClickHandler(handler); 

var handler2 = app.createServerChangeHandler('radio2'); 
handler2.addCallbackElement(panel); 
myRadio2.addClickHandler(handler2); 


//put everything in the UI 
panel.add(myRadio1);  
panel.add(myRadio2); 
panel.add(button); 
panel.add(infoLabel); 

app.add(panel); 
mydoc.show(app); 
} 
function radio1(e){ 
var app = UiApp.getActiveApplication(); 
app.getElementById('myRadio2').setValue(false); 
app.getElementById('infoLabel').setText('one is: ' + e.parameter.myRadio1); 
var panel = app.getElementById("panel"); 
var button = app.getElementById("gravar"); 
var handler = app.createServerClickHandler("record_"); 
handler.addCallbackElement(panel); 
button.addClickHandler(handler); 
return app; 
} 

function radio2(e){ 
var app = UiApp.getActiveApplication(); 
app.getElementById('myRadio1').setValue(false); 
app.getElementById('infoLabel').setText('two is: ' + e.parameter.myRadio2); 
var button = app.getElementById("gravar"); 
var handler = app.createServerClickHandler("gravar_"); 
handler.addCallbackElement(app.getElementById("panel")); 
button.addClickHandler(handler); 

return app; 
} 
function record_(e) { 
var ss = SpreadsheetApp.getActiveSpreadsheet(); 
var sheet = ss.getSheetByName("Sheet1"); 
var lastRow = sheet.getLastRow(); 
var freeCell = sheet.getRange("A1").offset(lastRow, 0); 
freeCell.setValue(e.parameter.myRadio1); 
} 

Answer 1

單選按鈕必須具有相同的名稱在正常異或模式下工作，如果你指的是doc，你會在一個標準的面板使用時請注意，這是必需的。 下面是一個簡單的例子：

function radiotest() { 
    var app = UiApp.createApplication(); 
    var panel = app.createVerticalPanel(); 
    var radioValue = app.createTextBox(); 
     radioValue.setId("radioValue").setName("radioValue").setVisible(false); 
    for(var i = 1; i < 10; i++){ 
    var name = 'choice '+i; 
    var handler = app.createClientHandler().forTargets(radioValue).setText(name); 
    panel.add(app.createRadioButton('radio',name).addValueChangeHandler(handler)); 
    } 
    panel.add(radioValue); 
    var getit=app.createButton("Valide").setId("val"); 
    panel.add(getit)     
    var handler = app.createServerHandler("valide") 
    handler.addCallbackElement(panel) 
    getit.addClickHandler(handler); 
    app.add(panel); 
SpreadsheetApp.getActiveSpreadsheet().show(app);// show app 
} 
// 
function valide(e){ ;// This function is called when key "validate" is pressed 
    var sh = SpreadsheetApp.getActiveSheet(); 
    var ss = SpreadsheetApp.getActiveSpreadsheet(); 
    var RadioButton = e.parameter.radioValue;    
    sh.getRange('A1').setValue(RadioButton); 
    var app = UiApp.getActiveApplication(); 
    return app; 
}​ 

Answer 2

我不明白你的代碼的行爲，但我認爲這是不恰當的和過於複雜。

首先創建兩個單選按鈕，將它們的名稱設置爲「group」，這是正確的，但在創建後立即用「myRadio1」和「myRadio1」分別覆蓋它們的名稱，它會強制您將服務器更改處理程序添加到每個單選按鈕。

如果您將兩個單選按鈕保留爲「group」，它們將在點擊它們時自動切換到對方。因此，您不需要向它們添加點擊處理程序。

因爲它們共享相同的名稱：「group」，您將能夠使用「e.parameter」訪問它們的狀態（如果第一個單選按鈕被選中則爲「false」，如果第二個被選中則爲「true」）。確認按鈕的點擊處理程序的回調函數中的「group」參數。

這裏是你的代碼簡化和固定：

function myAppFunction() { 
    var mydoc = SpreadsheetApp.getActiveSpreadsheet(); 
    var app = UiApp.createApplication().setTitle('Here is the title bar'); 
    var panel = app.createVerticalPanel().setId('panel'); 

    // Create the radio buttons and add it to the panel 
    var myRadio1 = app.createRadioButton("group","one"); 
    var myRadio2 = app.createRadioButton("group","two"); 
    panel.add(myRadio1);  
    panel.add(myRadio2); 

    // Create the apply button, add click handler and add it to the panel 
    var button = app.createButton("Gravar").addClickHandler(app.createServerHandler("record_").addCallbackElement(panel)); 
    panel.add(button); 

    // Create the label and add it to panel 
    var infoLabel = app.createLabel('Check the box and click submit'); 
    panel.add(infoLabel); 

    // Add the panel in the GUI 
    app.add(panel); 

    // Show the GUI in the spreadsheet 
    mydoc.show(app); 
} 

function record_(e) { 
    var ss = SpreadsheetApp.getActiveSpreadsheet(); 
    var sheet = ss.getSheetByName("Sheet1"); 
    var lastRow = sheet.getLastRow(); 
    var freeCell = sheet.getRange("A1").offset(lastRow, 0); 
    freeCell.setValue(e.parameter.group); 
}