?
Solved

Need to iterate through two XML data islands and populate an html select list with the first column of each row, from both data islands.

Posted on 2005-04-29
15
Medium Priority
?
337 Views
Last Modified: 2008-01-09
*******************************************************************************'
BACKGROUND INFO:  You might want to skip reading this -- I don't know how helpful it will be. I don't want to waste your time...

I've pasted a lot of code below but the code sections are well documented...

I have four very small XML data islands on one page (but only two data island in the code example below). Each of these data islands are used to populate a different listview table, (which is what I call a table that automatically grows as rows are entered into it). I got this terminology from working with MS listview controls in VBA...

I have each "listview control" (dynamic table - whatever it should be called) on it's own separate tab of a DHTML tabbed control.

The page that the below code comes from is 1141 lines long, so I am trying to paste in only what I imagine necessary for you to help me. I can't post a link to the page, because it is on a company Intranet site. Upon request, if necesarry, I can post the whole page in here. It is an asp page, but would probably work OK for the purpose of solving my question, if changed to an html extention and viewed in that way... The only thing that would not work would be some of the drop downs... I think...
**********************************************************************
MY QUESTION:

How would I use JavaScript to iterate through the two data islands below and populate an html select list with the value of the first column of each row, from each listview control? I have four listview controls, but an example using two should help me understand how to iterate through all four...

TO CLARIFY:  I click on a select list and it calls a function: <SELECT class=Style1 name="txtAddInfoApplies" onClick="popAddInfoAppliesTo();" ID=Select4 >

If my tab3 listview control (denoted in the code below)  has the following rows entered into it:

TechName1, FieldName1, Description1, etc...
TechName2, FieldName2, Description2, etc...

And my tab4 listview control (denoted in the code below) has the following rows entered into it:

TechPrompt1, PromptVerbiage1, PromptNotes1, etc...
TechPrompt2, PromptVerbiage2, PromptNotes2, etc...

Then my, select list (name="txtAddInfoApplies") should have the following items in it's drop down list:

TechName1
TechName2
TechPrompt1
TechPrompt2

I would greatly appreciate your help!
JA67

***************************************************************************************************
   

/* ****** Declare and Initialize variables for each Data Island  *** */

      var oDoc = new XMLDocument(); //This is the Tab3 Fields data island.
      var oDoc2 = new XMLDocument(); //This is the Tab4 Prompts data island.
                  
      var oRoot = new IXMLDOMElement();
      var oRoot2 = new IXMLDOMElement();                  
                  
      function initVariables() {
            oDoc = apps.XMLDocument;
            oDoc2 = appsPRMPT.XMLDocument;
                              
            oRoot = oDoc.selectSingleNode('/applications');
            oRoot2 = oDoc2.selectSingleNode('/applications');
            }
      


<!-- ------ BEGIN -- Tab3 content for FIELDS -->
      
<table border="0" cellpadding="0" cellspacing="0" class="clsText" id="Tab3Text">
   <tr>
     <td>      

<!-- ------BEGIN -- XML Data Island for Tab3 FIELDS -->

<form name="frmFields" ID=Form1>
      <xml id="apps">
            <applications>
                  <application>
                        <TechName></TechName>
                        <FieldName></FieldName>
                        <Description></Description>
                        <Example></Example>
                        <ObjectType></ObjectType>
                        <FieldFormat></FieldFormat>
                        <Limitation></Limitation>
                        <Disp_Ord></Disp_Ord>
                  </application>
            </applications>
      </xml>

<!-- ------- END -- XML Data Island for Tab3 FIELDS -->

<!-- --------BEGIN -- Input fields -- Tab3 Application Fields -->
      
            <table border="1" cellpadding="0" cellspacing="1">
               <tr><td  class="HeaderRidgeBottom" colspan="3" style="font-size: 12px;">Tools Portal -- Application Documentation Screen</td><td><input type="hidden" name="txtID_FLD" ID=Text1/></td></tr>
               <tr><td>Technical name:</td><td colspan="2"><select name="txtTechName" class="clsInputTextTab3_50" type="text"  ID="txtTechName"/><option value=""></option>
                     <%
                  Do Until oRstADW_COL.EOF
                        Response.Write("<option value='" & oRstADW_COL.Fields("mdo_nm") & "'>" & oRstADW_COL.Fields("mdo_nm") & "</option>")
                        oRstADW_COL.MoveNext
                  Loop
                  %>
                  </select>
               &nbsp;Other:&nbsp;<input name="txtTechNameOther" class="clsInputTextTab3_50" type="text"  ID="txtTechNameOther" onKeyUp="javascript:test(this, txtTechName);"  /></td></tr>
               <tr><td>Field name:</td><td colspan="2"><input class="clsInputTextTab3" type="text" name="txtFieldName" ID=Text3/></td></tr>
               <tr><td>Field Description:</td><td colspan="2"><input class="clsInputTextTab3" type="text" name="txtDescription" ID=Text4/></td></tr>
               <tr><td>Example:</td><td colspan="2"><input class="clsInputTextTab3" type="text" name="txtExample" ID=Text5/></td></tr>
               <tr><td>Object Type:</td>
                        <td>
                                 <SELECT class=Style1 name="txtObjectType" ID=Select1>
                                          <OPTION value=Detail selected>Detail</OPTION>
                                          <OPTION value=Dimension>Dimension</OPTION>
                                          <OPTION value=Measure>Measure</OPTION>
                                          <OPTION value=Other>Other</OPTION>
                                     </SELECT>
                              </td>
                              <td>&nbsp; Field format:&nbsp;
                                    <SELECT class=Style1 name="txtFieldFormat" ID=Select2>
                                          <OPTION value=Autonumber selected>Autonumber</OPTION>
                                          <OPTION value=Binary>Binary</OPTION>
                                          <OPTION value=Character>Character</OPTION>
                                          <OPTION value="Currency ">Currency</OPTION>
                                          <OPTION value=Date>Date</OPTION>
                                    </SELECT>
                   </td></tr>
                   <tr><td>Limitation:</td><td colspan="2"><input class="clsInputTextTab3" type="text" name="txtLimitation" ID=Text11/></td></tr>
                   <tr><td>Field Display Order:&nbsp;</td><td><input  class=Style1 style="width:50px;" type="text" name="txtFieldDispOrd" ID=Text12/></td></tr>
                   <tr><td colspan="3" class="HeaderRidgeTop">
                        <input class="clsButton" type="button" name="btnAdd" value="    Add" onClick="javascript:addValuesFLDS();" ID=Button2/>
                        <input class="clsButton" type="button" name="btnUpdate" value=" Update" onClick="javascript:updateValuesFLDS();" ID=Button1/>
                        <input class="clsButton" type="button" name="btnDelete" value="  Delete" onClick="javascript:deleteNode(oRoot, 'FLDS', document.all.item('txtID_FLD').value);" ID=Button3/>
                        <input class="clsButton" type="button" name="btnClear" value="   Clear" onClick="javascript:clearFormFLDS();" ID=Button4/>
                  </td></tr>            
             </table>
<!-- -----------END -- Input fields -- Tab3 Application Fields -->

<!-- ----------BEGIN -- Listview table, for Tab3 Application Fields -->
      
            <div style="overflow:auto; height:100px; width:600px">
                  <table border="0" cellpadding="0" cellspacing="1" datasrc="#apps" style="width:600px">
                        <thead style="color:#ffffff; padding:3px 0px 3px 0px; text-align:left;font-family: verdana;font-size: 10px;">
                              <tr style="position:relative; top:-1px; background-color:#000000">
                                    <th>TechName</th>
                                    <th>FieldName</th>
                                    <th>Description</th>
                                    <th>Example</th>
                                    <th>ObjectType</th>
                                    <th>FieldFormat</th>
                                    <th>Limitation</th>
                                    <th>Disp_Ord</th>
                              </tr>
                        </thead>
                        <tbody style="background-color:#FFFFFF">
                              <tr onClick="javascript:getValuesFLDS(this);" style="cursor:hand" onMouseOver="javascript:this.style.backgroundColor='#CCCCCC'" onMouseOut="javascript:this.style.backgroundColor='#ffffff'">
                                    <td><span datafld="TechName"></span></td>
                                    <td><span datafld="FieldName"></span></td>
                                    <td><span datafld="Description"></span></td>
                                    <td><span datafld="Example"></span></td>
                                    <td><span datafld="ObjectType"></span></td>
                                    <td><span datafld="FieldFormat"></span></td>
                                    <td><span datafld="Limitation"></span></td>
                                    <td><span datafld="Disp_Ord"></span></td>
                              </tr>
                        </tbody>
                  </table>
            </div>
            <p/>
            </td></tr></table></form>
<!-- --------END -- Listview table, for Tab3 Application Fields -->      

<!--  ------ END -- Tab3 content -->


<!-- ------- BEGIN -- Tab4 content for PROMPTS  -->

<table border="0" cellpadding="0" cellspacing="0" class="clsText" id="Tab4Text">
    <tr>
      <td>      

<!-- ------- BEGIN -- XML Data Island for Tab4 PROMPTS -->

 <form name="frmPrompts" ID=Form4                        
      <xml id="appsPRMPT">
            <applications>
                  <application>
                        <TechPrompt></TechPrompt>
                        <PromptVerbiage></PromptVerbiage>
                        <PromptNotes></PromptNotes>
                        <PromptFormat></PromptFormat>
                        <PromptType></PromptType>
                        <Disp_Ord></Disp_Ord>
                  </application>
                        
            </applications>
      </xml>
<!-- --------- END -- XML Data Island for Tab4 PROMPTS -->

<!-- ----------BEGIN -- Input fields -- Tab4 Application Prompts -->
      
            <table border="0" >
               <tr><td  class="HeaderRidgeBottom" colspan="3" style="font-size: 12px;">Tools Portal -- Application Documentation Screen</td><td><input type="hidden" name="txtID_PRMPT" ID=Hidden1/></td></tr>
               <tr><td>Tech prompt name:&nbsp;</td><td colspan="2"><input class="clsInputTextTab4" type="text" name="txtTechPrompt" ID=Text6/></td></tr>
               <tr><td>Prompt verbiage:</td><td colspan="2"><input class="clsInputTextTab4" type="text" name="txtPromptVerbiage" ID=Text7/></td></tr>
               <tr><td>Prompt notes:</td><td colspan="2"><input class="clsInputTextTab4" type="text" name="txtPromptNotes" ID=Text8/></td></tr>
               <tr><td>Prompt format:</td><td colspan="2"><input class="clsInputTextTab4" type="text" name="txtPromptFormat" ID=Text9/></td></tr>
               <tr>
               <td>Prompt Type:</td>
                  <td>
                              <SELECT class=Style1 style="width:145px;" name="txtPromptType" ID=Select3>
                                    <OPTION value=Fill_In selected>Fill In</OPTION>
                                    <OPTION value=Pick_Lists_One_Value>Pick List: One Value</OPTION>
                                    <OPTION value=Pick_List_Multiple_Values>Pick List: Multiple Value</OPTION>
                                    <OPTION value=Other>Other</OPTION>
                              </select>
                            </td>
                  <td>&nbsp;Prompt Display Order:&nbsp;<input  class=Style1 style="width:50px;" type="text" name="txtPromptDispOrd" ID=Text10/></td>
                  </tr>        
          <tr><td colspan="3" class="HeaderRidgeTop">
                        <input class="clsButton" type="button" name="btnAdd" value="    Add" onClick="javascript:addValuesPRMPT();" ID=Button5/>
                        <input class="clsButton" type="button" name="btnUpdate" value=" Update" onClick="javascript:updateValuesPRMPT();" ID=Button6/>
                        <input class="clsButton" type="button" name="btnDelete" value="  Delete" onClick="javascript:deleteNode(oRoot2, 'PRMPT', document.all.item('txtID_PRMPT').value);" ID=Button7/>                                                                                                                                                                                                                                      
                        <input class="clsButton" type="button" name="btnClear" value="   Clear" onClick="javascript:clearFormPRMPT();" ID=Button8/>
                  </td></tr>            
             </table>
<!-- ---------END -- Input fields -- Tab4 Application Prompts -->      

<!-- ---------BEGIN -- Listview table, for Tab4 Application Prompts -->      

            <div style="overflow:auto; height:100px; width:600px">
                  <table border="0" cellpadding="0" cellspacing="1" datasrc="#appsPRMPT" style="width:600px">
                        <thead style="color:#ffffff; padding:3px 0px 3px 0px; text-align:left;font-family: verdana;font-size: 10px;">
                              <tr style="position:relative; top:-1px; background-color:#000000">
                                    <th>TechPrompt</th>
                                    <th>PromptVerbiage</th>
                                    <th>PromptNotes</th>
                                    <th>PromptFormat</th>
                                    <th>PromptType</th>
                                    <th>Disp_Ord</th>
                              </tr>
                        </thead>
                        <tbody style="background-color:#FFFFFF;">
                              <tr onClick="javascript:getValuesPRMPT(this);" style="cursor:hand; " onMouseOver="javascript:this.style.backgroundColor='#CCCCCC'" onMouseOut="javascript:this.style.backgroundColor='#ffffff'">
                                    <td><span datafld="TechPrompt"></span></td>
                                    <td><span datafld="PromptVerbiage"></span></td>
                                    <td><span datafld="PromptNotes"></span></td>
                                    <td><span datafld="PromptFormat"></span></td>
                                    <td><span datafld="PromptType"></span></td>
                                    <td><span datafld="Disp_Ord"></span></td>
                              </tr>
                        </tbody>
                  </table>
            </div>
            <p/>
            </td></tr></table>
      </form>
<!--  ----------END -- Listview table, for Tab4 Application Prompts -->            
      
<!-- ---------- END -- Tab4 content -->
0
Comment
Question by:JA67
  • 8
  • 7
15 Comments
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13898334
I am not sure I understand where EXACTLY is your problem,
but if it is with getting to the specific nodes in you data islands then
you could use

         oApplicationNodes = oDoc.selectSingleNode('/applications/application/*[1]');
         oApplicationNodes2 = oDoc2.selectSingleNode('/applications/application/*[1]');

and then use the .name or .text of each of the nodes you get thair names or text value
respectively

SnowFlake

p.s. you can play with XPATH expressions here:

http://www.zvon.org:9001/saxon/cgi-bin/XLab/XML/addressbook.html
try entering /addressBook/address/*[1]
and see what happens.




0
 

Author Comment

by:JA67
ID: 13898724
SnowFlake,

Yes, I believe you have surely given me something here that I will need in order to make this happen.  I don't think I would have ever figured that out on my own. Thank you!

 Now, can you give me another example that would demonstrate how I would iterate through both listview controls, so that I could grab each value (the value in column 1, of each row) and add it to my select list? That's the other part of this "problem" that I don't know how to go about solving, without spending two weeks in trial and error...

Also -- I want to try out the link you provided but it was broke when I clicked on it... Can you double check the url?

Thank you!
JA67
0
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13898818
1) as for the link
    you a re right, it does not seem to work
go directly to http://www.zvon.org/
click totorials on the to menu
selct the XPATH TUTORIAL
select the see also XLAB
and then choose the link in the second row (xpath expressions)
now click on the blue "Select another XML source" link
now get the one on the top left
and try entering /addressBook/address/*[1]
(I got to the same (broken)link - but with a result)

maybe you can try the link one step earlier
 http://www.zvon.org:9001/saxon/cgi-bin/XLab/XML/addressbook.html?stylesheetFile=XSLT/xpath.xslt&lang=eng
which seems to work for me
and try entering /addressBook/address/*[1]
(I got to the same (broken)link - but with a result)

as for your request, I will try building you an example but its 2am here and its time for me to go to sleep
so I will look into it tommorow if no one else will handle it but then.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:JA67
ID: 13899501

Thanks SnowFlake. I was able to get to the website this time. That's really neat and useful information.

I played around with the below line of code that you gave me; trying to use it with an "alert," to see if I could get it to display the actual text in the first column of one of the listview controls, but it only returned back, "oApplicationNodes." I tried using various syntax with the ".text" and ".name" but apparently I did not reference it correctly.

oApplicationNodes = oDoc.selectSingleNode('/applications/application/*[1]');

I tried things like:

alert(oApplicationNodes.text);
alert('oApplicationNodes'.text);
alert('oApplicationNodes').text;
alert(oApplicationNodes).text;

Clearly I don't know what I'm doing...

I certainly think you are on the right track as to what I am trying to do, and I really appreciate your help!  I will check back here tomorrow.

THANK YOU!
JA67



0
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13900760
hmm...
o.k., many things to say:

first - my Bad, should have been  

var oApplicationNodes  = document.getElementById('apps').XMLDocument.selectNodes('/applications/application/*[0]');
var oApplicationNodes2 = document.getElementById('appsPRMPT').XMLDocument.selectNodes('/applications/application/*[0]');

second - now as to accessing the values, that depends on what exactly you want extracted.

you can

for(var i=0;i<oApplicationNodes.length;i++) {
   alert(oApplicationNodes.item(i).nodeName);  
   alert(oApplicationNodes.item(i).text);
}

can you show an example of wht will you xml data island will contain ?


third - your original code is missing the closing >
after <form name="frmPrompts" ID=Form4

are you with me so far ?
0
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13900786
It would seem like you did the binding fine
and your problem now is that you also need to put some data in the XML
try changing the content to the apps xml data island to

               <application>
                    <TechName>Name1</TechName>
                    <FieldName></FieldName>
                    <Description></Description>
                    <Example></Example>
                    <ObjectType></ObjectType>
                    <FieldFormat></FieldFormat>
                    <Limitation></Limitation>
                    <Disp_Ord></Disp_Ord>
               </application>
               <application>
                    <TechName>Name2</TechName>
                    <FieldName></FieldName>
                    <Description></Description>
                    <Example></Example>
                    <ObjectType></ObjectType>
                    <FieldFormat></FieldFormat>
                    <Limitation></Limitation>
                    <Disp_Ord></Disp_Ord>
               </application>

and see how the names apear in your table.
0
 
LVL 15

Accepted Solution

by:
SnowFlake earned 2000 total points
ID: 13900806
As for adding the values to the select element

you can use the following code:

var oApplicationNodes  = document.getElementById('apps').XMLDocument.selectNodes('/applications/application/*[0]');
var oApplicationNodes2 = document.getElementById('appsPRMPT').XMLDocument.selectNodes('/applications/application/*[0]');

for(var i=0;i<oApplicationNodes.length;i++) {
   alert(oApplicationNodes.item(i).nodeName);
   
   var oOption = document.createElement("OPTION");
   document.all.txtTechName.options.add(oOption);
   oOption.innerText = oApplicationNodes.item(i).text;
   oOption.value = "apps_" + oApplicationNodes.item(i).text;

}

for(var i=0;i<oApplicationNodes2.length;i++) {
   alert(oApplicationNodes2.item(i).nodeName);

   var oOption = document.createElement("OPTION");
   document.all.txtTechName.options.add(oOption);
   oOption.innerText = oApplicationNodes2.item(i).text;
   oOption.value = "apps_" + oApplicationNodes2.item(i).text;
}

I would suggest you also remove the empty option that currently apears in the html.

Are we still missing anything ? please let me know.
0
 

Author Comment

by:JA67
ID: 13900912
Wow! That's a lot of great info. I am going to work with this and see what it does for me. I'll let you know how it goes ASAP.

As for the data island, it stays empty like that in my code, yet it still works.  Somehow it works in conjuction with my form fields to populate the listview table. I haven't got it entirely clear in my mind how it all works, but it does. I click an Add button and the data I typed into the entry fields, gets tossed down into my listview table. I know how it works, to a point, but I don't really know how to explain the empty data isalnd, i.e. why it is empty... I guess it get's filled up automatically as I add data to the listview table. I'm not sure...

Thanks for catching the missing end tag on my form tag.

You have earned the 500 points already as far as I am concerned, but I want to work with this and get back with you. We could divide this up into two or three 500 point questions if you want. I'll get back with you sometime today. It is 11:03 where I am, and I've got some things I have to do, but I will get back with you before the days end.

Thanks!!!!!!
JA67
0
 

Author Comment

by:JA67
ID: 13900948

Oh yes, you asked for an example of what the data island will contain:

I do not populate the data island by hand, in the code... I mean, if it gets populated, I am not doing it by typing it into the code. It must happen automatically. All I do is type values into input boxes on my form and select values from select lists. Once I click add, these values are placed in a table...

Here is an example of what the data might look like in the data island:


    <xml id="apps">
          <applications>
               <application>
                    <TechName>age_grp_id</TechName>
                    <FieldName>age group ID</FieldName>
                    <Description>The age of the group</Description>
                    <Example>12</Example>
                    <ObjectType>detail</ObjectType>
                    <FieldFormat>numeric</FieldFormat>
                    <Limitation>none</Limitation>
                    <Disp_Ord>2</Disp_Ord>
               </application>
          </applications>
     </xml>

Thanks,
JA67




0
 

Author Comment

by:JA67
ID: 13901127
WOWZA!  Snowflake your my hero or heroine, I don't know which.  I have made great progress with your ingenious code!

I have some quirks to iron out though...

Actually, the select list I want to populate is named, "txtAddInfoApplies" so I changed your reference of "txtTechName" to "txtAddInfoApplies."

Here is what my select list looks like: I removed the option tags. I don't know but maybe that is causing one of my quirks? What do you think?
********************
<tr><td>Add info applies to:&nbsp;</td>
     <td>
        <SELECT class=Style1 name="txtAddInfoApplies" onClick="popAddInfoAppliesTo();" ID=Select4             
        </SELECT>
    </td>
**************************

The quirks are as follows:
1. The select list will not stay open. It closes the second that I let up on the mouse button.
2.  If I hold the mouse button down I can move the cursor through the list of items gathered by your code, but I cannot select any of the items. If I click on one, the list closes and the content of the select list is empty.
3. Also, the items in the select lest are repeating over and over with a blank row between the items taken from "oApplicationNodes" and "oApplicationNodes2".
4. Lastly, the first time I tried this, I did get an item selected from the select list, but it had, "app_" as a prefix.

Can you help me through these items? Again, we can divide this into as many 500 point deals as you want. You are awesome!

I have to leave for a couple of hours. I will check back with you later. I am amazed how much you have helped me. Thank you so much!!!!


Here is the function as copied from your posting, except for changing "txtTechName" to "txtAddInfoApplies" and remarking our the alerts. This is how it is right now in my page.
**************************************
function popAddInfoAppliesTo() {
var oApplicationNodes  = document.getElementById('apps').XMLDocument.selectNodes('/applications/application/*[0]');
var oApplicationNodes2 = document.getElementById('appsPRMPT').XMLDocument.selectNodes('/applications/application/*[0]');

for(var i=0;i<oApplicationNodes.length;i++) {
//alert(oApplicationNodes.item(i).text);
   
   var oOption = document.createElement("OPTION");
   document.all.txtAddInfoApplies.options.add(oOption);
   oOption.innerText = oApplicationNodes.item(i).text;
   oOption.value = "apps_" + oApplicationNodes.item(i).text;

}

for(var i=0;i<oApplicationNodes2.length;i++) {
   //alert(oApplicationNodes2.item(i).text);

   var oOption = document.createElement("OPTION");
   document.all.txtAddInfoApplies.options.add(oOption);
   oOption.innerText = oApplicationNodes2.item(i).text;
   oOption.value = "apps_" + oApplicationNodes2.item(i).text;
}
}
0
 

Author Comment

by:JA67
ID: 13902005
Snowflake,

Thanks for you help. I still have some questions and issues but I feel that I need to give you your well earned points now.
If you know what would cause issues 3 and 4 below, maybe you could let me know in this thread. I will likely have more questions, but I will post them in a new question so I can rack up more points for you or someone else...

Thanks again!!!
JA67  

1.  OK Snowflake, I am slow, but I finally figured out what was causing the duplicate items in the select list... As you probably already knew or could easily surmise, it just adds to it's list each time I click on it and the function runs. I have added the following line at the top of the function to delete the list options before querying the data islands. This seems to work.

                        document.forms['frmAddInfo'].txtAddInfoApplies.options.length = 0;

2. Changing the select list from "onClick" to "onfocus" has caused the select list to stay open now and I am able to select items from the list now. Not sure why "onClick" was misbehaving.

3.  I don't know why, but the first time I click on the select list (when no value is displayed in it) it flashes open and then closes real quick. The second time I click on it, it stays open and allows me to make a selection. But each time it's content is cleared, this process repeats.

4. I am not sure yet what is causing the blank row in between items from app and appsPRMPT however...

5. It's only after I enter the data into the listview table that I see the "apps_" prefixed to the item that was in the select list, and after looking closer I see where it's coming from. No problem there.
0
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13902043
here goes :)

>WOWZA!  Snowflake your my hero or heroine, I don't know which.
*BLUSH* thanks, Its hero :) you can see it in my profile (click my name in above this comment).

>Actually, the select list I want to populate is named, "txtAddInfoApplies" so I changed your reference of "txtTechName" >to "txtAddInfoApplies."

well I did see that you where talking about txtAddInfoApplies but it did not apear as part of the code you posted so I just used
the other one.

>Here is what my select list looks like: I removed the option tags. I don't know but maybe that is causing one of my quirks? >What do you think?
********************
<tr><td>Add info applies to:&nbsp;</td>
     <td>
        <SELECT class=Style1 name="txtAddInfoApplies" onClick="popAddInfoAppliesTo();" ID=Select4          
        </SELECT>
    </td>

hmm... I think you are missing yet another > at the end of the opening select tag :)
am not sure if it is the reason for all your problems but you can try adding it after the ID and see what happens.

>The quirks are as follows:
>1. The select list will not stay open. It closes the second that I let up on the mouse button.
>2.  If I hold the mouse button down I can move the cursor through the list of items gathered by your code, but I cannot >select any of the items. If I click on one, the list closes and the content of the select list is empty.
I would guess those are because your onclick handler popAddInfoAppliesTo changes the select itself.
It might be better do populate the select oonly when a change happens ( e.g. at the end of Add and Delete operations)


>3. Also, the items in the select lest are repeating over and over with a blank row between the items taken >from "oApplicationNodes" and "oApplicationNodes2".
I guess this is a result of the existing empty application in the second xml data island.
It can be fixed in a number of ways but I guess the easiest one would be to add an if statement like this:

for(var i=0;i<oApplicationNodes2.length;i++) {
   //alert(oApplicationNodes2.item(i).text);
   if (oApplicationNodes2.item(i).text.length>0) {            // <--- Don't add blank lines
      var oOption = document.createElement("OPTION");
      document.all.txtAddInfoApplies.options.add(oOption);
      oOption.innerText = oApplicationNodes2.item(i).text;
      oOption.value = "apps_" + oApplicationNodes2.item(i).text;
   }
}


4. Lastly, the first time I tried this, I did get an item selected from the select list, but it had, "app_" as a prefix.
yep the prefix is add by the lines:

      oOption.value = "apps_" + oApplicationNodes.item(i).text;
and
      oOption.value = "apps_" + oApplicationNodes2.item(i).text;

you
can just remove the prefix if you wish, I added it so you can see that you can have different values
for the displayed text and the value of the options in the select.

>Can you help me through these items?
I hope I just did :)

>Again, we can divide this into as many 500 point deals as you want.
I think it is not considered legal, you could as in communitiy support if this can be done and on what cases.
If you want to make me happy, you can send me a thankyou postcard when we are done (preferably with
a view of the area wher you live).

>You are awesome!
*BLUSH* again :)

Let me know how things are going.
SnowFlake

0
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13902108
seems like our postings got crossed :)
so you have some answers in my post above
and some you have showen that you found by your self.

as for no. 3 & 4,

I think again it is because of you event handler but I am not sure,
try populating your select after data is added or deleted instead of onfocus.

thanks for the grade and points and glad I could help.
SnowFlake
0
 

Author Comment

by:JA67
ID: 13913312
Hi SnowFlake!  I've been extremely busy and I forgot to tell you that I moved the event to the Additional Information tab on my tabbed control and now everything works beautifully with the select list. To get to the select list (the one you were helping me with) you have to click on the Additional Info tab. The select list doesn't flash anymore and your code for getting rid of the blank spaces works great! It's a beautiful thing to see it work!  

I can't thank you enough!!! I wish I had the money to pay you instead of handing out points.

THANK YOU!!!
JA67
0
 
LVL 15

Expert Comment

by:SnowFlake
ID: 13915568
> I can't thank you enough!!! I wish I had the money to pay you instead of handing out points.

You can send me a postcard :) (my address is in my user profile)
SnowFlake
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

829 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question