ASP.NET

ASP.NET RSS

Listbox Related Matter

Please support our ASP.NET advertiser: Intel Parallel Studio Home

•

Join Date: Jun 2003

Posts: 313

Reputation: red_evolve is on a distinguished road

Solved Threads: 0

red_evolve red_evolve is offline

Offline

Posting Whiz

Listbox Related Matter

Dec 20th, 2005

Hi all,

I'm relatively new to ASP.NET - used to code in Coldfusion.
I've got this control created in a page <asp:listbox>.
I also have a javascript function in the same page to add listitems into the listbox on certain client calls such as the following:-

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
var anOption = document.createElement("OPTION");
obj.add(anOption); 
anOption.text = "foo";
anOption.value = "1";
var anOption = document.createElement("OPTION");
obj.add(anOption); 
anOption.text = "foo";
anOption.value = "1";

I am sure that the items are added into the listbox as I can see it on the front end. Okay the problem is, when I trigger a function call in the vb language, I get listbox1.Items.Count = 0. It should be 1 there. So I'd like to find out from fellow ASP.NET developers if the asp's server control will take note of the listitems updated via javascript.

Thanks in advance.

"Study the past if you would define the future" - Confucius

•

Join Date: Jul 2005

Posts: 483

Reputation: campkev is an unknown quantity at this point

Solved Threads: 19

campkev

Offline

Posting Pro in Training

Re: Listbox Related Matter

Dec 20th, 2005

I might be able to help you with the .Net side, but I am not as good as you with the javascript. Can you paste the rest of the javascript that adds the option to the listbox?

•

Join Date: Jun 2003

Posts: 313

Reputation: red_evolve is on a distinguished road

Solved Threads: 0

red_evolve red_evolve is offline

Offline

Posting Whiz

Re: Listbox Related Matter

Dec 21st, 2005

Hey kev, thanks in advance.
Here's the function in javascript:-

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
function addOptionToListBox(lsVal, lsNam, obj) {
            var anOption = document.createElement("OPTION");
            obj.add(anOption);
            anOption.text = lsNam; 
            anOption.value = lsVal;
        }
function addOptionToListBox(lsVal, lsNam, obj) {
            var anOption = document.createElement("OPTION");
            obj.add(anOption);
            anOption.text = lsNam; 
            anOption.value = lsVal;
        }

Then onclick of a button, I am trying to get the value of listbox1.Items.Count in vb.

"Study the past if you would define the future" - Confucius

•

Join Date: Jul 2005

Posts: 483

Reputation: campkev is an unknown quantity at this point

Solved Threads: 19

campkev

Offline

Posting Pro in Training

Re: Listbox Related Matter

Dec 21st, 2005

sorry, I still can't get it to even add the option on the client side. Can you post the whole page?

•

Join Date: Dec 2004

Posts: 1,655

Reputation: tgreer is an unknown quantity at this point

Solved Threads: 35

tgreer

Offline

Made Her Cry

Re: Listbox Related Matter

Dec 21st, 2005

Elements you add via JavaScript have nothing to do with Objects created in ASP.NET. Given the client-server nature of the web, surely you can see why this is the case.

Server Objects (ASP.NET "Web Controls") exist only on the server. When done processing, the ViewState object is created and embedded within the response stream as a hidden form variable. This is the mechanism by which Web Controls are recreated and restored to their state on PostBack.

Since your JavaScript is creating client elements, and not adding them to the ViewState variable, there is no way your server-side control can create corresponding Web Controls on postback.

What you need to do:

Server-side, you can iterate through the Request object to retrieve posted form values, including any options etc. you created client-side.

OR

Create all your controls server-side.

•

Join Date: Jul 2005

Posts: 483

Reputation: campkev is an unknown quantity at this point

Solved Threads: 19

campkev

Offline

Posting Pro in Training

Re: Listbox Related Matter

Dec 21st, 2005

right, that (option a) was what I was going for. Wanted to give him some sample code but couldn't get the javascript part working

•

Join Date: Jun 2003

Posts: 313

Reputation: red_evolve is on a distinguished road

Solved Threads: 0

red_evolve red_evolve is offline

Offline

Posting Whiz

Re: Listbox Related Matter

Dec 21st, 2005

Thanks a lot kev and tgreer. I'll try out the first option suggested and come back with a feedback

"Study the past if you would define the future" - Confucius

•

Join Date: Jul 2005

Posts: 483

Reputation: campkev is an unknown quantity at this point

Solved Threads: 19

campkev

Offline

Posting Pro in Training

Re: Listbox Related Matter

Dec 22nd, 2005

can you post the rest of the aspx page? I can't get it to work and now you have me hooked on making it work?

•

Join Date: Jun 2003

Posts: 313

Reputation: red_evolve is on a distinguished road

Solved Threads: 0

red_evolve red_evolve is offline

Offline

Posting Whiz

Re: Listbox Related Matter

Dec 23rd, 2005

Err, it's kinda difficult eh kev.
But here goes:-

File1.aspx:-

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
<asp:ListBox ID="Groups" runat="server" SelectionMode="multiple" width="250"/>
<script type="text/javascript">        
        function getCustomerList(custIDList, custNameList){
            var lbClients = document.getElementById("<%=Clients.ClientID %>");
            var lbHidden = document.getElementById("<%=hdnClientID.ClientID %>");
            var lsValue = custIDList.split(",");
            var lsName = custNameList.split(",");
            var cnt = 0;
            var s = lbHidden.value;
            for(var i=0; i<lsValue.length; i++) {
                cnt = 0;
                for(var j=0; j<lbClients.options.length; j++) {                                  
                    if(lbClients.options[j].value != lsValue[i])
                        cnt++;
                }
                if(cnt == lbClients.options.length) {
                    addOptionToListBox(lsValue[i], lsName[i], lbClients);
                    if (s.length > 0)
                        s = s + ",";
                    s = s + lsValue[i];
                }
            }    
            lbHidden.value = s; 
        }
function addOptionToListBox(lsVal, lsNam, obj) {
            var anOption = document.createElement("OPTION");
            obj.add(anOption);
            anOption.text = lsNam; 
            anOption.value = lsVal;            
        }
</script>
<asp:ListBox ID="Groups" runat="server" SelectionMode="multiple" width="250"/>
<script type="text/javascript">        
        function getCustomerList(custIDList, custNameList){
            var lbClients = document.getElementById("<%=Clients.ClientID %>");
            var lbHidden = document.getElementById("<%=hdnClientID.ClientID %>");
            var lsValue = custIDList.split(",");
            var lsName = custNameList.split(",");
            var cnt = 0;
            var s = lbHidden.value;
            for(var i=0; i<lsValue.length; i++) {
                cnt = 0;
                for(var j=0; j<lbClients.options.length; j++) {                                  
                    if(lbClients.options[j].value != lsValue[i])
                        cnt++;
                }
                if(cnt == lbClients.options.length) {
                    addOptionToListBox(lsValue[i], lsName[i], lbClients);
                    if (s.length > 0)
                        s = s + ",";
                    s = s + lsValue[i];
                }
            }    
            lbHidden.value = s; 
        }
function addOptionToListBox(lsVal, lsNam, obj) {
            var anOption = document.createElement("OPTION");
            obj.add(anOption);
            anOption.text = lsNam; 
            anOption.value = lsVal;            
        }
</script>

File2.aspx (VB code):-

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
strScript = "@SCRIPT>window.opener.getCustomerList('" & strValue.ToString() & "', '" & strName.ToString() & "'); window.close(); window.opener.focus();@/SCRIPT>"
        ClientScript.RegisterClientScriptBlock(Page.GetType(), "CloseChild", strScript.Replace("@", "<"))
strScript = "@SCRIPT>window.opener.getCustomerList('" & strValue.ToString() & "', '" & strName.ToString() & "'); window.close(); window.opener.focus();@/SCRIPT>"
        ClientScript.RegisterClientScriptBlock(Page.GetType(), "CloseChild", strScript.Replace("@", "<"))

Btw, I could not use any of your suggested options, tgreer.
[1] Could not use Request.Form because it's a multiple selection in the listbox.
If I am to programatically do .select() on the listitems in the listbox after adding them it, it would then look kinda ugly lol.
So I opted to add a hidden field instead - by storing a comma separated list of the customer IDs.

"Study the past if you would define the future" - Confucius

•

Join Date: Dec 2004

Posts: 1,655

Reputation: tgreer is an unknown quantity at this point

Solved Threads: 35

tgreer

Offline

Made Her Cry

Re: Listbox Related Matter

#10

Dec 23rd, 2005

All form values are submitted back to the server, so all form values are in the Request object, multi-select or not.

Of course, the canonical way to do this in ASP.NET is to populate your controls server-side, even if this means adding server round-trips to your logic.

Glad you got it working, but I predict you're going to have a real struggle with ASP.NET!