Как отправить поле ввода формы в формат JSON с помощью Jquery Ajax - PullRequest
Новая
       27

Как отправить поле ввода формы в формат JSON с помощью Jquery Ajax

1 голос
/ 11 октября 2019

Я хочу отправить данные на контроллер в формате JSON . но попасть в строку. так я могу это сделать? Я использовал заголовок, который передается при вызове ajax, но он не преобразовывает заполненную форму в формат JSON . из-за формата строки Laravel не удалось обработать этот ответ.

Мой ответ браузера. enter image description here

HTML-код 

       <form id="NoeticeBoardGetAllFrm"  name="NoeticeBoardGetAllFrm" role="form" method="post" >
                <div class="row">
                    <div class="col-sm-6">
                        <label> URL </label>
                        <input type="text" name="NoeticeBoardGetAllUrl" id="NoeticeBoardGetAllUrl"
                               class="form-control"   placeholder="URL"
                               value="https://XXXXXXXXXXXX/get-all-notice-board-information"/>
                    </div>

                    <div class="col-sm-4">
                        <label> Session Code </label>
                        <input type="text" name="scode" id="scode" class="form-control"
                               value="cFZnMVJUY0JNUUJsTXZBeVZhZmRHZz09"
                                maxlength="50" minlength="32" placeholder="Session Code"/>
                    </div>
                </div>
                <br>
                <div class="row">
                    <div class="col-sm-2">
                        <input type="submit" name="NoeticeBoardGetAllBtn" id="NoeticeBoardGetAllBtn"
                               class="btn btn-danger "   value="Get Result"  />
                    </div>
                    <div class="col-sm-3"> <i class="fa fa-reddit-square"></i>
                        <span class="inLine">Result :</span>
                        <div id="NoeticeBoardGetAllResult" class="inLine result_box">---</div>
                    </div>
                </div>
            </form>

Мой код JavaScript 

   $("#NoeticeBoardGetAllFrm").submit(function(e) {
        e.preventDefault();

        console.log( new FormData(this));
        $.ajax({
            url: $("#NoeticeBoardGetAllUrl").val(),
            type: 'POST',
              headers: {'Accept': 'application/json','Content-Type': 'application/json',
                'DBAuth': $("#DBAuth").val(),'Authorization': $("#Authorization").val(),},
            dataType: 'json',
            data: new FormData(this),
            cache: false,
            contentType: false,
            processData: false,
            success: function (data) {
                if (data.error == 0) {
                    $("#NoeticeBoardGetAllResult").html("Record fetched successfully!");
                    $("#NoeticeBoardGetAllResult").addClass("alert alert-success");

                } else {
                    $("#NoeticeBoardGetAllResult").html(data.errmsg);
                    $("#NoeticeBoardGetAllResult").addClass("alert alert-warning");
                }
            }, statusCode: {
                500: function (data) {
                    $("#NoeticeBoardGetAllResult").html("Something went wrong!");
                    $("#NoeticeBoardGetAllResult").addClass("alert alert-danger");
                },
                401: function (data) {
                    $("#NoeticeBoardGetAllResult").html("Login Failed");
                    $("#NoeticeBoardGetAllResult").addClass("alert alert-danger");
                }
            }
        });
        setTimeout(function(){ resetResult(); }, 3000);
    });

Ответы [ 2 ]

0 голосов
/ 11 октября 2019

вместо data: new FormData(this);

используйте следующее 

data: $(this).serializeArray();

Получает данные вашей формы и сериализуется в массив, готовый для преобразования в JSON.

0 голосов
/ 11 октября 2019

Вы можете использовать serialize метод для отправки данных в виде Json 

$('#NoeticeBoardGetAllFrm').serialize()

Вы должны использовать это вместо 

data: new FormData(this),
...