i808237
asked on
AJAX and
Hello AJAX Expert,
I am trying to implement the Select/Dropdown AJAX tag from the following link. The Select/Dropdown tag work the following way: when selection within a dropdown field, a second select field will be populated.
See the following link: http://ajaxtags.no-ip.info/
The demo has 2 files associated with it, a JSP and a JAVA servlet. The servlet name is DropdownServlet. How is this servlet called from the JSP with the following ajax:select tag?
<ajax:select
baseUrl="${contextPath}/dr opdown.vie w"
source="make"
target="model"
parameters="make={make}"
preFunction="initProgress"
postFunction="resetProgres s"
errorFunction="reportError "
parser="new ResponseXmlParser()" />
I am using Netbeans IDE with JSP named dropdown and servlet named DropdownServlet. I think DropdownServlet is supposed to return model given make to the JSP to be displayed in the chained dropdown box.
Heres a code snippet from the demo JSP:
<form action="." class="basicForm">
<fieldset>
<legend>Choose Your Car</legend>
<label for="make">Make:</label>
<select id="make">
<option value="">Select make</option>
<option value="Ford">Ford</option>
<option value="Honda">Honda</optio n>
<option value="Mazda">Mazda</optio n>
</select>
<span id="progressMsg" style="display:none;"><img alt="Indicator" src="./styles/indicator.gi f" /> Loading...</span>
<label for="model">Model:</label>
<select id="model" disabled="disabled">
<option value="">Select model</option>
</select>
</fieldset>
</form>
<div id="errorMsg" style="display:none;border :1px solid #e00;background-color:#fee ;padding:2 px;margin- top:8px;wi dth:300px; font:norma l 12px Arial;color:#900"></div>
<script type="text/javascript">
/*
* USER DEFINED FUNCTIONS
*/
function initProgress() {
Element.show('progressMsg' );
}
function resetProgress() {
// show marker emblem
var index = $('make').selectedIndex;
var automaker = $('make').options[index].t ext;
var imgTag = $('makerEmblem');
if (index > 0) {
imgTag.src = "./styles/" + automaker.toLowerCase() + "_logo.gif";
}
Effect.Fade('progressMsg') ;
}
function reportError() {
if ($('model').options.length == 0) {
$('errorMsg').innerHTML = "Dropdown busted!";
}
Element.show('errorMsg');
setTimeout("Effect.DropOut ('errorMsg ')", 2500);
}
</script>
<ajax:select
baseUrl="${pageContext.req uest.conte xtPath}/Dr opdownServ let"
source="make"
target="model"
parameters="make={make}"
preFunction="initProgress"
postFunction="resetProgres s"
errorFunction="reportError "
parser="new ResponseXmlParser()" />
Can you tell be how the servlet gets called in this AJAX demo?
Getting desperate. Appreciate the help!!
I am trying to implement the Select/Dropdown AJAX tag from the following link. The Select/Dropdown tag work the following way: when selection within a dropdown field, a second select field will be populated.
See the following link: http://ajaxtags.no-ip.info/
The demo has 2 files associated with it, a JSP and a JAVA servlet. The servlet name is DropdownServlet. How is this servlet called from the JSP with the following ajax:select tag?
<ajax:select
baseUrl="${contextPath}/dr
source="make"
target="model"
parameters="make={make}"
preFunction="initProgress"
postFunction="resetProgres
errorFunction="reportError
parser="new ResponseXmlParser()" />
I am using Netbeans IDE with JSP named dropdown and servlet named DropdownServlet. I think DropdownServlet is supposed to return model given make to the JSP to be displayed in the chained dropdown box.
Heres a code snippet from the demo JSP:
<form action="." class="basicForm">
<fieldset>
<legend>Choose Your Car</legend>
<label for="make">Make:</label>
<select id="make">
<option value="">Select make</option>
<option value="Ford">Ford</option>
<option value="Honda">Honda</optio
<option value="Mazda">Mazda</optio
</select>
<span id="progressMsg" style="display:none;"><img
<label for="model">Model:</label>
<select id="model" disabled="disabled">
<option value="">Select model</option>
</select>
</fieldset>
</form>
<div id="errorMsg" style="display:none;border
<script type="text/javascript">
/*
* USER DEFINED FUNCTIONS
*/
function initProgress() {
Element.show('progressMsg'
}
function resetProgress() {
// show marker emblem
var index = $('make').selectedIndex;
var automaker = $('make').options[index].t
var imgTag = $('makerEmblem');
if (index > 0) {
imgTag.src = "./styles/" + automaker.toLowerCase() + "_logo.gif";
}
Effect.Fade('progressMsg')
}
function reportError() {
if ($('model').options.length
$('errorMsg').innerHTML = "Dropdown busted!";
}
Element.show('errorMsg');
setTimeout("Effect.DropOut
}
</script>
<ajax:select
baseUrl="${pageContext.req
source="make"
target="model"
parameters="make={make}"
preFunction="initProgress"
postFunction="resetProgres
errorFunction="reportError
parser="new ResponseXmlParser()" />
Can you tell be how the servlet gets called in this AJAX demo?
Getting desperate. Appreciate the help!!
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.