1

I have two dropdowns to fill up by applying the following cases:

  1. Fill the the first dropdown with all the folder names (done by using File class).
  2. Fill the second dropdown with the subfolder names which is now based on the first dropdown.

So my jQuery part is:

$('#rootFolder').change(function() { 
    var rootFoldervalue = $(this).options[$('#rootFolder').selectedIndex];

How do I send this selected rootFolder value to my JSP page so that i can again calculate the subFolder names and show it in the second dropdown?

getsubfolder.jsp

<%
    String root = request.getParameter("foldername");
    String path = "G:\\ANDROID\\";
    File rootFile = new File(path);
    File[] listOfDirs = rootFile.listFiles();
    out.println(listOfDirs);
%>

jQuery part:

$(document).ready(function() {
    $("#rootFolder").change(function() {
        var rootFolderValue = $('#rootFolder').val();
        $.ajax({
            url: 'getsubfolder.jsp',
            data:'foldername=' + rootFolderValue,
            dataType: 'json',
            success:function(data) {
                $.each(data, function(i, data) {
                $('#subFolder').append(
                    $('<option></option>').val(data.Value).html(data.Text)
                )});
            }
        });

Transferring file array as a JSON is not working. How do I manipulate the values received in the data of success part of $.ajax() to populate my second dropdown?

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
HungryProgrammer
  • 165
  • 1
  • 2
  • 11
  • The problem is in your `getsubfolder.jsp`. It apparently didn't return a valid JSON string. You need to show the code of `getsubfolder.jsp` so that we can point out your mistake. In the meanwhile, learn the JSON format here: http://json.org. – BalusC Jan 09 '12 at 13:02

1 Answers1

1

Your JS code could be simplified to

var rootFolderValue = $(this).val();

Once you have this value, send an AJAX request to your server (something like .../getSubFolders?rootFolder=<the root folder>). The server could answer with a JSON array of subfolders, or directly with the HTML to put inside the second select box. In the callback function of your AJAX request, populate the second select box with what you received from the server.

See http://api.jquery.com/category/ajax/. Depending on the strategy you choose, you might use get(), getJSON() or even load().

JB Nizet
  • 678,734
  • 91
  • 1,224
  • 1,255
  • I printed the list of subdirs in one jsp file based on the value received through $.ajax data .This value will then be captured by Success part. But I couldnt print the value to the second combo box. Please help me with the codes below: – HungryProgrammer Jan 08 '12 at 09:09