单击按钮时，jQuery不会响应

Question

I have this PHP jQuery File Upload system.... Folder List is generated success fully but won't create new folder of or delete when clicked on the expected. 我有此PHP jQuery File Upload系统。...文件夹列表已完全成功生成，但单击期望的文件夹时不会创建或删除新文件夹。 Below are the PHP and jQuery code. 以下是PHP和jQuery代码。

jQuery (index.php) jQuery（index.php）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>List From Directory</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  </head>
  <body>
  <br />
  <br />
  <div class="container">
    <h2 align="center">List Folders From Directory</a></h2>
    <br />
    <div align="right">
      <button type="button" name="create_folder" id="create_folder" class="btn btn-success">Create</button>
    </div>
    <div id="folder_table" class="table-responsive">

    </div>
  </div>
</body>
</html>
<div id="folderModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title"><span id="change_title">Create Folder</span></h4>
      </div>
      <div class="modal-body">
        <p>Enter Folder name
        <input type="text" name="folder_name" id="folder_name" class="form-control" /> </p>
        <br />
        <input type="hidden" name="action" id="action" />
        <input type="hidden" name="old_name" id="old_name" />
        <input type="button" name="folder_button" id="folder_button" class="btn btn-info" value="Create" />
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

<script>
$(document).ready(function(){
  load_folder_list();

  function load_folder_list()
  {
    var action = "fetch";
    $.ajax({
      url : "action.php",
      method:"POST",
      data:{action:action},
      success:function(data)
      {
        $('#folder_table').html(data);
      }
    })
  }
  $(document).on('click', '#create_folder', function(){
    $('#action').val('create');
    $('#folder_name').val('');
    $('#folder_button').val('Create');
    $('#old_name').val('');
    $('#change_title').text('create Folder');
    $('#folderModal').modal('show');
  });


  $(documnet).on('click', '#folder_button', function(){
    var folder_name = $('#folder_name').val();
    var action = $('#action').val();
    var old_name = $('#old_name').val();
    if(folder_name != '')
    {
      $.ajax({
        url : "action.php",
        method:"POST",
        data:{folder_name:folder_name,old_name:old_name, action:action},
        success:function(data)
        {
          $('#folderModal').modal('hide');
          load_folder_list();
          alert(data);
        }
      });
    }
    else
    {
      alert("Enter Folder Name");
    }
  });
  $(document).on('click', '.update', function(){
    var folder_name = $(this).data("name");
    $('#old_name').val(foldername);
    $('#folder_name').val(folder_name);
    $('#action').val("change");
    $('#folder_button').val('Update');
    $('#change_title').text("Change Folder Name");
    $('#folderModal').modal("show");
  });
});
</script>

The action.php File, though the system is not completed, did everything that was done in the video, but it won't just create or give error notifications. 尽管系统尚未完成，但action.php文件却完成了视频中所做的所有操作，但它不仅会创建或发出错误通知。

<?php
//action.php
if(isset($_POST["action"]))
{
  if($_POST["action"] =="fetch")
  {
    $folder = array_filter(glob('*'), 'is_dir');
    $output = '
    <table class="table table-bordered table-striped">
      <tr>
        <th>MPO Number</th>
        <th>No. of Attachment</th>
        <th>Update</th>
        <th>Delete</th>
        <th>Upload File</th>
        <th>View Uploaded File</th>
      </tr>
    ';

    if(count($folder) > 0)
    {
      foreach($folder as $name)
      {
        $output .= '
          <tr>
            <td>'.$name.'</td>
            <td>'.(count(scandir($name)) - 2).'</td>
            <td><button type="button" name="update" data-name="'.$name.'" class="update btn btn-warning btn-xs">Update</button></td>
            <td><button type="button" name="delete" data-name="'.$name.'" class="delete btn btn-danger btn-xs">Delete</button></td>
            <td><button type="button" name="upload" data-name="'.$name.'" class="upload btn btn-info btn-xs">Upload File</button></td>
          <td><button type="button" name="view-files" data-name="'.$name.'" class="view_files btn btn-default btn-xs">View Files</button></td>
          </tr>
        ';
        }
    }
    else
    {
      $output .= '
      <tr>
      <td colspan="6">No Folder Found</td>
      </tr>
      ';
    }
    $output .='</table>';
    echo $output;

  }
  if($_POST["action"] == "create")
  {
    if(!file_exists($_POST["folder_name"]))
    {
      mkdir($_POST["folder_name"], 0777, true);
      echo 'Folder Create';
    }
    else
    {
      echo 'Folder Already Created';
    }
  }
  if($_POST["action"] =="change")
  {
    if(!file_exists($_POST["folder_name"]))
    {
      rename($_POST["old_name"], $_POST["folder_name"]);
      echo 'Folder Name Change';
    }
    else
    {
      echo 'Folder Already Cready Created';
    }
  }
}
?>

Answer 1

Once everything is cleaned up a bit, fixing some typos: $(documnet) & $('#old_name').val(foldername); 清理完所有内容后，修正一些拼写错误： $(documnet) ＆ $('#old_name').val(foldername); (should be folder_name ), I have created this snippet of your code. （应为folder_name ），我已经创建了您的代码段。 It appears to work overall, except the AJAX elements. 除了AJAX元素外，它似乎可以整体工作。 I can click the Create button and see the new dialog. 我可以单击“创建”按钮，然后看到新对话框。

 $(function() { function load_folder_list() { var action = "fetch"; $.ajax({ url: "action.php", method: "POST", data: { action: action }, success: function(data) { $('#folder_table').html(data); } }); } $(document).on('click', '#create_folder', function() { $('#action').val('create'); $('#folder_name').val(''); $('#folder_button').val('Create'); $('#old_name').val(''); $('#change_title').text('create Folder'); $('#folderModal').modal('show'); }); $(document).on('click', '#folder_button', function() { var folder_name = $('#folder_name').val(); var action = $('#action').val(); var old_name = $('#old_name').val(); if (folder_name != '') { $.ajax({ url: "action.php", method: "POST", data: { folder_name: folder_name, old_name: old_name, action: action }, success: function(data) { $('#folderModal').modal('hide'); load_folder_list(); alert(data); } }); } else { alert("Enter Folder Name"); } }); $(document).on('click', '.update', function() { var folder_name = $(this).data("name"); $('#old_name').val(folder_name); $('#folder_name').val(folder_name); $('#action').val("change"); $('#folder_button').val('Update'); $('#change_title').text("Change Folder Name"); $('#folderModal').modal("show"); }); load_folder_list(); });

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <br /> <br /> <div class="container"> <h2 align="center">List Folders From Directory</a> </h2> <br /> <div align="right"> <button type="button" name="create_folder" id="create_folder" class="btn btn-success">Create</button> </div> <div id="folder_table" class="table-responsive"> </div> </div> <div id="folderModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title"><span id="change_title">Create Folder</span></h4> </div> <div class="modal-body"> <p>Enter Folder name <input type="text" name="folder_name" id="folder_name" class="form-control" /> </p> <br /> <input type="hidden" name="action" id="action" /> <input type="hidden" name="old_name" id="old_name" /> <input type="button" name="folder_button" id="folder_button" class="btn btn-info" value="Create" /> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div>

Hope that helps. 希望能有所帮助。

单击按钮时，jQuery不会响应

问题描述

1 个解决方案

解决方案1
0 2018-12-03 17:50:23

单击按钮时，jQuery不会响应

问题描述

1 个解决方案

解决方案1 0 2018-12-03 17:50:23

解决方案1
0 2018-12-03 17:50:23