Bagaimana untuk Memberikan Pandangan Separa Secara Dinamik dengan jQuery dalam ASP.NET MVC?

Memberikan Pandangan Separa dengan jQuery dalam ASP.NET MVC

Paparan separa ialah cara mudah untuk memodulasi aplikasi ASP.NET MVC anda dengan memecahkan paparan yang kompleks kepada yang lebih kecil , komponen boleh guna semula. Walaupun biasa untuk memaparkannya secara langsung dalam paparan induk, mungkin terdapat senario di mana anda perlu melakukannya secara dinamik menggunakan jQuery.

Cara Membuat Paparan Separa dengan jQuery

Bertentangan dengan tanggapan salah, anda tidak boleh secara langsung memberikan pandangan separa menggunakan jQuery sahaja. Walau bagaimanapun, anda boleh menggunakan kaedah tindakan yang mengembalikan paparan separa sebagai responsnya, kemudian gunakan jQuery untuk memasukkan hasil ke dalam halaman anda.

Sampel kod berikut menunjukkan cara untuk mencapai ini:

<code class="javascript">$('.js-reload-details').on('click', function(evt) {
    evt.preventDefault();
    evt.stopPropagation();

    var $detailDiv = $('#detailsDiv'),
        url = $(this).data('url');

    $.get(url, function(data) {
        $detailDiv.replaceWith(data);         
    });
});</code>

Kod ini menganggap perkara berikut:

• Butang dengan kelas js-reload-details dan atribut data bernama data-url. Atribut url data harus mengandungi URL kaedah tindakan yang memaparkan paparan separa.
• Paparan separa dengan atribut ID detailsDiv.
• Kaedah tindakan bernama Butiran dalam pengawal Pengguna . Tindakan Butiran mengambil parameter integer dan mengembalikan paparan separa bernama "Butiran Pengguna".

Kod Contoh

Dalam paparan induk, anda harus memasukkan butang dengan atribut url data yang sesuai:

<code class="html"><button data-url='@Url.Action("details","user", new { id = Model.ID } )'
        class="js-reload-details">Reload</button></code>

Paparan separa UserDetails harus mengandungi HTML yang diingini:

<code class="html"><div id="detailsDiv">
    <!-- ...content... -->
</div></code>

Dengan menggabungkan elemen ini, anda boleh memuatkan dan memaparkan paparan separa secara dinamik menggunakan jQuery dalam ASP.NET MVC.

Atas ialah kandungan terperinci Bagaimana untuk Memberikan Pandangan Separa Secara Dinamik dengan jQuery dalam ASP.NET MVC?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!