January 22nd, 2010, 07:36 AM
#1
Struts+Ajax Dependency of 2 comboboxes
Hi,
It`s very urgent issue to me!
My problem is I have 2 <html:select> list
1.products combo list
2subProducts combo list
Problems:
1.If i select any one product, i have to make a ajax call and i need to display the subproducts of the selected product. These is coming from database
2.If i selected more than one product in product combo list, i need to display the list of suboproducts of the selected products.
I am getting the values from database like this |subproduct1|subproduct2|subproduct3
My code is
in jsp
function updateSubproductarea() {
alert("In updateSubproductarea");
var product = document.getElementById("productarea");
//if(product.selectedIndex==0){
// return;
// }
selectedProduct = product.options[product.selectedIndex].value;
alert(selectedProduct);
var url = "../servlet/CreateTestCase.do?action=create";
url="../servlet/CreateUser.do?action=subproduct&selectedProduct="+selectedProduct;
if (window.XMLHttpRequest){ // Non-IE browsers
req = new XMLHttpRequest();
//A call-back function is define so the browser knows which function to call after the server gives a reponse back
req.onreadystatechange = populateSecondBox;
alert(req.readystate);
try {
req.open("GET", url, true); //was get
} catch (e) {
alert("Cannot connect to server");
}
req.send(null);
} else if (window.ActiveXObject) { // IE
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = populateSecondBox;
req.open("GET", url, true);
req.send();
}
}
}
function populateSecondBox(){
//document.getElementById('productSubarea').options.length = 0;
// var subproduct=document.getElementById('productSubarea');
if (req.readyState == 4) { // Complete
if (req.status == 200) {
alert("hiiiiiii");// OK response
var textToSplit = req.responseText
if(textToSplit == '803'){
alert("No select option available on the server")
}
if(textToSplit!=""){ //Split the document
var returnElements=textToSplit.split("|");
alert("&&&&&&&&&&&"+returnElements.length);
alert("returnElements"+returnElements);
document.forms[0]. productSubarea.length =returnElements.length+1;
//subproduct.options.value="All";
alert("heeeeeeellllll");
//if(returnElements!=null)
// {
for ( var i=0; i<returnElements.length; i++ ){
alert("happy"+i);
//subproduct.options[i].text = returnElements[i+1].split("|");
// document.forms[0]. productSubarea[i].value = returnElements[i+];
document.forms[0]. productSubarea[i].text = returnElements[i+1];
}
}
//}
//else{
//document.forms[0]. productSubarea.length = 1;
// document.forms[0]. productSubarea.value = "ALL";
// document.forms[0]. productSubarea.text = "ALL";
//}
}
}
else {
alert("Bad response by the server");
}
}
</script>
</head>
<tr>
<td height="12" style="text-align: right" width="229"><font face="Arial">Product Area :</td>
<td height="17"><html:select property="selectedProdAreas" name="CreateUserForm" multiple="true" styleId="productarea" onchange="return updateSubproductarea();" >
<html ptionsCollection property="prodAreas" value="productAreaId" label="productAreaName" />
</html:select></font>
</td>
</tr>
<tr>
<td height="12" style="text-align: right" width="229"><font face="Arial">Product SubArea :</td>
<td height="17"><html:select property="selectedSubProdAreas" name="CreateUserForm" multiple="true" styleId="productSubarea">
</html:select></font>
</td>
</tr>
In action class
private ActionForward subProductNames(ActionMapping mapping,
ActionForm form, HttpServletRequest request,
HttpServletResponse response) throws Exception, PersistenceException{
CreateUserForm userForm = (CreateUserForm)form;
Map prodSubAreas=new HashMap();
//String productSubName=new String();
String productSubName=null;
String optionSelected = request.getParameter("selectedProduct");
int productID=Integer.parseInt(optionSelected);
System.out.printf("UUUUUUUUUUUUUUUUUU"+optionSelected);
TCMSPersistenceManagerImpl impl = new TCMSPersistenceManagerImpl();
if(optionSelected!=null)
{
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
prodSubAreas = impl.getProductSubAreaDetails(productID);
productSubName=makeOutputString(prodSubAreas);
System.out.println("*****************"+productSubName);
PrintWriter out = response.getWriter();
out.print(productSubName);
}
return null;
//return mapping.findForward( "subproduct" );
}
private String makeOutputString(Map prodSubAreas) {
String productSubName=new String();
Iterator productSubIterator = prodSubAreas.entrySet().iterator();
while(productSubIterator.hasNext()){
Map.Entry productSubEntry = (Map.Entry) productSubIterator.next();
productSubName = productSubName+"|"+(String) productSubEntry.getValue();
}
return productSubName;
}
But i am getting the problem is
I am attaching the bmp files for the output i am getting for 2 problems.
problem1.bmp and problem2.bmp
1.i am getting the value as undefined for last one with subproducts
2.i am unable to retreive the subproducts list if i selected multiple products
Pls Urgent. If u get any solution send the email to me
padmajap13@gmail.com
PLS HELP ME
IT`S URGENT
Posting Permissions
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
Forum Rules
Click Here to Expand Forum to Full Width
Bookmarks