ข้อมูลจะถูกส่งผ่านระหว่าง Javascript ฝั่งไคลเอ็นต์และรหัส C # หลังแอพ ASP.NET ได้อย่างไร

ฉันกำลังมองหาวิธีที่มีประสิทธิภาพ / มาตรฐานในการส่งผ่านข้อมูลระหว่างรหัส JavaScript ฝั่งไคลเอ็นต์และรหัส C # หลังแอปพลิเคชัน ASP.NET ฉันใช้วิธีการดังต่อไปนี้เพื่อให้บรรลุสิ่งนี้ แต่พวกเขาทั้งหมดรู้สึกว่าเหลวไหล

ในการส่งข้อมูลจาก JavaScript ไปยังรหัส C # คือการตั้งค่าตัวแปร ASP ที่ซ่อนอยู่และเรียกใช้ postback:

<asp:HiddenField ID="RandomList" runat="server" />

function SetDataField(data) {
      document.getElementById('<%=RandomList.ClientID%>').value = data;
}

จากนั้นในรหัส C # ฉันรวบรวมรายการ:

protected void GetData(object sender, EventArgs e)
{
      var _list = RandomList.value;
}

กลับไปทางอื่นฉันมักจะใช้ ScriptManager เพื่อลงทะเบียนฟังก์ชั่นและส่งผ่านข้อมูลระหว่าง Page_Load:

ScriptManager.RegisterStartupScript(this.GetType(), "Set","get("Test();",true);

หรือฉันจะเพิ่มแอททริบิวให้กับการควบคุมก่อนโพสต์กลับหรือระหว่างขั้นตอนการเริ่มต้นหรือการแสดงผลล่วงหน้า:

Btn.Attributes.Add("onclick", "DisplayMessage("Hello");");

วิธีการเหล่านี้ให้บริการฉันดีและทำงาน แต่พวกเขาก็รู้สึกไม่สมบูรณ์ มีวิธีมาตรฐานในการส่งผ่านข้อมูลระหว่าง JavaScript ฝั่งไคลเอ็นต์และรหัสด้านหลัง C # มากขึ้นหรือไม่

ฉันเคยเห็นโพสต์เช่นนี้ที่อธิบายถึงระดับ HtmlElement; นี่คือสิ่งที่ฉันควรตรวจสอบหรือไม่

คุณสามารถเรียกเมธอดหน้าสแตติกจาก JavaScript ในตัวอย่างนี้ หากคุณต้องการเรียกวิธีการจากหลาย ๆ หน้าคุณสามารถตั้งค่าบริการเว็บและเรียกใช้จาก Javascript ด้วยวิธีเดียวกัน ตัวอย่างรวมอยู่ด้านล่าง

รหัส. aspx

<asp:ScriptManager ID="ScriptManager1" 
EnablePageMethods="true" 
EnablePartialRendering="true" runat="server" />

รหัสหลังรหัส

using System.Web.Services;

[WebMethod]
public static string MyMethod(string name)
{
    return "Hello " + name;
}

รหัส Javascript

function test() {
    alert(PageMethods.MyMethod("Paul Hayman"));
}

หมายเหตุ: วิธีการหน้าจะต้องคงที่ นี่อาจเป็นปัญหาสำหรับคุณขึ้นอยู่กับแอปพลิเคชันที่พยายามจะทำ อย่างไรก็ตามหากข้อมูลเป็นไปตามเซสชันทั้งหมดและคุณใช้การตรวจสอบในตัวบางประเภทคุณสามารถใส่แอตทริบิวต์ EnableSession บนมัณฑนากร WebMethod ได้และจะช่วยให้คุณได้รับ HttpContext.Current.User เซสชั่น ฯลฯ

ฉันขอแนะนำให้ดูที่ jQuery JQuery สามารถใช้ในการโทร AJAX กลับไปที่เซิร์ฟเวอร์ซึ่งสามารถส่งข้อมูลกลับในรูปแบบที่คุณต้องการ - รูปแบบที่ดีอาจเป็น JSON เนื่องจากสามารถใช้งานได้โดยตรงใน javascript

ในการดึงข้อมูลจากเซิร์ฟเวอร์ลงไปยัง javascript โดยใช้jQueryการดึงข้อมูลต่อไปนี้จะทำการร้องขอแบบอะซิงโครนัสไปยังhttp://youserver.com/my/uriและรับข้อมูลจากเซิร์ฟเวอร์ในฟังก์ชันที่ให้มา

$.get("my/uri", 
    function(data) { 
       // client side logic using the data from the server
    })

การส่งข้อมูลจาก javascript ไปยังเซิร์ฟเวอร์ทำงานในลักษณะเดียวกัน:

$.post("my/uri", { aValue : "put any data for the server here" }
    function(data) { 
       // client side logic using the data returned from the server
    })

Microsoft ได้ให้UpdatePanelการควบคุมอาแจ็กซ์โดยปริยายเพื่อให้เป็นวิธี "มาตรฐาน" ฉันจะไม่แนะนำให้ใช้เป็นการส่วนตัว แต่จะไม่มีที่ไหนใกล้กับชุดคุณลักษณะที่หลากหลายและการควบคุมที่คุณมีเมื่อใช้ JavaScript โดยตรง

นี่คือวิธีที่ฉันทำ:

สร้างเขตข้อมูลที่ซ่อนสำหรับค่าฝั่งไคลเอ็นต์ใด ๆ ที่คุณต้องการใช้ใน postback ของหน้ามาตรฐาน (เช่นเมื่อผู้ใช้ส่งการส่ง)

<asp:HiddenField ID="selectedProduct" runat="server" />

ในโค้ดด้านหลังรีจิสเตอร์คอนโทรลที่คุณต้องการใช้ฝั่งไคลเอ็นต์

    /* Register the controls we want to use client side */

    string js = "var productBox = document.getElementById('" + selectedProduct.ClientID + "'); ";
    js += "var macCodeBoxBE = document.getElementById('" + beMacCode.ClientID + "'); ";


    ClientScript.RegisterStartupScript(this.GetType(), "prodBox", js, true);

ใช้ไลบรารี javascript * เพื่อทำ ajax post / get ของคุณจากนั้นใช้ JavaScript เพื่ออัปเดตเพจตามการตอบสนอง

$.get("../ajax/BTBookAppointment.aspx?dsl=" + telNumberBox.value + "&date=" + requiredDate.value + "&timeslot=" + ddTimeslot.value, function (response, status, xhr) {

    if (response.indexOf("not available") > -1) {
        loaderImage.src = "../images/cross.png"
        output.innerHTML = response;
    } });

เขียนหน้า sjrate "ajax" ที่แทนที่เมธอด render เพื่อทำงาน

protected override void Render(HtmlTextWriter writer)
{
    if (string.IsNullOrEmpty(Request["mac"])) { return; }
    if (string.IsNullOrEmpty(Request["dsl"])) { return; }
    DataLayer.Checkers.BTmacCheckResponse rsp = DataLayer.Checkers.Foo.CheckMAC(Request["dsl"], Request["mac"]);

    writer.Write(rsp.Valid.ToString());
}

*มีห้องสมุดให้เลือกมากมายคุณสามารถม้วนเองได้ ฉันขอแนะนำjQueryให้มีความเสถียรและมีชุดคุณสมบัติที่ครอบคลุม

JSON เป็นวิธีปฏิบัติที่ดีที่สุดในการทำงานให้สำเร็จ อย่ามองปัญหาว่าเป็นการผ่านระหว่าง "C # และ JavaScript" วิธีคิดนี้นำไปสู่การแปลกประหลาดของรหัสเช่นสิ่งที่คุณมีในโพสต์ต้นฉบับ

โดยทั่วไปแล้วเป็นเพียงการส่งวัตถุระหว่างไคลเอนต์และเซิร์ฟเวอร์ในภาษาที่ไม่เชื่อเรื่องพระเจ้า JSON นั้นยอดเยี่ยมสำหรับงานเนื่องจากรองรับอย่างกว้างขวางและอ่านง่าย

ในการตั้งค่าแท็กอินพุตที่ไม่ต้องการ asp เซิร์ฟเวอร์ด้านคุณสามารถใช้: (หรือ <% #%> สำหรับแบบฟอร์มฐานข้อมูล)

HTML:

<input type="hidden" value='<%= RandomValues %>' name="RANDOM_VALUES" />

การควบคุม asp:

<asp:HiddenField ID="RandomList" runat="server" />

เพื่อรับค่าใน postback

Request.Form["RANDOM_VALUES"]

ถ้ามันเป็น ASP ควบคุมอินพุตที่ซ่อนอยู่คุณสามารถใช้

Request.Form[RandomList.UniqueID]

ส่วนที่เรียบร้อยเกี่ยวกับ Request.Form คือถ้าคุณมีหลายแท็กที่มีแอตทริบิวต์ "name" เหมือนกันมันจะส่งคืนผลลัพธ์ใน CSV