JavaScript problem

[anuj_web]

NOTHER Q

I just want to stor values from 1 to 31 in a combobox.....I tried this code...but
Cannot run th is fuction in the Onclick event ,also not working in Onchange event

<select name="cmbmonth" size="1" id="Combobox8" style="position:absolute;left:181px;top:341px;width:73px;font-family:MS Shell Dlg;z-index:17" OnChange = "Populatecmbdate(document.frmdreg)">

function Populatecmbdate(theForm)
{
for(var i=1 ; i < 32 ; i++)
 {
 eval("theForm.cmbdate.options[i]=" + i);
 }
}
}

 

[nightscream]

Give us the error please or don't you get an error?

 

[anuj_web]

This time also i dont get an error ,it just does not work

 

[marshian]

Are you sure you have javascript enabled? it should usually do something or give an error...

Try this:

<select name="cmbmonth" size="1" id="Combobox8" style="position:absolute;left:181px;top:341px;width:73px;font-family:MS Shell Dlg;z-index:17" OnChange = "Populatecmbdate(document.frmdreg)">
<script language="JavaScript">
for(i=0; i<32; i++) {
document.writeln("<option value=\""+i+"\">"+i);
}
</script>
</select>

But there's some disadvantages with this, as the user can disable javascript...
A solution that would always be executed is:

<select name="cmbmonth" size="1" id="Combobox8" style="position:absolute;left:181px;top:341px;width:73px;font-family:MS Shell Dlg;z-index:17" OnChange = "Populatecmbdate(document.frmdreg)">
<?php
for($i=0; $i<32; $i++) {
echo "<option value=\"".$i."\">".$i;
}
?>
</select>

But I think it's more a waste of time, just put 31 options in your page...
Note: if you're trying to make a script that adjusts the number of options based on the month selected in the same form, it's best to have all options there and hide the non-existing numbers when the user selects a new month. this way the user will always be able to select the number, even if he doesn't have javascript enabled. warning: if you do this, remember to check (serverside) wether the form has been filled in correct

 

[woiwky]

You have an extra right curly brace in code. I would delete it unless you copied it by accident and it is valid in the context of your whole script.

But anyway, first of all, you don't need to use eval() for that function. And second, you can't set an option to an integer. An option is an html object, so you'd need to use options.value and options.innerHTML. However, that would throw an error if there weren't 31 options to begin with. This would probably give you better results:

function Populatecmbdate(theForm) {
    var options = '';
    for(var i = 1; i < 32; i++) {
        options += '<option value="' + i + '">' + i + '</option>';
    }
    theForm.cmbdate.innerHTML = options;
}

 

[anuj_web]

hey ,thanks woiwky and marshian...
Javascript is enabled ...I have already implemented another JS code successfully and ...

I used PHP ..that was a good idea...

now i will use JS to populate my month combo according to the date chosen ....

just watch out for another problem

BtW can u tell me where can i find tuts for handling HTML objects with JS code

 

[crisp]

BtW can u tell me where can i find tuts for handling HTML objects with JS code

What you're looking for is tuts on scripting the DOM (Document Object Model). The technical stuff can be found here http://www.w3.org/TR/REC-DOM-Level-1/

they (w3c) also provide a lot of tuts over at w3schools

http://www.w3schools.com/js/js_obj_htmldom.asp
http://www.w3schools.com/JS/default.asp

a couple of decent articles to get you started here

http://www.howtocreate.co.uk/tutorials/javascript/domintroduction
http://www.digital-web.com/articles/forms_usability_and_the_w3c_dom/

 

[anuj_web]

thanks Crisp



I actually want to dynamically connect two combos..one month the other contains dates..
I want that the date combo is populated accordingly as the month is chosen.....

I want to use an If statement to check which combobox value is selected....

can u tell me how to access the selected 'value' in a combobox from a JS function
and what parameters to pass to it


One more thing :
To chk entering of invalid characters i used this code in the keypress event of a text box...how to integrate it into a function so that i dont have 2 use the whole code everytime into the HTML tag....like just by calling the function ??

onKeypress="if (event.keyCode==34 || event.keyCode==39 || (event.keyCode > 32 && event.keyCode < 48) || (event.keyCode > 57 && event.keyCode < 65) || (event.keyCode > 90 && event.keyCode < 97)) event.returnValue = false;"

Where can i find the keycodes for various keys ??

 

[federico_casares]

You should define your function in a separate .js file (the neat way), call it in the head section using <script src='path to js file' type='text/javascript'></script> and then doing onkeypress="myFunction()".

Remember that you can pass events to function. Check this page out, it's really useful:
http://www.quirksmode.org/js/introevents.html

Regarding the combo completion system you should use DOM methods, that are standards-compliant and not document.write and that kind of things...
So, to put options inside the combo you do:

var option = document.createElement("option");
option.value = 'value';
option.innerHTML = 'text to display';
select.appendChild(option);

=)

 

[anuj_web]

hey i didnt get the second part of your answer.....
can u please elaborate a little bit....

Dont you think i need to pass the object also to the function..how will the function kno which object the event refers ...

I want to use an If statement to check which combobox value is selected....

can u tell me how to access the selected 'value' in a combobox from a JS function
and what parameters to pass to it

bro you really do provide awesome links ..

thanks

 

[federico_casares]

Alright, let's see... The standards compliant way to check the selected value of a select is:

var mySelect = document.getElementById('my_select_id');
var myValue = mySelect.options[mySelect.selectedIndex].value;

I guess that what you want to do can be done using an array that says how many days has each month. Then you look for the index in that array and make a for inserting each option how I explained before (using createElement).

Probably something like this:

var monthsArray = new Array();
monthsArray[1] = 31;
monthsArray[2] = 29;
monthsArray[3] = 31;
...
...
monthsArray[12] = 31;
var mySelect = document.getElementById('my_select_id');
var myValue = mySelect.options[mySelect.selectedIndex].value;
daysSelect = document.getElementById('my_days_select_id');
daysSelect.innerHTML = ''; // empty the select

for(x=1;x<=myValue;x++) {
  var option = document.createElement("option"); // create the option node
  option.value = x; // assign the value
  option.innerHTML = x; // assign the label
  daysSelect.appendChild(option); // append the option to the select
}

Probably having all that code inside a function that is called in the onchange event of the select...

 

[anuj_web]

Can u please explain what my_select_id and 'my_days_select_id is ...
ok wat i undestand is it might be the id of some control..
but wat is passed to the function as a n argument??

 

[federico_casares]

They are the IDs of the select tags in the HTML document, just that... This function would use no arguments, really. It does what it needs just using the DOM.

 

[anuj_web]

ok i'll try and ...reply ..
please give me a sec...

not working...

I only need to change the id's of the control ...??

i did it..but does not work

OK NOW IT HAS SOME OUTPUT..i had not declared the array..but here wat haapens the code populates the combo with the no of the month eg: for june it is populated from 1 to 6

 

[federico_casares]

Sorry! My mistake!!

The line with the for should be:
for(x=1;x<=monthsArray[myValue];x++) {

 

[anuj_web]

the above code worked beautifully thanks.....

and...

about the keypress event thingy..
Dont you think i need to pass the object also to the function..how will the function kno which object the event refers ...


In case i want to check for a value of the combo then what method of the combo should i use..i always fall for that...
I need to do this when I have to check whethe the user has selected a leap year then i'll run the feb loop upto 28

^^

 

[federico_casares]

Maybe you can call a function in the onsubmit of the form, where you make all the checks.

<form onsubmit="return validateForm()" ... >

Where validateForm is a function that performs all the checks, shows alerts and returns false if anything went wrong, true if everything's OK. The leap year validation would be something like "if year is not leap year AND month is february AND day is 29 then show error message and return false".

 

[anuj_web]

ya that is wat im asking ..wat to write inside the if() coz i dont now how to point to the valus of a combo control

 

[federico_casares]

As I told you before, you should use:

var mySelect = document.getElementById('select_id');
var myOption = mySelect.options[mySelect.selectedIndex].value;

You'll have the value of the selected option in the var myOption.

 

[anuj_web]

ohh gr8...now i can use this method 4 ever combo..huge relief now..
thanks a ton
owe u a lot bro ^^
Edit:
Just one more problem ...
when i select january nothing happens....i have to sselect others first...
I used the onclick() it works fine now

I'll work on the keypress event thing now and reply.....