<Cthuvien:bar>

thông tin

Controls thay thế: BSSTab

Mô tả

Cthuvien:bar là control hiển thị tiêu đề của tab (kế thừa từ System.Web.UI.WebControls.Label, render thành thẻ <span>). Khi click vào một bar, hàm P_BAR(this) sẽ chuyển trạng thái CSS của bar đó từ hậu tố _de (mặc định) sang _ac (đang chọn), đồng thời tắt bar đang active trước đó trong cùng nhóm.

Control tự động xác định nhóm cha (TaId) theo quy ước đặt tên ID: nếu bar có ID là B_menu_1, hệ thống tìm container cha B_menu (bỏ phần sau dấu _ cuối cùng). Hỗ trợ gọi hàm callback (ham) sau khi chuyển bar.

Thuộc tính

Thuộc tính chung

Tên	Kiểu	Có thể có	Mục đích	Ghi chú
id	string		Định danh của control	Theo quy ước: `B_[tên nhóm]_[số thứ tự]`. Hệ thống tự resolve `TaId` bằng cách bỏ phần sau dấu `_` cuối cùng
Text	string		Nội dung hiển thị trên bar
CssClass	string	`xxx_de`, `xxx_ac`	Lớp CSS cho bar	Hậu tố `_ac` = đang được chọn, `_de` = mặc định

Chức năng

Tên	Kiểu	Mặc định	Có thể có	Mục đích	Thuộc tính mới	Ghi chú
ham	string		Tên hàm JS	Hàm JavaScript được gọi sau khi chuyển bar active

Khởi tạo

Quá trình render phía server (`OnPreRender`)

Gán ten_goc = ID lên thẻ.
Tìm control cha theo ID rút gọn (bỏ phần sau dấu _ cuối cùng, ví dụ B_menu_1 → tìm control B_menu). Nếu tìm thấy, gán TaId = ClientID của control cha đó.
Nếu ham có giá trị, gán attribute ham lên thẻ.
Gán onclick = "P_BAR(this);".

Attributes render ra client:

Attribute	Giá trị	Mô tả
`ten_goc`	`ID`	ID gốc của control
`TaId`	`ClientID` của container cha	Dùng để JS xác định nhóm bar
`ham`	Giá trị `ham`	Hàm callback (chỉ khi có)
`onclick`	`"P_BAR(this);"`	Sự kiện click chuyển bar

Chức năng JavaScript

`P_BAR(b_ctr)`

Xử lý sự kiện click chuyển trạng thái giữa các bar trong cùng nhóm:

Lấy CSS class hiện tại của bar được click, tách lấy phần tiền tố (bỏ hậu tố _ac/_de).
Nếu bar đang là _ac (đã active), không làm gì.
Tìm container cha qua TaId, duyệt tất cả <span> bên trong, tìm span đang có class _ac và đổi về _de.
Đổi class của bar được click thành _ac.
Nếu có attribute ham, gọi hàm callback qua eval(ham).

`TAB_Fs_tabA(b_ten) → string`

Trả về ten_goc của bar đang active trong nhóm có tên b_ten. Duyệt tất cả <span> trong vùng, tìm span có hậu tố _ac trong className.

var b_tabDangChon = TAB_Fs_tabA('B_menu'); // Vd: "B_menu_1"

Ví dụ

Khai báo thông thường:

<asp:Panel ID="B_menu" runat="server">
    <Cthuvien:bar ID="B_menu_1" runat="server" Text="Tổng hợp" CssClass="css_bar_ac" ham="bar_click_1()" />
    <Cthuvien:bar ID="B_menu_2" runat="server" Text="Chi tiết" CssClass="css_bar_de" ham="bar_click_2()" />
</asp:Panel>

Mã HTML sinh ra (Client):

<div id="ctl00_MainContent_B_menu">
    <span id="ctl00_MainContent_B_menu_1" class="css_bar_ac"
        ten_goc="B_menu_1"
        TaId="ctl00_MainContent_B_menu"
        ham="bar_click_1()"
        onclick="P_BAR(this);">Tổng hợp</span>
    <span id="ctl00_MainContent_B_menu_2" class="css_bar_de"
        ten_goc="B_menu_2"
        TaId="ctl00_MainContent_B_menu"
        ham="bar_click_2()"
        onclick="P_BAR(this);">Chi tiết</span>
</div>

Lấy bar đang active phía client:

var b_ten = TAB_Fs_tabA('B_menu'); // "B_menu_1"

Bar không có callback:

<Cthuvien:bar ID="B_ds_1" runat="server" Text="Danh sách" CssClass="css_tab_ac" />
<Cthuvien:bar ID="B_ds_2" runat="server" Text="Nhập liệu" CssClass="css_tab_de" />

Mô tả​

Thuộc tính​

Thuộc tính chung​

Chức năng​

Khởi tạo​

Quá trình render phía server (OnPreRender)​

Chức năng JavaScript​

P_BAR(b_ctr)​

TAB_Fs_tabA(b_ten) → string​

Ví dụ​