Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

This onload function works great for type "text" - what would the syntax be for type "select"?

Posted on 2006-11-28
10
733 Views
Last Modified: 2007-12-19

Hi,

This onload function works great for type "text" - what would the syntax be for type "select"?

window.onload=function () {
  var text=document.getElementsByTagName('input');
  for (var j=0;j<text.length;j++) {
   var ip=text[j];

   if (ip.type=="text") {
       ip.onchange=function () {
        var td=html_CascadeUpTill(this,'TD');
        var tr=html_CascadeUpTill(this,'TR');
        // Getting the value of the PK
        var pk=tr.lastChild.getElementsByTagName('input')[1].value;
        alert(pk);
        var l_cellindex=td.cellIndex;
        var l_column=g_headers[l_cellindex].id;
        var app=html_GetElement('pFlowId').value;
        var pg=html_GetElement('pFlowStepId').value;
        var get=new htmldb_Get(null,app,'APPLICATION_PROCESS=session_auto_update',pg);
        get.add('G_ITEM1',l_column);
        get.add('G_ITEM2',this.value);
        get.add('G_ITEM3',pk);      
        alert('column='+l_column+',value='+this.value+',pk='+pk);
        gReturn=get.get();
        if (gReturn) { alert(gReturn); this.focus();}
        get=null;
       }
   }
</script>
0
Comment
Question by:bcarlis
  • 5
  • 4
10 Comments
 
LVL 6

Assisted Solution

by:sodalitas
sodalitas earned 200 total points
ID: 18029930
Only two changes would be necessary. The first is to replace
if (ip.type=="text") {
with
if (ip.type=="select") {

and the second is to replace
this.value
with
this.selectedIndex.value

Assuming that the value associated with the selected option is what you want.  Also, this will only work if there is an option selected.  If that is not the case, then (this.selectedIndex == -1) will be true.  So if you have to handle it, you can do this

if (this.selectedIndex == -1)
   get.add('G_ITEM2',"some default value");
else
   get.add('G_ITEM2',this.value);

and again in your alert
0
 
LVL 17

Expert Comment

by:gops1
ID: 18030105
You cannot say this:

if (ip.type=="select")

instead

if (ip.type.indexOf("select")!=-1)


or

if (ip.tagName.toLowerCase()=="select")
0
 
LVL 2

Author Comment

by:bcarlis
ID: 18030179
solalitas,

INPUT only shows "hidden", "text", "checkbox"
i.e. var text=document.getElementsByTagName('input');

So I tried
  var selectlist=document.getElementsByTagName('select');


window.onload=function () {
  var selectlist=document.getElementsByTagName('select');
  for (var j=0;j<selectlist.length;j++) {
   var select_ip=selectlist[j];
   alert(select_ip.type);
  }
etc...

This shows "select-one" from the alert popup....

What is "select-one" ?




0
Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

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.

 
LVL 17

Expert Comment

by:gops1
ID: 18030184
Have a look at this example:

<html>
      <head>
            <title>Script Demo Gops</title>
            <script language="JavaScript">
            <head>
                  <script type="text/javascript">
                        function getName(obj) {
                              if(obj.type=="text"){
                                    alert("Text Box");
                              }else if(obj.type=="radio"){
                                    alert("Radio button");
                              }else if(obj.type=="checkbox"){
                                    alert("Check Box");
                              }else if(obj.type.indexOf("select")!=-1){
                                    alert("Select");
                              }
                        }
                  </script>
            </head>
<body>
      <input type="text" onClick="getName(this)"><br>
      <input type="radio" onClick="getName(this)"><br>
      <input type="checkbox" onClick="getName(this)"><br>
      <select onClick="getName(this)">
            <option>A
            <option>B
            <option>C
      </select>
</body>
</html>
0
 
LVL 17

Assisted Solution

by:gops1
gops1 earned 300 total points
ID: 18030253
By default <select> tag is for single choice and thats the reason why you get "select-one" if it is multiple choice, then it gives "select-multiple":

Here is the revised code. just check this out:

<html>
      <head>
            <title>Script Demo Gops</title>
            <head>
                  <script type="text/javascript">
                        function getName(obj) {
                              if(obj.type=="text"){
                                    alert("Text Box");
                              }else if(obj.type=="radio"){
                                    alert("Radio button");
                              }else if(obj.type=="checkbox"){
                                    alert("Check Box");
                              }else if(obj.type=="select-one"){
                                    alert("Single Select");
                              }else if(obj.type=="select-multiple"){
                                    alert("Multiple Selection");
                              }
                        }
                  </script>
            </head>
<body>
      <input type="text" onClick="getName(this)"><br><br>
      <input type="radio" onClick="getName(this)"><br><br>
      <input type="checkbox" onClick="getName(this)"><br><br>
      <select onClick="getName(this)">
            <option>A
            <option>B
            <option>C
      </select><br><br>

      <select onClick="getName(this)" size="4" multiple>
            <option>A
            <option>B
            <option>C
      </select>
</body>
</html>
0
 
LVL 2

Author Comment

by:bcarlis
ID: 18030347
This is working to a point... It is not getting the VALUE in
alert('COLUMN='+l_column+',VALUE='+ this.selectedIndex.value+',PK='+pk);

It is showing the COLUMN, VALUE is undefined, and PK is correct.

 var selectlist=document.getElementsByTagName('select');
  for (var k=0;k<selectlist.length;k++) {
     var select_ip=selectlist[k];
     //alert(select_ip.type);
     if (select_ip.type=="select-one") {
         //alert(select_ip.type);
         select_ip.onchange=function () {
            var td=html_CascadeUpTill(this,'TD');
            var tr=html_CascadeUpTill(this,'TR');
            // Getting the value of the PK
            var pk=tr.lastChild.getElementsByTagName('input')[1].value;
            //alert('PK='+pk);
            var l_cellindex=td.cellIndex;
            var l_column=g_headers[l_cellindex].id;
            var app=html_GetElement('pFlowId').value;
            var pg=html_GetElement('pFlowStepId').value;
            var get=new htmldb_Get(null,app,'APPLICATION_PROCESS=session_auto_update',pg);
            get.add('G_ITEM1',l_column);
            get.add('G_ITEM2',this.selectedIndex.value);
            get.add('G_ITEM3',pk);      
            alert('COLUMN='+l_column+',VALUE='+ this.selectedIndex.value+',PK='+pk);
            gReturn=get.get();
            if (gReturn) { alert(gReturn); this.focus();}
            get=null;
         }
     }
  }
0
 
LVL 17

Accepted Solution

by:
gops1 earned 300 total points
ID: 18030379
It is:

this[this.selectedIndex].value
0
 
LVL 2

Author Comment

by:bcarlis
ID: 18030441
AWESOME!

Final working portion:

  var selectlist=document.getElementsByTagName('select');
  for (var k=0;k<selectlist.length;k++) {
     var select_ip=selectlist[k];
     //alert(select_ip.type);
     if (select_ip.type=="select-one") {
         //alert(select_ip.type);
         select_ip.onchange=function () {
            var td=html_CascadeUpTill(this,'TD');
            var tr=html_CascadeUpTill(this,'TR');
            // Getting the value of the PK
            var pk=tr.lastChild.getElementsByTagName('input')[1].value;
            //alert('PK='+pk);
            var l_cellindex=td.cellIndex;
            var l_column=g_headers[l_cellindex].id;
            var app=html_GetElement('pFlowId').value;
            var pg=html_GetElement('pFlowStepId').value;
            var get=new htmldb_Get(null,app,'APPLICATION_PROCESS=session_auto_update',pg);
            get.add('G_ITEM1',l_column);
            get.add('G_ITEM2',this[this.selectedIndex].value);
            get.add('G_ITEM3',pk);  
            alert('COLUMN='+l_column+',VALUE='+ this[this.selectedIndex].value+',PK='+pk);    
            gReturn=get.get();
            if (gReturn) { alert(gReturn); this.focus();}
            get=null;
         }
     }
  }

You guys are great!
0
 
LVL 2

Author Comment

by:bcarlis
ID: 18030495

I should be able to consolidate all three somehow... shouldn't I?

<script type="text/javascript">
  var g_table=html_CascadeUpTill(html_GetElement('SESSION_TITLE'),'TABLE');
  var g_headers=g_table.rows[0].cells;

window.onload=function () {
  var selectlist=document.getElementsByTagName('select');
  for (var k=0;k<selectlist.length;k++) {
     var select_ip=selectlist[k];
     //alert(select_ip.type);
     if (select_ip.type=="select-one") {
         //alert(select_ip.type);
         select_ip.onchange=function () {
            var td=html_CascadeUpTill(this,'TD');
            var tr=html_CascadeUpTill(this,'TR');
            // Getting the value of the PK
            var pk=tr.lastChild.getElementsByTagName('input')[1].value;
            //alert('PK='+pk);
            var l_cellindex=td.cellIndex;
            var l_column=g_headers[l_cellindex].id;
            var app=html_GetElement('pFlowId').value;
            var pg=html_GetElement('pFlowStepId').value;
            var get=new htmldb_Get(null,app,'APPLICATION_PROCESS=session_auto_update',pg);
            get.add('G_ITEM1',l_column);
            get.add('G_ITEM2',this[this.selectedIndex].value);
            get.add('G_ITEM3',pk);  
            alert('COLUMN='+l_column+',VALUE='+ this[this.selectedIndex].value+',PK='+pk);    
            gReturn=get.get();
            if (gReturn) { alert(gReturn); this.focus();}
            get=null;
         }
     }
  }
  var text=document.getElementsByTagName('input');
  for (var j=0;j<text.length;j++) {
    var ip=text[j];
    if (ip.type=="text") {
       ip.onchange=function () {
          var td=html_CascadeUpTill(this,'TD');
          var tr=html_CascadeUpTill(this,'TR');
          // Getting the value of the PK
          var pk=tr.lastChild.getElementsByTagName('input')[1].value;
          //alert(pk);
          var l_cellindex=td.cellIndex;
          var l_column=g_headers[l_cellindex].id;
          var app=html_GetElement('pFlowId').value;
          var pg=html_GetElement('pFlowStepId').value;
          var get=new htmldb_Get(null,app,'APPLICATION_PROCESS=session_auto_update',pg);
          get.add('G_ITEM1',l_column);
          get.add('G_ITEM2',this.value);
          get.add('G_ITEM3',pk);      
          //alert('column='+l_column+',value='+this.value+',pk='+pk);
          gReturn=get.get();
          if (gReturn) { alert(gReturn); this.focus();}
          get=null;
       }
   }
   if (ip.type=="checkbox") {
     ip.onclick=function (){
       if (this.checked && confirm('Are you sure you want to delete this row?')) {
          var td=html_CascadeUpTill(this,'TD');
          var tr=html_CascadeUpTill(this,'TR');
          var pk=tr.lastChild.getElementsByTagName('input')[1].value;
          var app=html_GetElement('pFlowId').value;
          var pg=html_GetElement('pFlowStepId').value ;
          var get=new htmldb_Get(null,app,'APPLICATION_PROCESS=delete_emp_ajax',pg);
          get.add('G_ITEM1',pk);
          alert('Deleting pk='+pk);
          gReturn=get.get();
          if (gReturn) alert(gReturn);
          else {tr.parentNode.removeChild(tr);g_table.normalize();}
          get=null;

       }
       else this.checked=false;
     }
   }
  }
};
function bc_AddTableRow(pThis,pColumnHeading,pNum){
      var myTable=html_CascadeUpTill('SESSION_TITLE','TABLE');            
        for(i=0;i<pNum;i++){
        var ogTR = myTable.rows[1];
        var trClone = ogTR.cloneNode(true);
        var last_child=trClone.lastChild.getElementsByTagName('input')
        for (var j=0;j<last_child.length;j++)
        if (last_child[j].type=="hidden" && last_child[j].name=="f01")
                         last_child[j].value="";
              if(document.all){
                  myNewRow = myTable.insertRow(myTable.rows.length);
                  oReplace = myNewRow.replaceNode(trClone);
              }else{
                  myTable.appendChild(trClone);
              }
  }
}
</script>
0
 
LVL 2

Author Comment

by:bcarlis
ID: 18030518
Is there a way to get all objects?

to replace the individual
var text=document.getElementsByTagName('input');
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

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

Suggested Solutions

Title # Comments Views Activity
Make Session back to empty 9 30
Binding a Grid in Javascript 5 42
asp Google Map 2 26
Can anyone see what is the fault in my javascript code? 8 28
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
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…

840 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