Как получить эти текстовые поля для загрузки в текстовый файл при нажатии кнопки? - PullRequest
0 голосов
/ 02 июня 2018

Как получить эти текстовые поля (имя пользователя и пароль) для загрузки в текстовый файл при нажатии кнопки?(это 'только для начального школьного проекта).Я знаю, что это не нормальная практика, но мне просто нужно продемонстрировать внешний конечный продукт.

Мой код ....

<h3>Login</h3>
      <form name="sentMessage" id="contactForm" novalidate>
        <div class="control-group form-group">
          <div class="controls">
            <label>Username:</label>
            <input type="text" class="form-control" id="name">
            <p class="help-block"></p>
          </div>
        </div>
        <div class="control-group form-group">
          <div class="controls">
            <label>Password:</label>
            <input type="password" class="form-control" id="password"     required data-validation-required-message="Incorrect username or password.">
          </div>
        </div>

        <div id="success"></div>
        <!-- For success/fail messages -->
        <button type="submit" class="btn btn-primary"    id="sendMessageButton">Login</button>
      </form>
    </div>

Это код из примера, который делает то, что я хочу, но я не могу применить код, чтобы заставить мою форму работать ....

 <!DOCTYPE html>
   <html>
   <head>
   <style>
   form * {
     display: block;
     margin: 10px;
   }
   </style>
   <script language="Javascript" >
   function download(filename, text) {
     var pom = document.createElement('a');
     pom.setAttribute('href', 'data:text/plain;charset=utf-8,' + 

   encodeURIComponent(text));
     pom.setAttribute('download', filename);

     pom.style.display = 'none';
     document.body.appendChild(pom);

     pom.click();

     document.body.removeChild(pom);
   }
   </script>
   </head>
   <body>

   <form onsubmit="download(this['name'].value, this['text'].value)">
     <input type="text" name="name" value="test.txt">
     <textarea rows=1 cols=25 name="text"></textarea>
   <input type="radio" name="radio" value="Option 1" onclick="getElementById      ('problem').value=this.value;"> Option 1<br>
   <input type="radio" name="radio" value="Option 2" onclick="getElementById      ('problem').value=this.value;"> Option 2<br>
   <form onsubmit="download(this['name'].value, this['text'].value)">
   <input type="text" name="problem" id="problem">
     <input type="submit" value="SAVE">
   </form>
   </body>
   </html>

1 Ответ

0 голосов
/ 02 июня 2018

Пример кода для генерации и загрузки текстового файла с использованием js -

function download(filename, text) {
  var element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
  element.setAttribute('download', filename);

  element.style.display = 'none';
  document.body.appendChild(element);

  element.click();

  document.body.removeChild(element);
}
<!DOCTYPE html>
<html>

<head>
  <style>
    form * {
      display: block;
      margin: 10px;
    }
  </style>
</head>

<body>

  <form onsubmit="download(this['name'].value, this['text'].value)">
    <input type="text" name="name" value="test.txt">
    <textarea rows=1 cols=25 name="text"></textarea>
    <input type="submit" value="SAVE">
  </form>
</body>

</html>

Ссылка для кода

Над кодом будет загружен файл с именем, записанным в первом поле text, и данные файласо второй textarea коробки

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...