Question

我需要显示文件＆amp;在Kendo UI树视图中分层次地使用文件夹，后端使用Java从文件系统加载。我还需要在单击文件时加载文件的内容。

有谁能建议如何做到这一点？

Answer 1

我通过创建两个java文件来完成加载层次结构。

我在D：/sampleFileExplorer中有一些文件夹和文件。使用java文件Api我们读取文件和子目录结构并将其放在Type的TypeList中.In TestJava.java getFileExplorer（folder，finalList）是构造的方法Arraylist并返回它。你需要从Kendo jsp调用这个方法，我们得到json格式的结果。

FileExplorer.java

import java.util.ArrayList;
import java.util.List;

public class FileExplorer {

    private String id;
    private String text;
    private boolean hasFiles;
    private List<FileExplorer> items = new ArrayList<FileExplorer>();

    public String getId() {
        return this.id;
    }
    public void setId(String id) {
        this.id = id;
    }
    public String getText() {
        return this.text;
    }
    public void setText(String text) {
        this.text = text;
    }
    public List<FileExplorer> getItems() {
        return this.items;
    }
    public void setItems(List<FileExplorer> items) {
        this.items = items;
    }

    public boolean isHasFiles() {
        return this.hasFiles;
    }
    public void setHasFiles(boolean hasFiles) {
        this.hasFiles = hasFiles;
    }

}

TestJava.java

import java.io.File;
import java.util.ArrayList;
import java.util.List;

public class TestJava {


    public static void main(String[] args) {

        TestJava t=new TestJava();
        List<FileExplorer> finalList = new ArrayList<FileExplorer>();
        File folder = new File("D:/SampleFileExplorer");
            t.getFileExplorer(folder,finalList);
        t.displayFileExplorer(folder,finalList); 


    }

    public List<FileExplorer> getFileExplorer(File folder,List<FileExplorer> finalList){

        finalList = getFileOrDirectoryList(folder,finalList);
        return finalList;
    }

    public  void displayFileExplorer(File folder,List<FileExplorer> finalList){

        finalList = getFileOrDirectoryList(folder,finalList);

        for(FileExplorer file : finalList){
            System.out.println(file.getId()+" "+file.getText()+" "+file.getItems().size()+" ");
            displaySubLevels(file.getItems());
        }
    }

    public  void displaySubLevels(List<FileExplorer> subList){ //display subdirectory's content  
        if(subList != null){
            for(FileExplorer subFile : subList){
                System.out.println(subFile.getId()+" "+subFile.getText()+" "+subFile.getItems().size()+" ");
                if(subFile.getItems().size()>0){
                    displaySubLevels(subFile.getItems());
                }
            }
        }
    }



    public  List<FileExplorer> getFileOrDirectoryList(File folder, List<FileExplorer> fileList){

        File[] listOfFiles = folder.listFiles();

        for (File file : listOfFiles) {

            if(file.isDirectory()){

                FileExplorer d1 = new FileExplorer();
                d1.setId(file.getPath());
                d1.setText(file.getName());

                if(file.list().length>0)
                {
                    d1.setHasFiles(true);
                }
                else
                {
                    d1.setHasFiles(false);
                }

                File folder1 = new File(d1.getId());
                List<FileExplorer> subList = new ArrayList<FileExplorer>();
                subList = getFileOrDirectoryList(folder1, subList);
                d1.setItems(subList);
                fileList.add(d1);

            }else{
                FileExplorer f1 = new FileExplorer();
                f1.setId(file.getPath());
                f1.setText(file.getName());
                f1.setHasFiles(false);
                fileList.add(f1);
            }

        }
        return fileList;


    }

}

的hello.jsp

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 5.1">
<html>
<head>
 <title></title>

    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>    
    <link href="<c:url value="/resources/styles/kendo.common.min.css"/>"  rel="stylesheet"/>
    <link href="<c:url value="/resources/styles/kendo.default.min.css"/>"  rel="stylesheet"/>
    <script src="<c:url value="/resources/js/jquery.min.js"/>"></script>
    <script src="<c:url value="/resources/js/kendo.all.min.js"/>"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div id="example" class="k-content">
  <div id="treeview" class="demo-section"></div>


           <script>

 (function($) {

  var homogeneous = new kendo.data.HierarchicalDataSource({
                        transport: {
                            read: {
                                url: '<c:url value="/welcome/list/"/>',
                                dataType: "json"
                            }
                        },

                        schema: {
                            model: {
                                 hasChildren: "hasFiles",
                                children: "items"
                            }
                        }
                            });



                $("#treeview").kendoTreeView({
                    dataSource: homogeneous 
                   ,
                   dataTextField: "text"
                });
                 })(jQuery);
                            </script> 


        </div>

      <div>
      </div>  

</body>
</html>

我的春季控制器 HelloWorld.java

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;



@Controller
@RequestMapping("/welcome/")
public class HelloWorld {


        @RequestMapping(value = { "fileExplorer/"}, method = RequestMethod.GET )// , produces = "application/json")
    public String  readScenarioDateSetup(@ModelAttribute("userId")String userId,BindingResult result,Model model)throws Exception{

        TestJava remote=new TestJava();
        List<FileExplorer> finalList = new ArrayList<FileExplorer>();
    File folder = new File("D:/SampleFileExplorer");

    Iterable<FileExplorer> fileExp= remote.getFileExplorer(folder,finalList);
    model.addAttribute("fileExp",fileExp);
        return "hello";

    }


    @RequestMapping(value = {"/list/"}, method = RequestMethod.GET )
    public @ResponseBody Iterable<FileExplorer> readScenarioDateSetup()throws Exception{
        TestJava remote=new TestJava();
        List<FileExplorer> finalList = new ArrayList<FileExplorer>();
    File folder = new File("D:/SampleFileExplorer");

    Iterable<FileExplorer> fileExp= remote.getFileExplorer(folder,finalList);
    return fileExp;
          }
    }

部署到您的服务器后..Type url http：//：// welcome / fileExplorer /你得到了结果.. 可能有更好的方法来实现这一目标，但这就是我实现这一目标的方式。

如何加载Kendo树视图中显示的文件

1 个答案: