Почему jQuery возвращает два атрибута?

Question

[zitSuccess]

При сабмите формы аякс запросом jQuery отправляет на бек два значения в переменных _postid и _parentid: само значение и undefinded.
Как отправлять только значение, без undefinded(None) на бек?

html:

<a class="text-decoration-none" data-bs-toggle="collapse" href="#collapseExample{{node.id}}" role="button" aria-expanded="false" aria-controls="collapseExample">Ответить</a> <br>
                        <div class="collapse comment-form" id="collapseExample{{node.id}}">
                            <form class="comment-form" id="comment-form-{{ node.id }}" data-id="{{ post.id }}" data-reply-id="{{ node.id }}">
                                <textarea class="form-control" rows="2" cols="40" placeholder="Комментарий" id="comment-text{{ post.id }}" name="comment_content"></textarea>
                                <button class="btn btn-dark btn-sm mt-1" type="submit">Ответить</button>
                            </form>
                        </div>

js:

$('.comment-form').submit(function(e) {
    e.preventDefault();

    data = $(this).serializeArray()
    var _postid = $(this).attr('data-id');
    var _comment = $(this).find('.form-control').val();
    var _nodeid = $(this).attr('data-nodeid');
    var _parentid = $(this).attr('data-reply-id')


    $.ajax({
        type: "POST",
        url: "{% url 'comment_post' %}",
        data: {'post_id': _postid, 'content': _comment, 'parent_id': _parentid, 'csrfmiddlewaretoken': '{{ csrf_token }}'},
        success: function(response) {
            $('.form-comment-'+_postid).val('');

            const options = {
                year: 'numeric',
                month: 'short',
                day: 'numeric',
                hour12: true,
                hour: 'numeric',
                minute: '2-digit'
            };
            let currentdate = new Date().toLocaleString('en-US', options)
            var _html =
                `<li>
                    {{ request.user }} <small class="text-muted">${currentdate}</small><br>
                    ${_comment}<br>
                    <a class="text-decoration-none" data-bs-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">Ответить</a> <br>
                    <div class="collapse comment-form" id="collapseExample${_nodeid}">
                        <form class="comment-form" id="comment-form-{{ node.id }}" data-id="{{ post.id }}" data-reply-id="{{ node.id }}">
                            <textarea class="form-control" rows="2" cols="40" placeholder="Комментарий" id="comment-text{{ post.id }}" name="comment_content"></textarea>
                            <button class="btn btn-dark btn-sm mt-1" type="submit">Ответить</button>
                        </form>
                    </div>
                </li>
                ${_postid}
                `
            $(".comment-node-post"+_postid).prepend(_html);
        }
    });
})

Answer 1

[defriz]

можно просто тогда отправлять пустую строку, если значение undefined.

$('.comment-form').submit(function(e) {
    e.preventDefault();

    data = $(this).serializeArray()
    var _postid = $(this).attr('data-id');
    var _comment = $(this).find('.form-control').val();
    var _nodeid = $(this).attr('data-nodeid');
    var _parentid = $(this).attr('data-reply-id')


    $.ajax({
        type: "POST",
        url: "{% url 'comment_post' %}",
        data: {'post_id': _postid, 'content': _comment, 'parent_id': _parentid || '', 'csrfmiddlewaretoken': '{{ csrf_token }}'},
        success: function(response) {
            $('.form-comment-'+_postid).val('');

            const options = {
                year: 'numeric',
                month: 'short',
                day: 'numeric',
                hour12: true,
                hour: 'numeric',
                minute: '2-digit'
            };
            let currentdate = new Date().toLocaleString('en-US', options)
            var _html =
                `<li>
                    {{ request.user }} <small class="text-muted">${currentdate}</small><br>
                    ${_comment}<br>
                    <a class="text-decoration-none" data-bs-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">Ответить</a> <br>
                    <div class="collapse comment-form" id="collapseExample${_nodeid}">
                        <form class="comment-form" id="comment-form-{{ node.id }}" data-id="{{ post.id }}" data-reply-id="{{ node.id }}">
                            <textarea class="form-control" rows="2" cols="40" placeholder="Комментарий" id="comment-text{{ post.id }}" name="comment_content"></textarea>
                            <button class="btn btn-dark btn-sm mt-1" type="submit">Ответить</button>
                        </form>
                    </div>
                </li>
                ${_postid}
                `
            $(".comment-node-post"+_postid).prepend(_html);
        }
    });
})