動態複選框不工作的dojo對話框

Question

如果我提出基本問題，請原諒我。我剛剛javascript ...

我想做一個對話框，動態地創建一個複選框列表出現在這個對話框，每當用戶請求顯示一個。 如果複選框的數量從定義的寬度增加，對話框應該有滾動條來滾動。 我能夠創建對話框（雖然不是一個非常優雅的解決方案），但有1個問題...

出現在Windows資源管理器9中的對話框有一個滾動條，如果我嘗試持有滾動條並移動它。作品在Firefox不錯..

任何幫助表示讚賞..

代碼：

function filterLocationDisplay() 
{ 
    destroyElement(FILTER_TABLE_ID); 

    var clientPrefs = [ 
    {"MSISDN":"0", "display":true}, 
    {"MSISDN":"1", "display":false}, 
    {"MSISDN":"2", "display":true}, 
    {"MSISDN":"3", "display":false},   
    {"MSISDN":"4", "display":true}, 
    {"MSISDN":"5", "display":false}, 
    {"MSISDN":"6", "display":true}, 
    {"MSISDN":"7", "display":false},   
    {"MSISDN":"8", "display":false}, 
    {"MSISDN":"9", "display":false}, 
    {"MSISDN":"10", "display":true}, 
    {"MSISDN":"20", "display":false}, 
    {"MSISDN":"30", "display":false},   
    {"MSISDN":"40", "display":false}, 
    {"MSISDN":"50", "display":true}, 
    {"MSISDN":"60", "display":false}, 
    {"MSISDN":"70", "display":true}, 
    {"MSISDN":"000", "display":true}, 
    {"MSISDN":"100", "display":false}, 
    {"MSISDN":"200", "display":true}, 
    {"MSISDN":"300", "display":false},   
    {"MSISDN":"400", "display":true}, 
    {"MSISDN":"500", "display":false}, 
    {"MSISDN":"600", "display":true}, 
    {"MSISDN":"700", "display":false},   
    {"MSISDN":"800", "display":false}, 
    {"MSISDN":"900", "display":false}, 
    {"MSISDN":"1000", "display":true}, 
    {"MSISDN":"2000", "display":false}, 
    {"MSISDN":"3000", "display":false},   
    {"MSISDN":"4000", "display":false}, 
    {"MSISDN":"5000", "display":true}, 
    {"MSISDN":"6000", "display":false}, 
    {"MSISDN":"7000", "display":true},     
    {"MSISDN":"8000", "display":false}   
    ]; 

    var cbFilterDivRef; 
    var cbDialogRef; 
    if(undefined == dojo.byId("filterDivID") || null == dojo.byId("filterDivID")) 
    { 
     var filterDivSubmitButton = new dijit.form.Button(
        { 
         type:"submit", 
         label:"Submit", 
         name:"filterPrefsSubmitButton", 
         id:"filterPrefsSubmitButtonId", 
         dojoType: "dijit.form.Button", 
         onClick:function() { onFilterSubmit("submit"); 
        }}); 

     var filterDivSelectAllButtonRef = new dijit.form.Button(
        { 
         type:"button", 
         label:"Select all", 
         name:"filterPrefsSelectAllButton", 
         id:"filterPrefsSelectAllButtonId", 
         dojoType: "dijit.form.Button", 
         onClick:function() { onFilterSubmit("all"); 
        }}); 

     var filterDivSelectNoneButtonRef = new dijit.form.Button(
        { 
         type:"button", 
         label:"Unselect all", 
         name:"filterPrefsSelectNoneButton", 
         id:"filterPrefsSelectNoneButtonId", 
         dojoType: "dijit.form.Button", 
         onClick:function() { onFilterSubmit("none"); 
        }}); 

     cbFilterDivRef = dojo.create("div", 
         { 
          id: "filterDivID" , 
          style: {"overflow": "scroll", 
            "overflow": "scroll", 
            "width": "350px", 
            "height": "400px"}, 
         }, dojo.byId("hiddenDiv"), "first"); 

     filterDivSelectAllButtonRef.placeAt(cbFilterDivRef, "last"); 
     filterDivSelectNoneButtonRef.placeAt(cbFilterDivRef, "last");    
     filterDivSubmitButton.placeAt(cbFilterDivRef, "last"); 
    } 
    else { 
     cbFilterDivRef = dojo.byId("filterDivID"); 
    } 

    if(undefined == dojo.byId("FilterDlgID") || null == dojo.byId("FilterDlgID")) 
    { 

     cbDialogRef = new dijit.Dialog({ 
        title: "Please select the assets to be displayed", 
        id:"FilterDlgID", 
        style:{"border": "3px groove", "overflow": "none"}, 
        content:cbFilterDivRef, 
        autofocus: !dojo.isIE, // NOTE: turning focus ON in IE causes errors when reopening the dialog 
        refocus: !dojo.isIE 
      }); 
    }  
    else { 
     cbDialogRef = dijit.byId("FilterDlgID"); 
    } 

    var filterTable = dojo.create("table", 
           { 
            id:FILTER_TABLE_ID, 
            name:FILTER_TABLE_ID, 
            style:{"position":"relative"} 
           }, 
           cbFilterDivRef, "first"); 
    for (var msisdnNo = 0; msisdnNo < clientPrefs.length ; ++msisdnNo) 
    { 
     var row = filterTable.insertRow(filterTable.rows.length);// create a table to contain the checkbox 
     // and Asset ID. 
     var assetId = clientPrefs[msisdnNo].MSISDN; 
     var checkBoxCell = row.insertCell(0); checkBoxCell.setAttribute("id", assetId+".cell"); 
     var assetIdCell = row.insertCell(1); assetIdCell.innerHTML = assetId; 

     var checkBox = dijit.byId(assetId+ID_CB_SUFFIX) ; 
     //destroy the checkBox widget .. if its created.. 
     if (null != checkBox || undefined != checkBox) 
     { 
      checkBox.destroy(); 
     } 
     checkBox = new dijit.form.CheckBox({ 
       id:  assetId+ID_CB_SUFFIX, 
       name: assetId, 
       value: "true" 
       });    
     checkBox.setChecked(clientPrefs[msisdnNo].display); 
     checkBox.placeAt(assetId+".cell", "first"); 
    } 
    cbDialogRef.show(); 

} 

/** 
* 
*/ 
function onFilterSubmit(option) 
{ 
    var filterTable = dojo.byId(FILTER_TABLE_ID); //document.getElementById(FILTER_TABLE_ID); 
    if(null == filterTable || undefined == filterTable) 
    { 
     return false; 
    } 
    // get the list of checkboxes xhc 
    var checkBoxesList = null; 
    if("submit" != option) { 
    checkBoxesList = dojo.query('input[type="checkbox"]', FILTER_TABLE_ID); 
    } 
    else { 
     checkBoxesList = dojo.query('input:checked', FILTER_TABLE_ID); 
    } 
    alert(checkBoxesList.length); 
    var returnObject = new Array(); 
    var assetCount = 0; 
    for(var assetCount =0 ; assetCount < checkBoxesList.length; assetCount++) 
    { 
     var assetDisplayPrefCb = dijit.getEnclosingWidget(checkBoxesList[assetCount]); 
     var assetId = assetDisplayPrefCb.get("name"); 
     switch (option) { 
      case "all": 
      { 
       assetDisplayPrefCb.setChecked(true); 
       break; 
      } 
      case "none": 
      { 
       assetDisplayPrefCb.setChecked(false); 
       break;      
      } 
      case "submit": 
      default: 
      { 
       returnObject[assetCount] = new Object(); 
       returnObject[assetCount].assetId = assetId; 
       returnObject[assetCount].display = assetDisplayPrefCb.getValue("checked");//checked; 
      } 
     } 
    } 
alert("returnObject.length == " + returnObject.length); 
return returnObject; 
}// onSubmit(option) 

Answer 1

我發現這段代碼的幾個語法錯誤（見註釋）。我並不是說它會解決滾動問題，但是它們應該被修復......

cbFilterDivRef = dojo.create("div",{ 
         id: "filterDivID", 
         style: {"overflow": "scroll", 
           "overflow": "scroll", //remove duplicate 
           "width": "350px",  
           "height": "400px"  
         }, //remove comma after bracket 
        }, 
       dojo.byId("hiddenDiv"), "first");