8

Como faço para exibir um alert() se caso a pessoa não tiver preenchido um textarea, e um alert() de que o comentário foi salvo?

JavaScript:

function saveTextAsFile() {

    var textToWrite = document.getElementById("inputTextToSave").value;

    var textFileAsBlob = new Blob([textToWrite], {
        type: 'text/plain'
    });

    var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;

    var downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = "Download File";
    if (window.webkitURL != null) {
        // Chrome allows the link to be clicked
        // without actually adding it to the DOM.
        downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
    } else {
        // Firefox requires the link to be added to the DOM
        // before it can be clicked.
        downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
        downloadLink.onclick = destroyClickedElement;
        downloadLink.style.display = "none";
        document.body.appendChild(downloadLink);

    }

    downloadLink.click();
}

function destroyClickedElement(event) {
    document.body.removeChild(event.target);
}

function loadFileAsText() {
    var fileToLoad = document.getElementById("fileToLoad").files[0];

    var fileReader = new FileReader();

    fileReader.onload = function (fileLoadedEvent) {
        var textFromFileLoaded = fileLoadedEvent.target.result;
        document.getElementById("inputTextToSave").value = textFromFileLoaded;
    };

    fileReader.readAsText(fileToLoad, "UTF-8");
}

Obs: Esse script que está salvando o comentário em documento de texto.

1
  • O id do seu textArea é inputTextToSave ? Commented 16/09/2015 às 0:09

3 Respostas 3

4

Para resolver seu problema, proponho a seguinte solução. Para o alert() de textarea vazio é bem simples e lembre-se que você precisa validar o campo com o nome do arquivo também! E o processo é o mesmo abaixo:

if(textToWrite == '') {
    alert('textarea vazia :´/');
    return;
}

Já para o alert() de quando o arquivo foi salvo, já é um pouco mais complicado, pois não temos um callback que seja chamado após o seu arquivo ser baixado. Para reolver isso, proponho usar o setTimeout(). Nele setamos um timer para que seja executado um callback conforme no exemplo abaixo:

setTimeout(function() {
  alert('arquivo baixado com sucesso!')
}, 2000);

Segue o jsfiddle.

3

Validação dos campos

Sugiro que você crie uma função para validar a submissão dos dados para controlar o preenchimento do campo texto.

validaPreenchimento(event);

No onclick do seu botão ou no onsubmit do seu formulário atribua a função validaPreenchimento(event);. Também é extremamente importante verificar se o texto não é apenas espaço em branco. Considere alterar a função saveTextAsFile() para saveTextToFile(textContent, fileName) ou alterar o nome da função, pois o que ela faz de fato não é apenas salvar texto em arquivo, é salvar o texto de um determinado campo em arquivo.

function validaPreenchimento(evt) {
    var textToWrite = document.getElementById("inputTextToSave").value;
    var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;

    // verificando tamanho da string ignorando espaços em branco nas extremidades (trim)
    if (textToWrite.replace(/^\s+|\s+$/gim, "").length == 0 ||
        fileNameToSaveAs.replace(/^\s+|\s+$/gim, "").length == 0) {
        alert("Os campos {texto} e {arquivo} são obrigatórios.");

        if (evt.preventDefault) {
            evt.preventDefault();
        }
        else {
            evt.returnValue = false; // IE
        }
    }
    else {
        saveTextAsFile();
    }
}

Gravação do arquivo

Caso o arquivo seja escrito de forma síncrona basta colocar o alert no final da função saveTextAsFile(). Como o JavaScript é bloqueante sugiro utilizar um setTimeout na chamava do saveTextAsFile() para evitar travamento da tela enquanto o arquivo é escrito.

window.setTimeout(saveTextAsFile, 100);
2

No seu método que salva você pode validar

function saveTextAsFile() {
  var textToWrite = document.getElementById("inputTextToSave").value;

  if ( textToWrite !== "" ){
      alert("Favor preencher todos campos");
      return;
  }
  var textFileAsBlob = new Blob([textToWrite], {
  type: 'text/plain'
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .