Renaming Files with Node.js

Question

I am new to node and trying to find a way to load some pdf files in an object from a directory. with an input and then rename the files based on the user input entered. I have 2 problems.

1 problem is the fs.readdirSync(directory); call is running on program start up. I need that call to be made when the page loads. second problem is I am not finding how to take the value of the input and use the fs.rename to rename the files. Or create new files if necessary. (this is going to be an internal app used locally only in a small office to rename pdf files for a specific purpose. Not a web app. Just wanted a simple UI for the staff.) index.js

var express = require('express');
var app = express();
var path = require('path');
var formidable = require('formidable');
var ejs = require('ejs');
var fs = require('fs');

// set the view engine to ejs
app.set('view engine', 'ejs');

app.use(express.static(path.join(__dirname, 'public')));

app.use('/img', express.static(__dirname + '/img'));
//fs





let directory = "img";
let dirBuf = Buffer.from(directory);

// Buffer mydata


  function bufferFile(relPath) {
    return fs.readdirSync(path.join(__dirname, relPath));
    console.log("hello from bufferFile"); // zzzz....
  }

// let files = fs.readdirSync(directory);
// console.log(files, "This is the fs.readdirSync");
let files = fs.readdirSync(directory);
console.log(files, "This is the fs.readdirSync");

//routes
app.get('/', function(req, res){
  res.sendFile(path.join(__dirname, 'views/index.html'));
});

//routes
app.get('/new', function(req, res){

// fs.readdir(specs, (err, files) => {
//   files.forEach(file => {

//   });
// })

  res.render('rename',{


        files: files,

     });

});
app.get('/rename', function(req,res){
  res.render('rename',{


       files: files,
       dirBuf: dirBuf
     });

});


app.post('/upload', function(req, res){

  // create an incoming form object
  var form = new formidable.IncomingForm();

  // specify that we want to allow the user to upload multiple files in a single request
  form.multiples = true;

  // store all uploads in the /uploads directory
  form.uploadDir = path.join(__dirname, '/img');

  // every time a file has been uploaded successfully,
  // rename it to it's orignal name
  form.on('file', function(field, file) {
    fs.rename(file.path, path.join(form.uploadDir, file.name));
  });

  // log any errors that occur
  form.on('error', function(err) {
    console.log('An error has occured: \n' + err);
  });

  // once all the files have been uploaded, send a response to the client
  form.on('end', function() {
    res.end('success');

  });

  // parse the incoming request containing the form data
  form.parse(req);

});

var server = app.listen(3000, function(){
  console.log('Server listening on port 3000');
});

rename.ejs

<!-- views/partials/head.ejs -->
 <% include ./partials/head %>





<ul>

    <% files.forEach(function(files) { %>

        <div class="col-lg-6">
        <div class="form-group">
        <h3><%= files %></h3>
        <object data='img/<%= files %>' type='application/pdf' width='100%' height='250px'></object>
        <input class="form-control" id="<%=files.name%>" value="<%=files.name%>">

        </div>
        </div>
    <% }); %>
</ul>

<button type="submit" class="btn btn-primary">Submit</button>


 <% include ./partials/footer%>
<!-- views/partials/footer.ejs -->