如何通過 AJAX 中的 POST 請求從 Django 表單發送特定數據？

Question

所以我目前正在處理 Django 項目，該項目包含兩個提交按鈕。 表單包含 3 個字段（聯系電話、聯系人姓名、消息）和兩個按鈕（搜索、發送）。 單擊發送按鈕后，我只想發送帶有 ajax 發布請求的contact_number 字段和消息字段。 但它使用 ajax 請求發送所有字段。 您能幫我如何使用 ajax 發布請求發送特定字段數據嗎？

形成圖像

ajax 腳本，而 ajax 請求我只在數據中添加 3 個字段，但我在我的帖子請求中獲得了所有字段。

var KTLoginGeneral = function () {

    // var success= $('#success');
    // var error = $('#fail');
    var handleSignInFormSubmit = function () {
            $('#send_msg_submit').click(function (e) {
                e.preventDefault();
                var btn = $(this);
                var form = $(this).closest('form');
                console.log("send submit");
                form.validate({
                    rules: {
                        number: {
                            required: true,
                        },
                        message: {
                            required: true
                        }
                    }
                });
                if (!form.valid()) {
                    return;
                }
                btn.addClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', true);
                form.ajaxSubmit({
                    type: 'POST',
                    url: 'msg/single',
                    data: {
                        number: $('#number').val(),
                         message: $('#message').val(),
                        csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()
                    },
                    success: function (response, status, xhr, $form) {
                        // similate 2s dela
                        console.log(response);
                        var result = response['success'];

                        if (result) {
                            btn.removeClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', false);
                            error.hide();
                            success.show();
                            success.text(response['error_msg']);
                            $('#message_form').resetForm();
                        } else {
                            console.log("else error");
                            success.hide();
                            error.show();
                            error.text(response['error_msg']);
                            setTimeout(function () {
                                btn.removeClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', false);
                            }, 2000);
                        }
                    },
                    error(response, e) {
                        btn.removeClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', false);
                        console.log("error");
                        success.hide();
                        error.show();
                    }
                });
            });

            $('#search').click(function (e) {
                e.preventDefault();
                var btn = $('#search');
                var form = $(this).closest('form');
                var search_name = $('#search_name');

                form.validate({
                    rules: {
                        search_name: {
                            required: true,
                        },
                    }
                });
                if (!form.valid()) {
                    return;
                }
                btn.addClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', true);
                form.ajaxSubmit({
                    type: 'POST',
                    url: 'msg/single',
                    data: {
                        search_name: search_name.val(),
                        csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()
                    },
                    success: function (response, status, xhr, $form) {
                        console.log(response);
                        var result = response['success'];

                        if (result) {
                            btn.removeClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', false);
                             $('#kt_modal_1').on('show.bs.modal', function (event) {
                                  var button = $(event.relatedTarget);// Button that triggered the modal
                                  var recipient = button.data('whatever');// Extract info from data-* attributes
                                  var modal = $(this);
                                  modal.find('.modal-title').text('Search Result');
                                  modal.find('.modal-body input').val(recipient)

                                });
                        } else {
                            console.log("else error");
                            success.hide();
                            error.show();
                            error.text(response['error_msg']);
                            setTimeout(function () {
                                btn.removeClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', false);
                            }, 2000);
                        }
                    },
                    error(response, e) {
                        console.log("error");
                        success.hide();
                        error.show();
                        btn.removeClass('kt-spinner kt-spinner--right kt-spinner--sm kt-spinner--light').attr('disabled', false);
                    }
                });
            });
 };

    // Public Functions
    return {
        // public functions
        init: function () {
            handleSignInFormSubmit();
        }
    };
}();
// Class Initialization
jQuery(document).ready(function () {
    KTLoginGeneral.init();
});

但是當我在我的視圖中打印發布請求時，它包含所有數據

<QueryDict: {'csrfmiddlewaretoken': ['EvwkSZPrJYPTHDqKKG0jpfGq98FjIGsM6P83BQ9MGDOxvf0psum1VBZ3IU71XRwh'], 'number': ['8264056065'], 'search_name': [''], 'message': ['hello']}>

預計 output

<QueryDict {'csrfmiddlewaretoken': ['EvwkSZPrJYPTHDqKKG0jpfGq98FjIGsM6P83BQ9MGDOxvf0psum1VBZ3IU71XRwh'], 'number': ['8264056065'], 'message': ['hello']}>

但我的帖子請求中不需要 search_name。

Answer 1

request.POST 用於表單編碼的內容。 對於 JSON，您應該直接訪問普通正文：

json_object = json.loads(request.body)`