0

I am trying to create a dialog box with a checkbox, a user name and a combobox for roles which is enabled only when the checkbox is checked. I have the basic code running on a jsp page but how do i get it to work in a dialog box? All the components are rendered using google closure.

my js file

function combox ()
    {
    goog.events.listen((goog.dom.getElement('switch')), goog.events.EventType.CLICK,
            function(e) {
            var request = new goog.net.XhrIo();
            var cb = new Array();
       goog.events.listen(request, "complete", function(e){
        var xhr = /** @type {goog.net.XhrIo} */ (e.target);
        res = xhr.getResponseJson();
        var mycount = count(res.myrole);
        var content = new Array();
            var userlist = new Array();
            for(var k=0;k<mycount;k++)
            {
                content[k] = res.myrole[k].role;
            }
            var mycount1 = count(res.myusers);
            for(var l=0;l<mycount;l++)
            {
                userlist[l] = res.myusers[l].user;
            }
            var child = new Array();
            var container = goog.dom.getElement('c'); 
            for(var m=0;m<userlist.length;m++)
            {
              child[m] = goog.dom.createDom('div',{'id':'user'+(m+1)},userlist[m]);
              cb[m] = new goog.ui.ComboBox();
              cb[m].setUseDropdownArrow(true);
            for(var n=0;n<content.length;n++)
            {
              cb[m].addItem(new goog.ui.ComboBoxItem(content[n]));;
            }
            cb[m].render();
            goog.dom.append(container, child[m]);
    });
    });
}
function count(obj) {
   var count=0;
   for(var user in obj) {
      if (obj.hasOwnProperty(user)) {
         ++count;
      }
   }
   return count;
}

I'm getting proper response from my servlet, but I want these components in a dialog box(i.e a checkbox,username and a combobox for each user retrieved from my servlet.)

Chad Killingsworth
  • 14,360
  • 2
  • 34
  • 57
Arjun
  • 97
  • 11

1 Answers1

2

You should look into using a goog.ui.Dialog - http://docs.closure-library.googlecode.com/git/class_goog_ui_Dialog.html

Here is a demo of how to use one : http://closure-library.googlecode.com/git/closure/goog/demos/dialog.html

After instantiating one, you would use the setContent method to place your form as the content html of the dialog.

You can also extend the goog.ui.editor.AbstractDialog class ( http://docs.closure-library.googlecode.com/git/class_goog_ui_editor_AbstractDialog.html ), which helps manage an internal reference to a goog.ui.Dialog rather than directly creating one and gives convenient hide and show methods.

__

As a sidenote, it's typically viewed as an anti-pattern in Javascript to use the "new Array()" syntax rather than var userList = []; for reasons specified here and elsewhere.

Community
  • 1
  • 1
ne8il
  • 2,427
  • 1
  • 20
  • 18
  • I have a set of check boxes with Id's user1,user2 and so on and also set of combo boxes with Id's usersel1,usersel2 and so on. When a check box is checked (say suppose with Id user1) then corresponding combo box must be activated(i.e combo box with Id usersel1). I have the following code and isn't working. How do i achieve this behaviour? `for(var g=0;g – Arjun Sep 10 '13 at 04:46
  • Sorry it is ('user'+(g+1)) and ('usersel'+(g+1)) – Arjun Sep 10 '13 at 04:53
  • It's hard to read that code sample in a comment and it's not really related to this question - can you make a separate question for that? – ne8il Sep 10 '13 at 15:47
  • Here is the link for the above question [activate a combo box from a checkbox](http://stackoverflow.com/questions/18732891/activate-a-combobox-from-a-checkbox) – Arjun Sep 11 '13 at 04:52