• Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

JSF drop down change using javascript and ajax

 
ruchi thakur
Greenhorn
Posts: 11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hello All,

I am veryyyy newwww to JSF. I would really appreciate any help on the issue that i am facing. My requirement is as follows.
I have 2 Select Boxes (SelectOneMenu),
country and state. On the change of country, i want to filter the state select box. These values of state are to be picked updynamically from database, everytime country changes. I am using ajax for the same, so that the whole page does not refresh again. For using ajax, i am calling the javascript function changeSelBox().
changeSelBox() - This js function gets the values from database(using ajax), and then empties the state select box(using js), and populate it again with the new state code(using js).
In my browser i am also able to see new state codes in the state select box.
But after this if i click the submit button, using h:command button, my method register does not gets called, and the jsf page refreshes again.
Below are the few snippets from my jsf code
<h:commandButton value="#{msg.submit}"
action="#{registrationBean.register}" />

<h:selectOneMenu id="country" onchange="changeSelBox();" value="#{registrationBean.person.country}" >
<f:selectItems value="#{registrationBean.country_code}"/>
</h:selectOneMenu>

<h:selectOneMenu id="state" value="#{registrationBean.person.state}" >
<f:selectItems value="#{registrationBean.state_code}"/>
</h:selectOneMenu>

Please suggest if i am doing something wrong or needto proviode more information.

Thanks and Regards,
Ruchika
 
Jignesh Patel
Ranch Hand
Posts: 626
Mac
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Though I am not AJAX/JSF expertise, it is hard to tell whats wrong as code looks fine.

Can you please develop a seperate jsp without state change code and try to submit page.

Also do try to see your servers log file. You didn't mention what server are you using?
 
Jignesh Patel
Ranch Hand
Posts: 626
Mac
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Just forget to mention there are some issues of using </h:selectOneMenu> appropriatly.
 
ruchi thakur
Greenhorn
Posts: 11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks Jignesh.
Ok , let us not think about ajax for a while. I removed the ajax part from the js function changeSelBox()
I changes my function changeSelBox() to as shown below. In this I am only removing the select box option values and then refilling them with some hardcoded state values. If this simple js function is called on country change, this also give a problem on SUBMIT. My observation is that whenever js function alter registerForm:state_code select box values, submit stops working. Though it goes to server, but action method registrationBean.register is not called Please suggest.

function changeSelBox()
{
while (document.registerForm.elements["registerForm:state_code"].options.length > 0)
{
document.registerForm.elements["registerForm:state_code"].remove(0);
}
var countryName="2121"
var countryId="12"
var option = document.createElement("OPTION");
option.text="Ohio";
option.value="1";
document.registerForm.elements["registerForm:state_code"].add(option);

var option = document.createElement("OPTION");
option.text="Albany";
option.value="2";
document.registerForm.elements["registerForm:state_code"].add(option);
}

Regards,
Ruchika
 
ruchi thakur
Greenhorn
Posts: 11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Ok. I am using jboss 4.0.5 server.
Regards,
 
ruchi thakur
Greenhorn
Posts: 11
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Please suggest, if will not be able to change a select box values using javascipt in jsf.
Regards,
Reena
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic