считать количество слов с ошибками - PullRequest
Новая
       34

считать количество слов с ошибками

0 голосов
/ 18 февраля 2020

У меня есть проект, в котором мне нужно подсчитать количество слов с ошибками в текстовой области и предотвратить отправку веб-формы, если слишком много орфографических ошибок. Для ввода формы используется редактор JavaScript, tinyMCE. Скрипт PHP spellcheckText. php подсчитывает орфографические ошибки, если таковые имеются, и возвращает закодированный JSON результат обратно в брови. Пример кода ниже: 

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        function checkWordCount(){
            var wordCount = tinyMCE.activeEditor.plugins["wordcount"].getCount();
            if (wordCount < 50) {
                alert("Need 50 words or greater for your text submission...");
                return false;
            }
            jQuery(function($) {
                var textData = $("#Text").val();
                $.ajax({
                    type: "POST",
                    url: "/path/to/scripts/ajax/spellcheckText.php",
                    data: textData,
                    success: (function (response) {
                        let percentage = response.percentage;
                        if (percentage < 80){
                            alert("A number of misspelled words were detected. Please correct and submit again.");
                            return false;
                        }
                    })
                });
            })
        }
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="form-group">
        <form method=POST action="/path/to/scripts/ajax/processText.php" name="textform" id="textQuestion">
            <h3>$thesequestions{'theQuestionText'}</h3>
            <p>
                <textarea name="textarea" class="standard-editor" id="Text"></textarea>
            </p>
            <br/>
            <input class="btn btn-primary" type="submit" onclick="return checkWordCount()" value="Submit Text"/>
        </form>
    </div>
</div>
</body>
</html>

Я не часто занимаюсь внешним интерфейсом, поэтому не знаю, является ли попытка публикации дважды в одной и той же форме проблемой или чем-то еще. Результатом этого примера является пустая страница, на которой выполняется действие публикации формы. Не верьте, что секция jQuery выполнена.

Открыты для предложений по лучшему методу.

Спасибо.

Ниже приведена редакция оригинальный код post : 

```<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <link rel="stylesheet" src="/simages/css/bootstrap/3.3.7/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="/simages/scripts/js/tinymce/js/tinymce/tinymce.min.js"></script>
    <script>
        tinymce.init({
            selector: ".standard-editor",
            plugins: "wordcount spellchecker",
            paste_as_text: false,
            theme: "modern",
            branding: false,
            content_style: ".mce-content-body {font-size:16px;font-family:Arial,sans-serif;}",
            browser_spellcheck: true,
            toolbar: "undo redo",
            spellchecker_rpc_url: '/simages/spellchecker/spellchecker.php',
            menubar: "tools",
            statusbar: true,
            height: "400",
            width: "600",
            paste_data_images: false,
            paste_enable_default_filters: false,
            paste_preprocess: function(plugin, args) {
                args.content = '';
            }

        });
    </script>
    <script type="text/javascript">
        function checkWordCount() {
            var wordCount = tinyMCE.activeEditor.plugins["wordcount"].getCount();
            if (wordCount < 50) {
                alert("Need 50 words or greater for your text submission...");
                return false;
            }
            var essayContent = tinyMCE.activeEditor.getContent({format: 'text'});
            function getSpellCount(essayContent){
                return new Promise((resolve,reject) => {
                    jQuery(function($) {
                        var values = { 'str': essayContent };
                        console.log(values);
                        $.ajax({
                            type: "POST",
                            url: "/path/to/ajax/spellcheckText.php",
                            data: values,
                            success: resolve,
                            error: reject,
                        })
                    });
                })
            }
            var percentage = getSpellCount(essayContent);
            percentage.then(function(result){
                console.log(result);
                var grade = result.percentage;
                if(grade < 80){
                    alert("A number of misspelled words were detected. Please correct and submit again.");
                    return false;
                }
            }).catch(function (error) {
                console.log('Failed',error);
            });
        }
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="form-group">
        <form method=POST action="/path/to/ajax/textWords.php" name="essayform" id="essayQuestion" onsubmit="event.preventDefault();checkWordCount();">
            <h3>$thesequestions{'theQuestionText'}</h3>
            <p>
                <textarea name="textarea" class="standard-editor" id="essay"></textarea>
            </p>
            <br/>
            <input class="btn btn-primary" type="submit" value="Submit Text"/>
        </form>
    </div>
</div>
</body>
</html>```

Исправленный JavaScript теперь правильно считывает содержимое из текстовой области из метода getContent () tinyMCE. Также теперь передайте текст для проверки орфографии в программу проверки орфографии, и я могу прочитать и обработать процент ошибок в тексте в браузере.

Единственная проблема в настоящее время заключается в том, что мне не удалось добраться до второго поста, где текстовая область записана в базе данных. Не уверен, что event.PreventDefault () в onsubmit правильно размещен. Будем весьма благодарны за любые дополнительные советы.

...