Cách khôngLoad lại trang website

[Tiêu Đình Tuấn]

Xin chào anh em nhóm lập trình

Cho mình hỏi. Mình đang làm 1 Form để nhập thông tin điểm thi theo từng lớp, học kỳ, năm học, môn học

Khi chọn đầy đủ thông tin rùi thì nhấn Nút để lọc danh sách học sinh, sau đó là nhập điểm vào rùi thì Lưu lại nhưng nó lại Load lại trang website.

Anh em chỉ mình với để có cách nào không Load trang website hay không?

[Huan Vu Le]

Load lại một phần trang web thay vì tòan trang ==> dùng ajax, để cho tiện, ta dùng jquery.

Giả sử trang chúng ta đang xét là default.aspx

Trang lọc ra danh sách là filter.aspx

thì khi nhấn một button hoặc thẻ a trong default.aspx, ta sẽ call ajax load filter.aspx vào 1 khu vực nào đó trong default.aspx.

default.aspx

<script type="text/javascript" src="util.js"></script>

<select id="cboClass">

<option value="1">06cdtp1</option>

<option value="11">06cdtp2</option>

<option value="12">06cdtp3</option> 

<option value="15">06cdtp4</option> 

</select>

<a href="" class="btnFilter">Lọc</a>

<div id="filterContainer"></div>

filter.aspx

Trang này sẽ xử lý lấy ra id lớp bằng Request.Form["class_id"], sau đó tiến hành truy vấn csdl, xuất ra html cần đưa vào trang default.aspx, phần còn lại đọan code js bên dưới sẽ xử lý.

util.js

$(function(){

$('.btnFilter').click(function(e){

e.preventDefault();

params = "class_id = " + $('#cboClass').val();//Nếu có thêm thì nối chuỗi, vd: params += "&nam_hoc = " + ...

$.ajax({

url: "filter.aspx",

type: "POST",

data: params,

async:false,

success: function(response){

  $('#filterContainer').html(response);

} 

}); 

} );

});