Форма не будет отправлена ​​с помощью jquery Форма отправки, когда некоторые поля отключены

Question

Я отправляю форму через jquery форму отправки. просто так пример Тем не менее, я дал пользователю возможность отключить некоторые поля в форме. Я использую следующий код jquery для этого:

   $('#onlyTwo').click(function(){
        var stuff = $("#textarea3,  #textarea4, #radio3, #radio4, #onlyThree");
        if($(this).is(":checked"))
            stuff.attr("disabled", true);
        else {
            stuff.removeAttr("disabled");
        }
    });

в основном, только два - это флажок. при переключении некоторые поля отключены.

Форма не отправляется, когда некоторые поля отключены. В форме есть 8 полей, и каждый раз, когда я нажимаю «Отправить», они ожидают, что эти 8 полей не зависят ни от чего.

кто-нибудь сталкивался с этим раньше?

Полный код: код для отправки формы ajax

    var options = {
        target:        '#output1',   // target element(s) to be updated with server response
        beforeSubmit:  showRequest,  // pre-submit callback
        success:       showResponse  // post-submit callback
    };


    // bind form using 'ajaxForm'
        $('#addQuestionForm').ajaxForm(options);
function showRequest(formData, jqForm, options) {
    var queryString = $.param(formData);
    alert('data: ' + formData);
    return true;
}

// post-submit callback
function showResponse(responseText, statusText)  {
    $('#output1').slideDown(100);
    $('#output1').fadeOut(3500);
    $('#question').val('');
    $('#textarea1').val('');
    $('#textarea2').val('');
    $('#textarea3').val('');
    $('#textarea4').val('');
    $('#question').val('');
    $('input[name="correctAnswer"]').attr('checked', false);
}

код для отключения полей:

    $('#onlyTwo').click(function(){
        var stuff = $("#textarea3,  #textarea4, #radio3, #radio4, #onlyThree");
        if($(this).is(":checked"))
            stuff.attr("disabled", true);
        else {
            stuff.removeAttr("disabled");
        }
    });

    $('#onlyThree').click(function(){
        var stuff = $("#textarea4, #radio4, #onlyTwo");
        if($(this).is(":checked"))
            stuff.attr("disabled", true);
        else {
            stuff.removeAttr("disabled");
        }
    });

код для моей формы:

            <s:form id="addQuestionForm" action="addQuestion" namespace="/securityExam" method="post">
                <table border="0">
                        <td>Question For</td>
                        <td>
                            <select name="questionsType" id="questionsType">
                                <option selected="selected" value="U">Users</option>
                                <option value="C">Co-ordinators</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>Question</td>
                        <td><textarea id="question" name="question" rows="3" cols="35"></textarea>
                        </td>
                    </tr>
                    <tr>
                        <td>Option 1</td>
                        <td><textarea  id="textarea1" name="option1" rows="3" cols="35"></textarea></td>
                    </tr>
                    <tr>
                        <td>Option 2</td>
                        <td><textarea  id="textarea2" name="option2" rows="3" cols="35"></textarea></td>
                    </tr>
                    <tr>
                        <td>Option 3</td>
                        <td><textarea id="textarea3" name="option3" rows="3" cols="35"></textarea></td>
                        <td><input id="onlyTwo" type="checkbox">Only two options</input></td>
                    </tr>
                    <tr>
                        <td>Option 4</td>
                        <td><textarea id="textarea4" name="option4" rows="3" cols="35"></textarea></td>
                        <td><input id="onlyThree" type="checkbox">Only three options</input></td>
                    </tr>
                    <tr>
                        <td>Correct Option</td>
                        <td>
                            <input id="radio1" type="radio" name="correctAnswer" value="1">1</input>
                            <input id="radio2" type="radio" name="correctAnswer" value="2">2</input>
                            <input id="radio3" type="radio" name="correctAnswer" value="3">3</input>
                            <input id="radio4" type="radio" name="correctAnswer" value="4">4</input>
                        </td>
                    </tr>
                    </tbody>
                </table>
                <br><br>
                 <s:submit name="Submit"/>
            </s:form>

Answer 1

Согласно W3C отключенные поля формы не могут быть отправлены, потому что они не являются «успешными». По сути, они не подходят для поездки, когда ваша форма отправлена ​​в соответствии с дизайном.

Вы можете попытаться привязать функцию к событию отправки формы, чтобы повторно включить все эти отключенные блоки и сделать их "успешными" и отправленными (и установить для них разумное значение по умолчанию, чтобы вы знали, что ваш пользователь отключил их и не оставляйте их пустыми и т. д.).

[ РЕДАКТИРОВАТЬ: Это было основано на оригинальном сообщении до того, как OP сделал пару изменений, поэтому YMMV.]

$('#yourForm').bind('submit',function(){
    $(this).find(':disabled').removeAttr('disabled').val('disabledByUser');
    return true;
}

Answer 2

Конечно, этот код, который вы публикуете, заключен в $(document).ready(function() { }); или $.ready(function () { });, который вы просто не включили в пример, верно?

правый

Answer 3

ОБНОВЛЕНИЕ:

Попробуйте это (если вы дважды нажимаете #onlyTwo или #onlyThree, я думаю, что они оба должны быть "сняты")

function ClearAllStuff() {
    $("#textarea3,  #textarea4, #radio3, #radio4, #onlyThree, #onlyTwo").removeAttr("disabled");
    $("#onlyThree, #onlyTwo").removeAttr("checked");
}

$('#onlyTwo').click(function(){
    var stuff = $("#textarea3,  #textarea4, #radio3, #radio4, #onlyThree");
    if($(this).is(":checked"))
        stuff.attr("disabled", true);
    else {
        ClearAllStuff();
    }
});

$('#onlyThree').click(function(){
    var stuff = $("#textarea4, #radio4, #onlyTwo");
    if($(this).is(":checked"))
        stuff.attr("disabled", true);
    else {
        ClearAllStuff();
    }
});