| select option
select option |
JuicyScript
msg:4428292 | 9:51 pm on Mar 12, 2012 (gmt 0) |
Hello
Please i have a javaScript which i use for my Four dropDown option.
My problem is that i want to submit the option name to the database and not the value which are numbers
Eg Instead of submitting option value 6 into the database i want certificate to be submitted.
<select id="firstChoice" name="firstChoice" onchange="selectChange(this, form.secondChoice, arrItems1, arrItemsGrp1);">
<option value="0" selected>[SELECT]</option>
<option value="1">Nursing</option>
<option value="2">Allied Health</option>
</select>
<select id="secondChoice" name="secondChoice" onchange="selectChange(this, form.thirdChoice, arrItems2, arrItemsGrp2);"> </select>
<select id="thirdChoice" name="thirdChoice" onchange="selectChange(this, form.fourthChoice, arrItems3, arrItemsGrp3);"></select>
<select id="fourthChoice" name="fourthChoice" ></select>
Javascript code
var arrItems1 = new Array();
var arrItemsGrp1 = new Array();
arrItems1[3] = "Auxilary";
arrItemsGrp1[3] = 1;
arrItems1[4] = "Basic(Diploma)";
arrItemsGrp1[4] = 1;
arrItems1[6] = "Certificate";
arrItemsGrp1[6] = 2;
arrItems1[7] = "Diploma";
arrItemsGrp1[7] = 2;
/*arrItems1[0] = "Planes";
arrItemsGrp1[0] = 3;
arrItems1[1] = "Ultralight";
arrItemsGrp1[1] = 3;
arrItems1[2] = "Glider";
arrItemsGrp1[2] = 3;*/
var arrItems2 = new Array();
var arrItemsGrp2 = new Array();
arrItems2[101] = "Community Health Nursing";
arrItemsGrp2[101] = 3
arrItems2[102] = "Health Assistant Clinical";
arrItemsGrp2[102] = 3
arrItems2[103] = "Registered Community Health Nursing";
arrItemsGrp2[103] = 4
arrItems2[150] = "Registered General Nursing";
arrItemsGrp2[150] = 4
arrItems2[195] = "Registered Mental Nursing";
arrItemsGrp2[195] = 4
arrItems2[196] = "Registered Midwifery";
arrItemsGrp2[196] = 4
arrItems2[104] = "Community Health(FT)";
arrItemsGrp2[104] = 6
arrItems2[105] = "Environmental Health Assistant";
arrItemsGrp2[105] = 6
arrItems2[106] = "Health Records Management";
arrItemsGrp2[106] = 6
arrItems2[107] = "Optical Technician";
arrItemsGrp2[107] = 6
arrItems2[108] = "Physiotherapy/Orthotics Assistant";
arrItemsGrp2[108] = 6
arrItems2[200] = "Technical Officer Community Health(Disease Control and Surveillance)";
arrItemsGrp2[200] = 7
arrItems2[201] = "Technical Officer Community Health(Nutrition)";
arrItemsGrp2[201] = 7
arrItems2[204] = "Environmental Health Officer";
arrItemsGrp2[204] = 7
arrItems2[205] = "Technical Officer(Health Information)";
arrItemsGrp2[205] = 7
arrItems2[206] = "Technical Officer(Health Promotion and Social Marketing)";
arrItemsGrp2[206] = 7
arrItems2[207] = "Technical Officer(Medical Laboratory Technology) ";
arrItemsGrp2[207] = 7
arrItems2[208] = "Technical Officer(Dental Surgery)";
arrItemsGrp2[208] = 7
arrItems2[209] = "Community Medicine and Health(Direct Entry Medical Assistant)";
arrItemsGrp2[209] = 7
/*Edit*/
var arrItems3 = new Array();
var arrItemsGrp3 = new Array();
arrItems3[24] = "College Of Health Kintampo";
arrItemsGrp3[24] = 106
arrItems3[25] = "Optical Technician School(OYORKO)";
arrItemsGrp3[25] = 107
arrItems3[26] = "Physiotherapy/Orthotics Assistant School(Duayaw Nkwanta)";
arrItemsGrp3[26] = 108
arrItems3[300] = "CHNTS AKIM ODA";
arrItemsGrp3[300] = 101
arrItems3[301] = "CHNTS ESIAMA";
arrItemsGrp3[301] = 101
arrItems3[302] = "CHNTS HO ";
arrItemsGrp3[302] = 101
arrItems3[303] = "CHNTS JIRAPA";
arrItemsGrp3[303] = 101
arrItems3[304] = "CHNTS NAVRONGO";
arrItemsGrp3[304] = 101
arrItems3[305] = "CHNTS WINNEBA";
arrItemsGrp3[305] = 101
arrItems3[306] = "CHNTS FOMENA";
arrItemsGrp3[306] = 101
arrItems3[307] = "CHNTS TAMALE";
arrItemsGrp3[307] = 101
arrItems3[308] = "CHNTS BOLE";
arrItemsGrp3[308] = 101
arrItems3[309] = "CHNTS TANOSO";
arrItemsGrp3[309] = 101
arrItems3[400] = "HATS ASANKRAGUA";
arrItemsGrp3[400] = 102
arrItems3[401] = "HATS ASANTA";
arrItemsGrp3[401] = 102
arrItems3[402] = "HATS ZUARUNGU";
arrItemsGrp3[402] = 102
arrItems3[403] = "HATS DAMANGO";
arrItemsGrp3[403] = 102
arrItems3[404] = "HATS DUNKWA-ON-OFFIN";
arrItemsGrp3[404] = 102
arrItems3[405] = "HATS KETA";
arrItemsGrp3[405] = 102
arrItems3[406] = "HATS KOKOFU";
arrItemsGrp3[406] = 102
arrItems3[407] = "HATS KPEMBE";
arrItemsGrp3[407] = 102
arrItems3[408] = "HATS LAWRA";
arrItemsGrp3[408] = 102
arrItems3[409] = "HATS MAMPONG ASHANTI";
arrItemsGrp3[409] = 102
arrItems3[410] = "HATS NALERIGU";
arrItemsGrp3[410] = 102
arrItems3[411] = "HATS SEFWI WIAWSO";
arrItemsGrp3[411] = 102
arrItems3[412] = "HATS SUNYANI";
arrItemsGrp3[412] = 102
arrItems3[413] = "HATS TEPA";
arrItemsGrp3[413] = 102
arrItems3[414] = "HATS TWIFO PRASO";
arrItemsGrp3[414] = 102
arrItems3[415] = "HATS PANTANG";
arrItemsGrp3[415] = 102
arrItems3[416] = "HATS WA";
arrItemsGrp3[416] = 102
arrItems3[417] = "HATS YENDI";
arrItemsGrp3[417] = 102
arrItems3[418] = "HATS TESHIE";
arrItemsGrp3[418] = 102
arrItems3[419] = "HATS SEIKWA";
arrItemsGrp3[419] = 102
arrItems3[500] = "NTC CAPE COAST";
arrItemsGrp3[500] = 150
arrItems3[501] = "NTC KORLE-BU";
arrItemsGrp3[501] = 150
arrItems3[502] = "NTC BAWKU";
arrItemsGrp3[502] = 150
arrItems3[503] = "NTC BOLGATANGA";
arrItemsGrp3[503] = 150
arrItems3[504] = "NTC KUMASI";
arrItemsGrp3[504] = 150
arrItems3[505] = "NTC NKAWKAW (FEMALES ONLY)";
arrItemsGrp3[505] = 150
arrItems3[506] = "NTC TAMALE";
arrItemsGrp3[506] = 150
arrItems3[507] = "NTC JIRAPA";
arrItemsGrp3[507] = 150
arrItems3[508] = "NTC AGOGO";
arrItemsGrp3[508] = 150
arrItems3[509] = "NTC SDA-KWADASO";
arrItemsGrp3[509] = 150
arrItems3[510] = "NTC KOFORIDUA";
arrItemsGrp3[510] = 150
arrItems3[511] = "NTC SUNYANI";
arrItemsGrp3[511] = 150
arrItems3[512] = "NTC HO";
arrItemsGrp3[512] = 150
arrItems3[513] = "NTC BEREKUM";
arrItemsGrp3[513] = 150
arrItems3[514] = "NTC DUNKWA-ON-OFFIN";
arrItemsGrp3[514] = 150
arrItems3[515] = "NTC SEKONDI";
arrItemsGrp3[515] = 150
arrItems3[600] = "NTC ANKAFUL (MENTAL NURSING)";
arrItemsGrp3[600] = 195
arrItems3[601] = "NTC PANTANG (MENTAL NURSING)";
arrItemsGrp3[601] = 195
arrItems3[700] = "CHNTS WINNEBA";
arrItemsGrp3[700] = 103
arrItems3[701] = "CHNTS AKIM ODA";
arrItemsGrp3[701] = 103
arrItems3[702] = "CHNTS NAVRONGO";
arrItemsGrp3[702] = 103
arrItems3[800] = "MTS TWIFO PRASO";
arrItemsGrp3[800] = 196
arrItems3[801] = "MTS KORLE-BU";
arrItemsGrp3[801] = 196
arrItems3[802] = "MTS BEREKUM";
arrItemsGrp3[802] = 196
arrItems3[803] = "MTS CAPE COAST";
arrItemsGrp3[803] = 196
arrItems3[804] = "MTS SEKONDI";
arrItemsGrp3[804] = 196
arrItems3[805] = "MTS KUMASI";
arrItemsGrp3[805] = 196
arrItems3[806] = "MTS BOLGATANGA";
arrItemsGrp3[806] = 196
arrItems3[807] = "MTS MAMPONG";
arrItemsGrp3[807] = 196
arrItems3[808] = "MTS KOFORIDUA";
arrItemsGrp3[808] = 196
arrItems3[809] = "MTS JIRAPA";
arrItemsGrp3[809] = 196
arrItems3[810] = "MTS ATIBIE";
arrItemsGrp3[810] = 196
arrItems3[811] = "MTS OFFINSO";
arrItemsGrp3[811] = 196
arrItems3[812] = "MTS HOHOE";
arrItemsGrp3[812] = 196
arrItems3[813] = "MTS TAMALE";
arrItemsGrp3[813] = 196
arrItems3[814] = "MTS TEPA";
arrItemsGrp3[814] = 196
arrItems3[815] = "MTS TARKWA";
arrItemsGrp3[815] = 196
arrItems3[6] = " College Of Health Kintampo";
arrItemsGrp3[6] = 104
arrItems3[80] = "School Of Hyiene Tamale";
arrItemsGrp3[80] = 105
arrItems3[81] = "School Of Hyiene Ho";
arrItemsGrp3[81] = 105
arrItems3[100] = "College of Health Kintampo";
arrItemsGrp3[100] = 200
arrItems3[101] = "College of Health Kintampo";
arrItemsGrp3[101] = 201
arrItems3[102] = "College of Health Kintampo";
arrItemsGrp3[102] = 203
arrItems3[103] = "School Of Hygiene - Korle Bu";
arrItemsGrp3[103] = 204
arrItems3[104] = "College of Health Kintampo";
arrItemsGrp3[104] = 205
arrItems3[105] = "College of Health Kintampo";
arrItemsGrp3[105] = 206
arrItems3[106] = "College of Health Kintampo";
arrItemsGrp3[106] = 207
arrItems3[107] = "College of Health Kintampo";
arrItemsGrp3[107] = 208
arrItems3[108] = "College of Health Kintampo";
arrItemsGrp3[108] = 209
function selectChange(control, controlToPopulate, ItemArray, GroupArray) {
var myEle ;
var x ;
// Empty the second drop down box of any choices
for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
if (control.name == "firstChoice") {
// Empty the third drop down box of any choices
for (var q=form.thirdChoice.options.length;q>=0;q--) form.thirdChoice.options[q] = null;
}
// ADD Default Choice - in case there are no values
myEle = document.createElement("option") ;
myEle.value = 0 ;
myEle.text = "[SELECT]" ;
// controlToPopulate.add(myEle) ;
controlToPopulate.appendChild(myEle)
// Now loop through the array of individual items
// Any containing the same child id are added to
// the second dropdown box
for ( x = 0 ; x < ItemArray.length ; x++ ) {
if ( GroupArray[x] == control.value ) {
myEle = document.createElement("option") ;
//myEle.value = x ;
myEle.setAttribute('value',x);
// myEle.text = ItemArray[x] ;
var txt = document.createTextNode(ItemArray[x]);
myEle.appendChild(txt)
// controlToPopulate.add(myEle) ;
controlToPopulate.appendChild(myEle)
}
}
}
function selectChange(control, controlToPopulate, ItemArray, GroupArray) {
var myEle ;
var x ;
// Empty the second drop down box of any choices
for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null;
if (control.name == "firstChoice") {
// Empty the third drop down box of any choices
for (var q=form.thirdChoice.options.length;q>=0;q--) form.thirdChoice.options[q] = null;
}
// ADD Default Choice - in case there are no values
myEle=document.createElement("option");
theText=document.createTextNode("[SELECT]");
myEle.appendChild(theText);
myEle.setAttribute("value","0");
controlToPopulate.appendChild(myEle);
// Now loop through the array of individual items
// Any containing the same child id are added to
// the second dropdown box
for ( x = 0 ; x < ItemArray.length ; x++ ) {
if ( GroupArray[x] == control.value ) {
myEle = document.createElement("option") ;
//myEle.value = x ;
myEle.setAttribute("value",x);
// myEle.text = ItemArray[x] ;
var txt = document.createTextNode(ItemArray[x]);
myEle.appendChild(txt)
// controlToPopulate.add(myEle) ;
controlToPopulate.appendChild(myEle)
}
}
}
// -->
|
daveVk
msg:4428331 | 11:18 pm on Mar 12, 2012 (gmt 0) |
Try Changing
myEle.setAttribute("value",x);
to
myEle.setAttribute("value",ItemArray[x]);
|
JuicyScript
msg:4428340 | 11:42 pm on Mar 12, 2012 (gmt 0) |
I tried that but didnt work.Still getting the number s
|
daveVk
msg:4428402 | 2:49 am on Mar 13, 2012 (gmt 0) |
First only need one function selectChange so delete second copy, and ensure remaining copy includes suggested change.
Inspect generated HTML and look for
<option value="Certificate"
vs
<option value="6"
How you do that depends on the browser and tools you are using, check all view source options you have available.
|
JuicyScript
msg:4428429 | 4:39 am on Mar 13, 2012 (gmt 0) |
Dave can you give me an example because am finding it difficult to understand(Am new at this) and when i change the
myEle.setAttribute("value",x);
to
myEle.setAttribute("value",ItemArray[x]);
it messes up my selection.
|
JuicyScript
msg:4428430 | 4:39 am on Mar 13, 2012 (gmt 0) |
Dave can you give me an example because am finding it difficult to understand(Am new at this) and when i change the
myEle.setAttribute("value",x);
to
myEle.setAttribute("value",ItemArray[x]);
it messes up my selection.
|
daveVk
msg:4428440 | 5:10 am on Mar 13, 2012 (gmt 0) |
My understanding of the problem is that original generated for example
<option value="6" >Certificate</option>
that will return 6 to the server when "Certificate" is selected
if you wish to return the word "Certificate" rather than 6 it needs to be
<option value="Certificate" >Certificate</option>
You original post contained
function selectChange(control, controlToPopulate, ItemArray, GroupArray) {
var myEle ;
... lines removed ...
}
function selectChange(control, controlToPopulate, ItemArray, GroupArray) {
var myEle ;
... lines removed ...
}
|
|
There is no point in having 2 functions with same name, as only the last will be used. Delete one.
| it messes up my selection. |
|
In what way ?
|
JuicyScript
msg:4428446 | 5:44 am on Mar 13, 2012 (gmt 0) |
When i replace myEle.setAttribute("value",x);
with
myEle.setAttribute("value",ItemArray[x]);
the third and fourth selections are unable to populate.It there another way?
|
daveVk
msg:4428452 | 6:25 am on Mar 13, 2012 (gmt 0) |
Changing control.value to text has broken this line, GroupArray[x] is a number and control.value is NOW Text
if ( GroupArray[x] == control.value ) {
try replacing with
if ( ItemArray[x] == control.value ) {
there may well be other broken stuff.
|
JuicyScript
msg:4428489 | 10:00 am on Mar 13, 2012 (gmt 0) |
Hi Dave
This time three dropdown selection could not be populated
Can we try something else please
|
Fotiman
msg:4428594 | 1:45 pm on Mar 13, 2012 (gmt 0) |
My problem is that i want to submit the option name to the database and not the value which are numbers
Eg Instead of submitting option value 6 into the database i want certificate to be submitted.
|
|
If that is what you want, then just change your <option> tags to include "certificate" as the value instead of "6". That is the correct solution to this problem, as another other solution will fail if JavaScript is disabled.
|
Fotiman
msg:4428608 | 2:20 pm on Mar 13, 2012 (gmt 0) |
Looking more closely, I see that it's already a JavaScript-only solution. I think the problem is that you are storing your data in a very arbitrary data structure and then trying to link them all together in a very complex way. It looks to me as though you could better represent this data as a tree or linked list. You need to clean up and simplify the way you are linking your data first.
|
daveVk
msg:4428862 | 12:43 am on Mar 14, 2012 (gmt 0) |
Other options are to convert the numbers to text as part of the submit process, or to do the conversion in the server.
What javascript if any is attached to the submit button or the form onsubmit method ?
|
|
|
