jQuery 검증 플러그인:비활성화에 대한 검증을 지정 제출 버튼

StackOverflow https://stackoverflow.com/questions/203844

  •  03-07-2019
  •  | 
  •  

문제

나는 형태로 여러 분야와는 나의 유효성 검사(어떤 방법으로 추가해 사용자 정의 유효성)와 Jörn Zaeffere 의 우수한 jQuery 검증 플러그인입니다.당신은 어떻게 우회 검증 제출된 컨트롤(즉,화재,유효성 검사에는 일부를 제출하는 입력하지만,화재 검증으로 다른 사람)?이와 비슷한 것입 ValidationGroups 표준 ASP.NET 검증을 제어합니다.

나의 상황:

그것은 ASP.NET WebForms,하지만 무시할 수 있습니다 원하는 경우.그러나 내가 사용하여 검증으로 더 많은"권장 사항":다시 말해서,때에 양식이 제출한 검증을 불러 대신에"필요"메시지를 표시하는,""권고는 말의 라인을 따라"당신이 다음과 같은 분야....당신이 소원을 진행합니까?" 해당 지점에서 컨테이너에 오류가 있 제출 버튼은 지금 보는 누를 수 있는 무시하는 것이 유효성 및 제출요.는 방법을 회피하는 형태입니다.유효성 검사()이 버튼을 통제하고 여전히 post?

구매 및 판매는 집에서 샘플 http://jquery.bassistance.de/validate/demo/multipart/ 이것을 공격하기 위해 이전,그러나 그것이 그렇게 창조를 통해 사용자 지정 메서드를 추가하는 유효성 검사기.고 싶지 않을 만들어야 사용자 지정 방법을 중복 기능을 이미 유효성 검사에서 플러그인입니다.

다음과 같은 단축된 버전의 바로 적용되는 스크립트가 있는데 바로 지금:

var container = $("#<%= Form.ClientID %> div.validationSuggestion");

$('#<%= Form.ClientID %>').validate({          
    errorContainer: container,
    errorLabelContainer: $("ul",container),
    rules: {
        <%= YesNo.UniqueID %>: { required: true },
        <%= ShortText.UniqueID %>: { required: true } // etc.

    },
    messages: {
        <%= YesNo.UniqueID %>: 'A message.',
        <%= ShortText.UniqueID %>: 'Another message.' // etc.
    },
    highlight: function(element, errorClass) {
        $(element).addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass("valid");
    },
    unhighlight: function(element, errorClass) {
        $(element).removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass("valid");
    },
    wrapper: 'li'
});
도움이 되었습니까?

해결책

을 추가할 수 있습 CSS 의 클래스 cancel 를 제출 버튼을 억제하는 검증

e.g

<input class="cancel" type="submit" value="Save" />

보 jQuery 검증 문서의 이 기능 여기: 를 건너뛰는 유효성 검사에 제출

편집:

위의 기술이 사용되지 않으며 대체 formnovalidate 특성이 있습니다.

<input formnovalidate="formnovalidate" type="submit" value="Save" />

다른 팁

기타(언급되지 않음)그것을 할 수있는 방법,전화:

$("form").validate().cancelSubmit = true;

에는 이벤트의 버튼(예를 들어).

아직 다른(동적)방법:

$("form").validate().settings.ignore = "*";

고 그것을 다시 사용하도록,우리는 단지 설정이 다시 기본값:

$("form").validate().settings.ignore = ":hidden";

출처: https://github.com/jzaefferer/jquery-validation/issues/725#issuecomment-17601443

추가 formnovalidate 속성을 입력

    <input type="submit" name="go" value="Submit"> 
    <input type="submit" formnovalidate name="cancel" value="Cancel">

추가하는 class="취소"은 지금 사용되지 않습니다

에 대한 문서를 참조하십시오를 건너뛰는 유효성 검사에 제출에 이 링크

사용할 수 있습니다 onsubmit:false 옵션(참조하십시오 문서)선할 때까지 검증하는 유효성을 검사하지 않습니다출에 대한의 양식입니다.그리고 당신의 asp:버튼을 추가 OnClientClick=$('#aspnetForm').유효();을 명시적으로 확인하는 경우 양식은 유효합니다.

당신이 선택 모델에서 대신의 선택합니다.

참고,나는 또한 jquery 를 사용하여 검증 ASP.NET WebForms.거기에 몇 가지 문제를 탐색 하지만 일단 당신이 그들을 통해 사용자 경험이 매우 좋다.

(확장자의 @lepe's @redsquare 에 대한 답 ASP.NET MVC + jquery.validate.unobtrusive.js)

이 jquery 검증 플러그인 (아닌 Microsoft 눈에 거슬리지 중 하나)를 넣을 수 있도록 허용한 .cancel 클래스에 제출 버튼 우회하는 완전히 유효성 검사(과 같이 받아들여 답변).

 To skip validation while still using a submit-button, add a class="cancel" to that input.

  <input type="submit" name="submit" value="Submit"/>
  <input type="submit" class="cancel" name="cancel" value="Cancel"/>

(혼동하지 않는 이와 type='reset' 완전히 다른 무언가)

불행하게도 jquery.validation.unobtrusive.js 유효성처리(취급 ASP.NET MVC)코드 좀사 jquery.검증 플러그인의 기본 행동.

이지할 수 있도록을 넣 .cancel 에 제출 버튼으로 다음과 같다.마이크로소프트가 이제까지'수정'이 다음할 수 있습 remvoe 이 코드입니다.

    // restore behavior of .cancel from jquery validate to allow submit button 
    // to automatically bypass all jquery validation
    $(document).on('click', 'input[type=image].cancel,input[type=submit].cancel', function (evt)
    {
        // find parent form, cancel validation and submit it
        // cancelSubmit just prevents jQuery validation from kicking in
        $(this).closest('form').data("validator").cancelSubmit = true;
        $(this).closest('form').submit();
        return false;
    });

참고:는 경우 첫 번째 시도에서 나타나는 것이 작동하지 않습니다-당신이 있는지 확인하지 않 라운드 트립 서버를 보고 서버가 생성한 페이지에 오류가 있습니다.해야 합를 우회하는 유효성 검증 서버 측에서는 다른 방법으로-이할 수 있습의 양식을 제출하는 클라이언트 측의 없이 오류(다른 것을 추가 .ignore 속성의 모든 양식에서).

(주의:추가해야 할 수도 있습니다 button 를 선택하는 경우 당신은 버튼을 사용하여 제출)

이 질문은 이전,그러나 내가 발견 또 다른 방법으로 주위 사용 $('#formId')[0].submit(), 을 얻을 수있는,dom 요소를 대신 jQuery 체,따라서 우회를 확인하 후크.이 버튼을 전송하는 부모 형태는 입력이 포함되어 있습니다.

<input type='button' value='SubmitWithoutValidation' onclick='$(this).closest('form')[0].submit()'/>

또한지 확인할 수 없 input's 이라는 제출"",또는 라는 함수를 재정의 submit.

나는이 발견되는 가장 유연한 방법을 사용하 JQuery 의:

event.preventDefault():

E.g.는 경우에는 대신 제출하고 싶 redirect,내가 할 수 있습니다:

$("#redirectButton").click(function( event ) {
    event.preventDefault();
    window.location.href='http://www.skip-submit.com';
});

또 내가 보낼 수 있는 데이터를 다른 끝점(예:면 나는 원하는 작업을 변경하려면):

$("#saveButton").click(function( event ) {
    event.preventDefault();
    var postData = $('#myForm').serialize();
    var jqxhr = $.post('http://www.another-end-point.com', postData ,function() {
    }).done(function() {
        alert("Data sent!");
    }).fail(function(jqXHR, textStatus, errorThrown) {
        alert("Ooops, we have an error");
    })

일단 당신이'이벤트입니다.preventDefault();'당신은 우회 유효성 검사를 수행합니다.

나는 두 개의 단추를 위한 양식이 제출 버튼이라는 이름 저장 출시 확인:

$('.save_exist').on('click', function (event) {
            $('#MyformID').removeData('validator');
            $('.form-control').removeClass('error');
            $('.form-control').removeClass('required');                
            $("#loanApplication").validate().cancelSubmit = true;
            $('#loanApplication').submit();
            event.preventDefault();
});

$("form").validate().settings.ignore = "*";

나

$("form").validate().cancelSubmit = true;

그러나 성공 없이 사용자 정의 필요한 검증이다.에 대한 호출을 제출하는 동적으로 만들었 가짜 숨겨진 제출 버튼으로 이 코드:

var btn = form.children('input.cancel.fakeSubmitFormButton');
if (btn.length === 0) {
    btn = $('<input name="FakeCancelSubmitButton" class="cancel fakeSubmitFormButton hide" type="submit" formnovalidate value="FakeCancelSubmitButton" />');
    form.append(btn);
}
btn.click();

지금 건너뛰 검증 올바르게:)

여기에는 간단한 버전은,그것을 희망하는 데 도움이 누군가

$('#cancel-button').click(function() {
    var $form = $(this).closest('form');
    $form.find('*[data-validation]').attr('data-validation', null);
    $form.get(0).submit();
});
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top