aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes selection box problem Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "selection box problem" Watch "selection box problem" New topic
Author

selection box problem

srinu reddyreddy
Greenhorn

Joined: Jan 05, 2007
Posts: 11
pls. look into this code and suggest me,how to write a function which dynamically changes the content of multiple list box when we select different options sigle list box

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>

<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jstl/core-rt" prefix="c-rt" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Generic View JSP Page</title>
<script src="prototype.js"></script>
<script src="rico.js"></script>
<script>

ProcessEditRequest = Class.create();
ProcessEditRequest.prototype = {
initialize: function() {
//alert("init called");
},
ajaxUpdate: function(ajaxResponse) {
alert("ajaxResponse.size"+ajaxResponse.childNodes.length);
var root1= ajaxResponse.childNodes[0];
alert("ajaxResponse.parameters"+root1.childNodes.length);
var root2= root1.childNodes[0];
alert("ajaxResponse.parameter"+root2.childNodes.length);
var root3= root2.childNodes[0];
alert("ajaxResponse.key-values"+root3.childNodes.length);
[SIZE="6"]var oTable = document.createElement("table");
oTable.border="1";
var trH = document.createElement("tr");

var thH1 = document.createElement("th");
var textNthH1=document.createTextNode("keys");
thH1.appendChild(textNthH1);
trH.appendChild(thH1);

var thH2=document.createElement("th");
var textNthH2=document.createTextNode("values");
thH2.appendChild(textNthH2);
trH.appendChild(thH2);
var trB = document.createElement("tr");

var tdB1 = document.createElement("td");
var list1=document.createElement("select");
list1.name="or";
list1.id="or" ;
//list1.o="populate(this)";
tdB1.appendChild(list1);
trB.appendChild(tdB1);
//var textNtdB1 = document.createTextNode(sWhat);
//tdB1.appendChild(textNtdB1);
//trB.appendChild(tdB1);

var tdB2 = document.createElement("td");
var list2=document.createElement("select");
list2.name="or2";
list2.id="or2" ;
list2.multiple=true;
//list2.onchange="populate(this)";
tdB2.appendChild(list2);
trB.appendChild(tdB2);

//var textNtdB2 = document.createTextNode(sWho);
//tdB2.appendChild(textNtdB2);
//trB.appendChild(tdB2);



oTable.appendChild(trH);
oTable.appendChild(trB);
for(var i = 0 ; i < root2.childNodes.length ; i++){

var currentChild1=root2.childNodes[i];
var currentChild=currentChild1.childNodes[0];
sKey=currentChild.firstChild.nodeValue;
alert("sKet"+sKey);
currentChild = currentChild.nextSibling;
sValue1 = currentChild.firstChild.nodeValue;

currentChild = currentChild.nextSibling;
sValue2 = currentChild.firstChild.nodeValue;

var opt1 = document.createElement("option");
opt1.value=sKey;
var textOP1 = document.createTextNode(sKey);
opt1.appendChild(textOP1);
list1.appendChild(opt1);

var opt2 = document.createElement("option");
opt2.value=sValue1;
var textOP2 = document.createTextNode(sValue1);
opt2.appendChild(textOP2);
list2.style.display="none";
list2.appendChild(opt2);

var opt3 = document.createElement("option");
opt3.value=sValue2;
var textOP3 = document.createTextNode(sValue2);
opt3.appendChild(textOP3);

list2.appendChild(opt3);


}
var divTable = document.getElementById("editDiv");
divTable.appendChild(oTable);
//alert(ajaxResponse.getAttribute("id"));
//alert(ajaxResponse.childNodes[0].nodeName);
//alert(ajaxResponse.childNodes[0].childNodes[1].nodeValue);
//alert(ajaxResponse.childNodes[0].childNodes[1].attributes.length);
//alert(ajaxResponse.childNodes[0].childNodes[1].nodeName);

//var myxml = ajaxResponse.firstChild.xml;
//alert(myxml);
//document.getElementById("editBox").value=myxml;
//document.getElementById("editDiv").innerHTML=myxml;
}
};
[/SIZE]
</script>
</head>
<body>
<div id="editDiv" >
</div>
<script>

sendAJAXRequest();

function sendAJAXRequest() {

ajaxEngine.registerRequest( 'ProcessEditRequest', 'http://localhost:8080/example/editSer');
this.ProcessEditRequest= new ProcessEditRequest();
//alert("1 called");
ajaxEngine.registerAjaxObject('ProcessEditRequest', ProcessEditRequest);
// alert("Sending AJAX request...");
ajaxEngine.sendRequest('ProcessEditRequest');
// alert("AJAX Request sent successfully");
}


</script>
</body>
</html>
regards
srinu
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
You do not have to create an element.

You can have a select on the page

<select id="s1"></select>

and add options to it via new Option()



ideally I would send my values back to the server in a JSON object:

{options: [{text: "foo1", value : "bar1"},{text: "foo2", value : "bar2"},{text: "foo3", value : "bar3"}]}

with the response you would eval it:



If you od not want the select to be visible until it has values, you can set the display to none and inline.

Eric
srinu reddyreddy
Greenhorn

Joined: Jan 05, 2007
Posts: 11
i don't understand the following code, how to convert axaxresponse to JSON response ,pls. help me and what is myXMLHttp ,how to get myXMLHttp.

var myOpts = eval"'" + myXMLHttp.responseText + "'"); //the JSON response
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: selection box problem