วิธีปิดการใช้งาน Postback บนปุ่ม asp (System.Web.UI.WebControlsbutton)

ฉันมีปุ่ม asp เป็นฝั่งเซิร์ฟเวอร์ดังนั้นฉันจึงสามารถแสดงได้สำหรับผู้ใช้ที่ล็อกอินเท่านั้น แต่ฉันต้องการให้เรียกใช้ฟังก์ชันจาวาสคริปต์และดูเหมือนว่าเมื่อ runat = "เซิร์ฟเวอร์" จะเรียกเหตุการณ์หลังกลับเสมอ

ฉันยังมีปุ่มปกติ ( <input...>) ไม่ทำงานที่เซิร์ฟเวอร์และใช้งานได้ดี ...

ฉันจะทำให้ปุ่มนี้รันเฉพาะจาวาสคริปต์และไม่โพสต์แบ็คได้อย่างไร

ให้ javascript ของคุณส่งคืนเท็จเมื่อเสร็จสิ้น

<asp:button runat="server".... OnClientClick="myfunction(); return false;" />

YourButton.Attributes.Add("onclick", "return false");

หรือ

<asp:button runat="server" ... OnClientClick="return false" />

คุณสามารถใช้ jquery click action และใช้ฟังก์ชันPreventDefault ()เพื่อหลีกเลี่ยงการโพสต์แบ็ค

<asp:button ID="btnMyButton" runat="server" Text="MyButton" />


$("#btnMyButton").click(function (e) {
// some actions here
 e.preventDefault();
}

พิจารณาสิ่งนี้.

<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequest);
function BeginRequest(sender, e) {
    e.get_postBackElement().disabled = true;

}
     </script>

คนอื่นถูกต้องที่คุณต้องการให้ติดต่อกลับเพื่อส่งคืนเท็จ อย่างไรก็ตามฉันต้องการเพิ่มว่าการทำโดยการตั้งค่า onclick เป็นวิธีเก่า ๆ ที่น่าเกลียดในการทำสิ่งต่างๆ ผมอยากแนะนำให้อ่านเกี่ยวกับจาวาสคริปต์ไม่สร้างความรำคาญ การใช้ไลบรารีเช่นjQueryอาจทำให้ชีวิตของคุณง่ายขึ้นและ HTML น้อยลงเมื่อรวมกับจาวาสคริปต์ของคุณ (และตอนนี้Microsoft รองรับ jQuery แล้ว!)

ASP.NET จะสร้างasp:Buttonเป็นinput type=submitไฟล์.
หากคุณต้องการปุ่มที่ไม่ทำโพสต์ แต่ต้องการการควบคุมสำหรับองค์ประกอบทางฝั่งเซิร์ฟเวอร์ให้สร้างอินพุต HTML แบบง่ายพร้อมแอตทริบิวต์type=buttonและrunat=server.

หากคุณปิดใช้งานการคลิกการกระทำOnClientClick=return falseมันจะไม่ทำอะไรเลยเมื่อคลิกเว้นแต่คุณจะสร้างฟังก์ชันเช่น:

function btnClick() {
    // do stuff
    return false;
}

คุณไม่ได้บอกว่าคุณกำลังใช้. NET framework เวอร์ชันใด

หากคุณใช้ v2.0 ขึ้นไปคุณสามารถใช้คุณสมบัติ OnClientClick เพื่อเรียกใช้ฟังก์ชัน Javascript เมื่อเหตุการณ์ onclick ของปุ่มถูกยกขึ้น

สิ่งที่คุณต้องทำเพื่อป้องกันไม่ให้เกิดการโพสต์แบ็คเซิร์ฟเวอร์คือการส่งคืนfalseจากฟังก์ชัน JavaScript ที่เรียกว่า

นอกจากนี้สำหรับคำตอบที่ยอมรับคุณสามารถใช้ UseSubmitBehavior = "false" MSDN

ในกรณีของฉันฉันแก้ไขการเพิ่มผลตอบแทนใน onClientClick:

รหัสหลัง

function verify(){
  if (document.getElementById("idName").checked == "") {
    alert("Fill the field");
    return false;
  }
}

ออกแบบพื้นผิว

<asp:Button runat="server" ID="send" Text="Send" onClientClick="return verify()" />

คุณสามารถใช้รหัส:

<asp:Button ID="Button2" runat="server"
     Text="Pulsa"
     OnClientClick="this.disabled=true"
     UseSubmitBehavior="False"/>

ถ้า nee ส่ง

...
<form id="form1" runat="server" onsubmit="deshabilita()">
...
<script type="text/javascript">
    function deshabilita()
    {
        var btn = "<%= Button1.ClientID %>";
        if (confirm("Confirme postback"))
        {
            document.getElementById(btn).disabled = true;
            return true;
        }
        return false;
    }
</script>

ด้วย Validation

ในตัวอย่างนี้ฉันใช้สองการควบคุมddlและtxtboxมีความสุขในการเขียนโค้ด

 asp:ScriptManager ID="script1" runat="server" /asp:ScriptManager

    asp:UpdatePanel ID="Panel1" runat="server"
       ContentTemplate

// ASP BUTTON
asp:Button ID="btnSave" runat="server" Text="Save" class="btn btn-success" OnClientClick="return Valid()" OnClick="btnSave_Click"


   /ContentTemplate    
    /asp:UpdatePanel    

  <script type="text/javascript">
        function Valid() {

            if ($("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").val() == 0) {
                alert("Please select YOUR TEXT");
                $("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").focus();
                return false;
            }

            if ($("#ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").val().length == 0) {
                alert("Please Type YOUR TEXT");
                $("ctl00_ContentPlaceHolder1_YOUR CONTROL NAME").focus();
                return false;
            }
            return true;
        }
</script>

คุณสามารถใช้ JQuery สำหรับสิ่งนี้

<asp:Button runat="server" ID="btnID" />

กว่าใน JQuery

$("#btnID").click(function(e){e.preventDefault();})

คุณเพียงแค่ต้องคืนค่าเท็จจากไฟล์

function jsFunction() {
  try {
    // Logic goes here
    return false; // true for postback and false for not postback
  } catch (e) {
    alert(e.message);
    return false;
  }
}

<asp:button runat="server" id="btnSubmit" OnClientClick="return jsFunction()" />

ฟังก์ชัน JavaScript ดังต่อไปนี้

หมายเหตุ * : ใช้บล็อก try-catch เสมอและส่งคืน false จาก catch block เพื่อป้องกันการคำนวณที่ไม่ถูกต้องในฟังก์ชัน javaScript