비활성화 된 양식 입력이 요청에 나타나지 않습니다

양식에 비활성화 된 입력이 있으며 서버로 보내려고하지만 Chrome은 요청에서 제외합니다.

숨겨진 필드를 추가하지 않고 이에 대한 해결 방법이 있습니까?

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />

    <!-- this does not appear in request -->
    <input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

</form>

disabled속성이 있는 요소 는 제출되지 않거나 값이 게시되지 않았다고 말할 수 있습니다 ( 양식 데이터 세트 작성 에 대한 HTML 5 스펙의 3 단계 아래 두 번째 글 머리 참조 ).

즉,

<input type="textbox" name="Percentage" value="100" disabled="disabled" /> 

참고로 HTML 4 사양에서 17.12.1 에 따라 :

1. 비활성화 된 컨트롤에는 포커스가 없습니다.
2. 탭 탐색에서 비활성화 된 컨트롤을 건너 뜁니다.
3. 비활성화 된 컨트롤을 게시 할 수 없습니다.

readonly사례에 속성을 사용할 수 있습니다. 이렇게하면 필드 데이터를 게시 할 수 있습니다.

즉,

<input type="textbox" name="Percentage" value="100" readonly="readonly" />

참고로 HTML 4 사양의 17.12.2 에 따라 :

1. 읽기 전용 요소는 포커스를 받지만 사용자가 수정할 수는 없습니다.
2. 탭 탐색에는 읽기 전용 요소가 포함됩니다.
3. 읽기 전용 요소가 게시되었습니다.

Jquery를 사용하고 ajax로 데이터를 보내면 문제를 해결할 수 있습니다.

<script>

$('#form_id').submit(function() {
    $("#input_disabled_id").prop('disabled', false);

    //Rest of code
    })
</script>

활성화 된 입력 외에도 비활성화 된 입력의 값을 게시하려면 제출할 때 양식의 모든 입력을 다시 활성화하면됩니다.

<form onsubmit="this.querySelectorAll('input').forEach(i => i.disabled = false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

jQuery를 선호하는 경우 :

<form onsubmit="$(this).find('input').prop('disabled', false)">
    <!-- Re-enable all input elements on submit so they are all posted, 
         even if currently disabled. -->

    <!-- form content with input elements -->
</form>

ASP.NET MVC C # Razor의 경우 제출 핸들러를 다음과 같이 추가하십시오.

using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post,
    // Re-enable all input elements on submit so they are all posted, even if currently disabled.
    new { onsubmit = "this.querySelectorAll('input').forEach(i => i.disabled = false)" } ))
{
    <!-- form content with input elements -->
}

필드를 비활성화하고 데이터를 전달 해야하는 경우 javascript를 사용하여 동일한 데이터를 숨겨진 필드에 입력하거나 숨겨진 필드를 설정할 수도 있습니다. 이렇게하면 다른 페이지에 게시하더라도 데이터를 사용 중지 할 수는 있지만 여전히 데이터를 게시 할 수 있습니다.

이 답변을 업데이트 중이므로 매우 유용합니다. 입력에 읽기 전용을 추가하십시오.

따라서 형식은 다음과 같습니다.

<form action="/Media/Add">
    <input type="hidden" name="Id" value="123" />
    <input type="textbox" name="Percentage" value="100" readonly/>
</form>

의미 상 이것은 올바른 행동 인 것 같습니다

" 스스로이 값을 제출해야하는 이유는 무엇입니까? "

양식에서 입력이 비활성화 된 경우 사용자가 값을 직접 변경하지 않도록 할 수 있습니다.

비활성화 된 입력에 표시되는 모든 값은

1. 양식을 생성 한 서버의 값에서 출력 하거나
2. 양식이 동적 인 경우 양식의 다른 입력에서 계산 가능

양식을 처리하는 서버가 양식을 제공하는 서버와 동일하다고 가정하면, 비활성화 된 입력 값을 재현하기위한 모든 정보는 처리시 사용 가능해야합니다.

실제로 데이터 무결성을 유지하려면 비활성화 된 입력 값이 처리 서버로 전송 된 경우에도 실제로 유효성을 검사해야합니다. 이 유효성 검사에는 값을 재현하는 데 필요한 것과 동일한 수준의 정보가 필요합니다!

나는 거의 읽기 전용 입력을 요청에서 보내지 않아야한다고 주장했다.

기꺼이 수정했지만 읽기 전용 / 비활성화 된 입력을 제출해야하는 모든 사용 사례 는 실제로 스타일의 문제 일뿐입니다.

나는 이것이 더 쉽다는 것을 안다. 입력 필드를 읽기 전용으로 설정 한 다음 최종 사용자가 읽기 전용임을 알 수 있도록 스타일을 지정하십시오. 여기에 배치 된 입력 (예 : AJAX)은 추가 코드없이 제출할 수 있습니다.

<input readonly style="color: Grey; opacity: 1; ">

당신은 완전히 비활성화를 피할 수 있습니다 .html 양식 형식은 관련된 것을 보내지 않기 때문에 고통 스럽습니다. <p> 레이블이나 다른 레이블 .

그래서 당신은 대신 정기적으로 넣을 수 있습니다

<input text tag just before you have `/>

이거 추가 해봐 readonly="readonly"

텍스트를 비활성화하지는 않지만 사용자가 변경하지 않으므로 작동 <p>하고 양식을 통해 값을 보냅니다. <p>태그 처럼 만들려면 테두리를 제거하십시오.