javascript - Populate directory hirerachy on server to multiple html Dropdown list using jquery or Ajax -
i beginner in using jquery , ajax.
have following hierarchy of directories on server.
i file hierarchy dynamically dropdown
onclick of "search" button, download url (as shown below) selected drop down values should appear "http://abc.def.com/productname1/series1.1/filename1.1.zip"
i understand best way accomplish using jquery , ajax.
how make directory hierarchy of "product name" on server appear dynamically ? , the respective "product series" , "file" change whenever new product name selected?
here real basic layout. particular solution calls can split 2 pages. make multiple calls build dropdowns, use function since logic repeat drill down folders:
index.php
<?php error_reporting(e_all); if(isset($_post['scan']) && !empty($_post['scan'])) { // convenience, can see returns print_r($_post); $filter[] = '.'; $filter[] = '..'; // decode directory string form $dir = base64_decode(urldecode($_post['dir'])); // add root (you may have defined root, // using server document root key/value $current = str_replace("//","/",$_server['document_root'].$dir); // check directory exists if(is_dir($current)) { // scan directory $files = scandir($current); // if there folders/files if(!empty($files)) { ?> <label>series</label> <select name="series"> <?php foreach($files $infolder) { // if return directories if(is_dir($current.$infolder) && !in_array($infolder,$filter)) { ?> <option name="<?php echo urlencode(base64_encode($infolder)); ?>"><?php echo substr($infolder,0,20); ?></option> <?php } } ?> </select> <?php } } // exit don't continue print bottom stuff // load in first place exit; } // these fake, obviously. can populate // first dropdown want $dir = "/root/"; $dir2 = "/root/folder1/"; ?> <form id="get_files" method="post"> <input type="hidden" name="scan" value="true" /> <select name="dir"> <!-- encoding makes easier transport data --> <!-- base64 sufficient --> <option value="<?php echo urlencode(base64_encode($dir)); ?>"><?php echo substr($dir,0,10); ?></option> <option value="<?php echo urlencode(base64_encode($dir2)); ?>"><?php echo substr($dir2,0,10); ?></option> </select> <div id="form_load"></div> <input type="submit" value="submit" /> </form> <!-- jquery libraries --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script> <!-- jquery ajax --> <script> $("#get_files").submit(function() { $.ajax({ url: 'index.php', data: $(this).serialize(), type: 'post', success: function(response) { $("#form_load").html(response); } }); return false; }); </script>
Comments
Post a Comment