Asp.net/javaScript에서 버튼을 확인한 다음 비활성화하려면 어떻게해야합니까?

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

문제

삭제 버튼이있는 표준 ASP.NET 2.0 웹 페이지가 있습니다. 내가 필요로하고 끌어 당기는 방법을 알아낼 수없는 것은 사용자가 삭제 버튼을 눌러 확인 대화 상자 팝업을 사용자에게 "확실합니까?"입니다. 사용자가 예라고 말하면 삭제 버튼을 비활성화하고 서버 사이드 코드 DeleteButton_Click을 실행하는 포스트 백을 수행하려고합니다.

다음은 태그입니다.

<asp:Button ID="deleteButton" Text="Delete" OnClick="deleteButton_Click" runat="server" />

다음은 클라이언트 측면을 처리하기위한 JavaScript (jQuery)입니다.

var deleteButton = $(input.eq(0));
deleteButton.click( function()
{
    var a = confirm( "Are you sure you want to delete this item?" );
    if ( a == false )
    {
        return false;
    }
    else
    {
        deleteButton.attr( "disabled", "disabled" );
        __doPostBack( deleteButton.attr( "id" ), "" );
    }
} );

확인 대화 상자는 예상대로 작동하며 비활성화도 작동합니다. 양식은 우편 백이지만 DeleteButton_Click 이벤트 핸들러를 실행하지 않습니다. __dopostback JavaScript 코드는 페이지에 존재합니다.

DeleteButton 태그에 useubmitbehavior = "false"를 추가 할 수 있지만 확인 대화 상자 답변을 무시합니다.

그래서 여기에 너무 많은 asp.net을 요구할 것입니다. 이 일을하는 방법이 있습니까?

감사,

크레이그

도움이 되었습니까?

해결책 3

피드백에 감사하지만 상당히 간단한 솔루션이었습니다.

JavaScript 라인은 다음과 같습니다.

__doPostBack( deleteButton.attr( "name" ), "" );

대신에:

__doPostBack( deleteButton.attr( "id" ), "" );

"이름"속성이 Dopostback 방법이 찾고있는 속성이라는 것을 몰랐습니다.

다른 팁

btnSubmit.Attributes.Add("onclick", "if(confirm(\"Are you sure you want to delete this item?\" ){this.disabled=true;" + ClientScript.GetPostBackEventReference(btnSubmit, "").ToString() + "}else{return false;}");

이 stackoverflow 질문을 살펴보십시오. 매우 유용하다는 것을 알았습니다.

양식 제출에서 버튼을 비활성화합니다

확인 논리를 추가하고 ... 설정해야합니다 ...

나는 머리를 가서 당신과 나도 확장 방법을 썼습니다. :)

public static void ConfirmThenDisableButtonOnClick(this Button buttonControl, string confirmMessage, string clientFunction)
{
    StringBuilder sb = new StringBuilder();

    // If the page has ASP.NET validators on it, this code ensures the
    // page validates before continuing.
    if (buttonControl.CausesValidation && !String.IsNullOrEmpty(buttonControl.ValidationGroup))
    {
        sb.Append("if ( typeof( Page_ClientValidate ) == 'function' ) { ");
        sb.AppendFormat(@"if ( ! Page_ClientValidate('{0}') ) {{ return false; }} }} ", buttonControl.ValidationGroup);
    }

    //pop confirm, if confirm==true, disable button
    sb.AppendFormat("if(confirm('{0}\')){{this.disabled=true;", confirmMessage.Replace("\"","").Replace("'",""));

    // If a secondary JavaScript function has been provided, and if it can be found,
    // call it. Note the name of the JavaScript function to call should be passed without
    // parens.
    if (!String.IsNullOrEmpty(clientFunction))
    {
        sb.AppendFormat("if ( typeof( {0} ) == 'function' ) {{ {0}() }};", clientFunction);
    }

    // GetPostBackEventReference() obtains a reference to a client-side script function 
    // that causes the server to post back to the page (ie this causes the server-side part 
    // of the "click" to be performed).
    sb.Append(buttonControl.Page.ClientScript.GetPostBackEventReference(buttonControl, ""));

    // if confirm==false do nothing
    sb.Append(";}else{return false;}");

    // Add the JavaScript created a code to be executed when the button is clicked.
    buttonControl.Attributes.Add("onclick", sb.ToString());
}

유효성 검사도 추가했습니다 :)

JavaScript를 통해 포스트 백을 수행하는 대신 OnClientClick을 사용하여 동일한 작업을 수행 할 수 있습니다.

<asp:Button OnClientClick="if (confirm('Are you sure?')) {this.disabled = true;} else {return false;}" />

또는 버튼을 비활성화하는 것보다 JavaScript를 통해 더 많은 작업을 수행하려면 다음과 같은 말을 할 수 있습니다.

<asp:Button OnClientClick="return DisableOnConfirm();" />

ASP 함수가 실행되기를 원하지 않으면 궁극적으로 "Return False;

자바 스크립트 : 

deleteButton.disabled = true;

씨#:

deleteButton.Enabled = false;

DeleteButton_Click 이벤트에서 서버 측의 버튼을 비활성화해야 할 것입니다 (PostBack을 수행하므로 페이지를 재현하기 때문에).

<asp:Button ID="deleteButton" Text="Delete" OnClick="deleteButton_Click" runat="server" OnClientClick="javascript:return confirm('are you sure blah blah blah ...')" />

그리고 코드-홀드에서 :

private void deleteButton_Click(object sender, EventArgs e) {
    deleteButton.Enabled = false;
    // and the rest of event handling ...
}

클릭 이벤트가 발사되지 않는 것은 조금 이상합니다. 버튼이 비활성화 되었기 때문이라고 추측했지만 일반적으로 클라이언트뿐만 아니라 서버에서 버튼이 비활성화 된 경우에만 발생합니다. Page_load 기능의 이상적인 솔루션은 아니지만 Postback 및/또는 Async Postback을 확인하고 Postback의 대상 (이 경우 버튼)을 결정한 다음 몇 가지 메소드를 호출 할 수 있습니다. __dopostback () 함수를 사용하여 인수를 전달할 수도 있습니다.

처음에는 클라이언트 사이드 클릭 이벤트 또는 서버 사이드 클릭 이벤트에 대해 이야기하고 있는지 확실하지 않았습니다. 서버 사이드 클릭 이벤트가 발사되지 않았다고 명시 적으로 진술해야한다고 생각합니다.

어쨌든, aspx 페이지에서 < %@ page enableeventValidation = "false" %>를 시도하고 그것이 작동하는지 확인하십시오 (기본적으로 true로 설정됨). 이 속성의 핵심이 작동하는 것을 기억하지 못하지만이 기능은 서버 측 이벤트가 합법적 인 경우에만 해고되는지 확인합니다. 예를 들어, 페이지에 XSS 취약점이 있고 해커가 JavaScript를 주입하여 삭제 버튼을 호출한다고 가정 해 봅시다. 이 속성은 이러한 공격을 방지하는 데 도움이됩니다. 

$(":submit").click(function ()
{
    $(this).attr("disabled", true); // disable input

    if (confirm("Press OK to submit"))
    {
        __doPostBack(this.id, ""); // if user presses OK; submit
    }
    else
    {
        // If user presses cancel; enable input and stop submit
        $(this).attr("disabled", false);

        return false;
    }
});

나는 이것을 버튼에서 호출 할 수있는 JS 함수를 만들기로 결정했습니다.

다음은 작동하는 샘플이 있지만 JavaScript를 기존 .js 파일 또는 헤드 태그와 같은 다른 장소로 옮깁니다.

<script>
    function confirmPostback(button) {
        if (confirm('Are you sure?')) {
            button.disabled = true;
            __doPostBack(button.name, '')
            return true;
        } else {
            return false;
        }
    }
</script>

<asp:Button ID="TestPostback" runat="server" Text="Test Postback"
        UseSubmitBehavior="false" OnClientClick="return confirmPostback(this)" />
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top