列出asp.net mvc中文件夹中的文件

Question

I want to list all the files in folder once page loading . so

For that I just created like this

HTML code

<input id="idd" type="file" multiple="true" class="file" data-preview-file-type="text">

Script

@section scripts{   

 <script type="text/javascript">    

  $(document).ready(function () {
        $.ajax({
            url: '/Home/filesinfolder',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                $.each(data, function (index, val) {
                    $('#idd').append('<li><a href="http://'+ val.Url +'" target="_new">' + val.Url + '</a></li>');
                });
            },
            error: function (xhr, status, err) {
                console.log('Response code:' + xhr.status);
                console.log('[Error:' + err + '] ' + status);
            }
        });
    });

</script>

Controller method

    public JsonResult filesinfolder()
    {
        DirectoryInfo salesFTPDirectory = null;
        FileInfo[] files = null;

        string salesFTPPath = "C:/filePath";

        salesFTPDirectory = new DirectoryInfo(salesFTPPath);
        files = salesFTPDirectory.GetFiles();

        files = files.OrderBy(f => f.Name).ToArray();

        var salesFiles = files.Where(f => f.Extension == ".xls" || f.Extension == ".xml" || f.Extension == ".jps" || f.Extension == ".jpg" || f.Extension == ".jpeg" || f.Extension == ".png");

        return Json(salesFiles.ToList());
    }

But this is isn't list down anything at all , but once I debug I can see this filesinfolder method calling and finding files in folder.

Answer 1

You have a number of errors

1. The element with id="idd" is an <input> and you cannot append <li> elements to an <input> (only a <ul> element)
2. Your ajax call is making a GET call, but your have not included JsonRequestBehavior.AllowGet so nothing will be returned
3. Your attempting returning List<FileInfo> but accessing the Url property which dos not exist.
4. Even if you were to access the (say) FullName property, creating <a href="http://C:/filePath.someFileName.xls would not navigate to the file on the server

Since it appears you only want the name of the file, then your code should be

Html

<ul id="filelist"></ul>

Script

$(document).ready(function () {
$.ajax({
  url: '@Url.Action("filesinfolder", "Home")', // don't hardcode
  dataType: "json",
  success: function (data) {
    $.each(data, function (index, item) {
      $('#filelist').append($('<li></li>').text(item));
    });
  },
   error: function () {

  }
   });
 });

Note the contentType option is not required

Controller

public JsonResult filesinfolder()
{
    string salesFTPPath = "C:/filePath";
    DirectoryInfo salesFTPDirectory = new DirectoryInfo(salesFTPPath);
    IEnumerable<string> files = salesFTPDirectory.GetFiles()
      .Where(f => f.Extension == ".xls" || f.Extension == ".xml" || f.Extension == ".jps" || f.Extension == ".jpg" || f.Extension == ".jpeg" || f.Extension == ".png")
      .OrderBy(f => f.Name)
      .Select(f => f.FullName);
    return Json(files, JsonRequestBehavior.AllowGet);
}

Answer 2

If you're using GET request then you need to explicitly allow get requests on JSON results.

  public JsonResult filesinfolder()
    {
        DirectoryInfo salesFTPDirectory = null;
        FileInfo[] files = null;

        string salesFTPPath = "C:/filePath";

        salesFTPDirectory = new DirectoryInfo(salesFTPPath);
        files = salesFTPDirectory.GetFiles();

        files = files.OrderBy(f => f.Name).ToArray();

        var salesFiles = files.Where(f => f.Extension == ".xls" || f.Extension == ".xml" || f.Extension == ".jps" || f.Extension == ".jpg" || f.Extension == ".jpeg" || f.Extension == ".png");

        return Json(salesFiles.ToList(), JsonRequestBehavior.AllowGet);
    }

Also, consider returning just the data you need to your view. The FileInfo object is complex and might not be easily serialized.

Hope this helps