Как правильно отладить xmlhttprequest и отправить все поля, включая отправку, без jquery? - PullRequest
Новая
       81

Как правильно отладить xmlhttprequest и отправить все поля, включая отправку, без jquery?

0 голосов
/ 21 июня 2020

Я пытаюсь отправить скрытый, текстовый, выделенный, невидимый recaptchaV2 и поля отправки через xmlhttprequest и formdata, но объект formdata просто получает скрытые, текстовые и выбранные поля. Также я не уверен, отправлены ли данные, потому что запрос зависает в состоянии 1 (загрузка, но ответа нет). Как я могу проверить, отправлено ли что-нибудь? Как recaptcha и submit должны быть помещены в элемент formdata?

HTML: 

<form  method="post" onsubmit="xmlhttp(this);">

<div class="container w3-margin">
    <div class="fields">
        <input type="hidden" name="request" value="req_val">

        <label for="pattern">Pattern</label>
        <input type="text" id="pattern" name="pattern" maxlength="40" required>

        <select class="w3-select" name="level" required>
            <option value="" disabled selected>Choose the level</option>
            <option value="4">4</option>
            <option value="3">3</option>
            <option value="2">2</option>
            <option value="1">1</option>
        </select>

        <div class="g-recaptcha"
            data-sitekey="the_site_key"
            data-callback="onSubmit"
            data-size="invisible">
        </div>
    </div>

    <div style="padding-top: 16px;">
        <button id="btn" type="submit" name="submit" value="Submit" class="w3-button w3-white w3-text-grey w3-border" disabled>
            Submit
        </button>
            &nbsp;  &nbsp;  &nbsp;
        <button type="button" class="w3-button w3-white w3-text-grey w3-border">
            Cancel
        </button>
    </div>
</div>
</form>

JS: 

function xmlhttp(formElement) {
        action = formElement.elements["request"].value + '.php';
        var data = new FormData(formElement);

        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                console.log(this.responseText);
                console.log('finish');
            }
            else {
                console.log('loading');
                for (var pair of data.entries()) {
                    console.log(pair[0]+ ', ' + pair[1]);
                }
            }
        };
        xhttp.open(formElement.method, action, true);
        xhttp.send(data);
    }

req_val. php : 

echo var_dump($_POST);

редактировать: опечатка

...