How to update local json data through javascript on submit

To perform update on a JSON file you will need a backend or some third party product that act like backend eg. Firebase.

If we talking just locally (changes persist on page refresh) what you can is:

<div id="myModal" class="modal">
  <!-- Add movie Modal content -->
  <div class="modal-content">
    <span class="close" onclick="closeModal()">&times;</span>
    <form name="submitmovie" onsubmit="addMov()">
      <label>Enter Movie Name</label>
      <input type="text" name="movie-name" id="mnane" placeholder="enter movie name">
      <label>Year</label>
      <input type="number" name="movie-year" id="myear" placeholder="movie-year">
      <label>Poster Url</label>
      <input type="url" name="movie-poster" id="mposter" placeholder="movie-poster-url">
      <button class="addMovie" type="submit">Submit</button>
    </form>
  </div>
</div>

<script type="text/javascript">
  // persist mechanics
  // on app load try to load data from localStorage
  const movieList = localStorage.getItem('movieList');
  // if it's there assign it to moveList, else leave it as is (with json data)
  if (movieListLocalStorage) {
    movieListLocalStorage = JSON.parse(movieListLocalStorage);
  }
  function addMov() {
    var name = document.getElementById("mnane").value;
    var year = document.getElementById("myear").value;
    var url = document.getElementById("mposter").value;
    console.log(name, year, url);
    // add();
    movieList.push({
      "name": name,
      "year": year,
      "url": url
    });
    // since you are using movieList i am assuming it has predefined json data assigned
    // persist updated data within localStorage
    localStorage.setItem('movieList', JSON.stringify(movieList))

    // pass updated data to render function
    renderMovieCards(movieList);
  }
</script>