Cách ẩn nút trong html dựa trên điều kiện

Tôi đang cố ẩn nút gửi nếu nhân viên không có giấy phép săn bắn hợp lệ. Khi ID của nhân viên (. employeeID) được nhập tên của họ và trạng thái thợ săn hợp lệ được điền từ tra cứu cơ sở dữ liệu. Nếu cơ sở dữ liệu trả về cho Thợ săn hợp lệ (. hideSubmit) không bằng Có, sau đó tôi muốn ẩn nút Gửi. Tôi muốn kiểm tra điều này cho từng nhân viên được nhập vào bộ sưu tập. JavaScript tôi hiện đang sử dụng hoàn toàn không hoạt động. Ai đó có thể vui lòng giúp tôi với JavaScript này không?

$(document).ready(function(){
  
  $('.employeeID input').change(function(){

    if($('.hideSubmit').val() !== "YES") {

      $('.Submit').hide();
    }

    else{

      $('.Submit').show();
    }
  });
});

Cách ẩn nút trong html dựa trên điều kiện

0 0

Đăng liên kết

CÂU TRẢ LỜI ĐƯỢC CHỌN

đã trả lời vào ngày 17 tháng 5 năm 2021 Hiển thị lịch sử phiên bản

Thay vì sử dụng JavaScript để ẩn/hiện nút, tôi luôn sử dụng phương pháp sau

1) Sử dụng CSS để ẩn nút Gửi tích hợp

.Submit {
  display: none !important;
}

 

2) Thêm phần tử HTML tùy chỉnh bằng nút của riêng tôi

<button id="submitBtn" type="button">Submit</button>

(Bạn có thể thêm CSS để tạo kiểu cho nó theo cách bạn chọn)

#submitBtn {
  width: 100px;
  height: 30px;
  color: #000000;
  border-color: #404040;
  border-width: 1px;
  border-style: solid;
  background: #00ff00;
}

 

3) Thêm JavaScript để liên kết nút tùy chỉnh với nút mặc định

$(document).ready(function(){
  $('#submitBtn').on('click', function(){
    $('.Submit').click();
  });
});

 

4) Sử dụng Quy tắc trường để hiển thị/ẩn nút tùy chỉnh của bạn

 

Tuy nhiên, vì bạn đang xử lý một bộ sưu tập nên bạn sẽ muốn lật điều kiện để nó Ẩn nút khi bất kỳ trường nào không bằng Có (i. e. , chỉ hiển thị khi TẤT CẢ đều có)

 

 

Để hiểu rõ hơn, có một số lý do khiến mã hiện tại của bạn không hoạt động

  1. Trình xử lý sự kiện tùy chỉnh được đính kèm khi tải trang, vì vậy bất kỳ nhóm bộ sưu tập nào được thêm sau đó sẽ không có các trình xử lý đó. Để giải quyết vấn đề này, bạn cần sử dụng ủy quyền sự kiện.  
  2. $('. hideSubmit') có một số vấn đề. Đầu tiên, nó đang chọn vùng chứa chính, không phải đầu vào trong vùng chứa chính. Thứ hai, không có gì trong đó để cho nó biết nên chọn cái nào vì có thể có nhiều cái trong bộ sưu tập
  3. Bởi vì điều kiện của bạn chỉ đang kiểm tra một giá trị, nên ngay cả khi một trong các trường mục tiêu của bạn có giá trị Có, thì nó vẫn hiển thị nút khi các giá trị khác có thể không hợp lệ

 

Đối với hai vấn đề đầu tiên, bạn có thể xem bài đăng sau đây để xem một số ví dụ về ủy quyền sự kiện và cách tham chiếu các trường "anh chị em" trong mỗi nhóm bộ sưu tập

Bảng và bộ sưu tập Trình xử lý sự kiện JavaScript - Laserfiche Answers

Đối với mục cuối cùng, bạn cần kiểm tra từng trường "Thợ săn hợp lệ" mỗi lần để đảm bảo rằng tất cả đều đúng trước khi quyết định ẩn hay hiển thị (đây là một phần lý do sử dụng nút html tùy chỉnh và quy tắc trường là

0 0

Đăng liên kết

đã trả lời vào ngày 22 tháng 12 năm 2021

Jason,

Có cách nào để xóa phần màu trắng (nền) nơi các nút gửi/từ chối mặc định thường xuất hiện không?

Xin chào SUJAYS,

Không thể tạo mẫu bằng điều khiển Telerik. Vì vậy, tôi đã sử dụng điều khiển ASP

Kiểm tra ví dụ này. Bây giờ hãy tham khảo và sửa mã của bạn

HTML



    
        
            
                
            
        
        
            
                
            
        
        
            
                
            
        
        
            
                
            
        
    

Mã số

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        System.Data.DataTable dt = new System.Data.DataTable();
        dt.Columns.AddRange(new System.Data.DataColumn[] { 
                        new System.Data.DataColumn("Id", typeof(int)),
                        new System.Data.DataColumn("Name", typeof(string)),
                        new System.Data.DataColumn("Country",typeof(string)) });
        dt.Rows.Add(1, "John Hammond", "United States");
        dt.Rows.Add(2, "Mudassar Khan", "India");
        dt.Rows.Add(3, "Suzanne Mathews", "France");
        dt.Rows.Add(4, "Robert Schidner", "Russia");
        GridView1.DataSource = dt;
        GridView1.DataBind();
    }
}

VB. Bọc lưới

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As System.Data.DataTable = New System.Data.DataTable()
        dt.Columns.AddRange(New System.Data.DataColumn() {
                            New System.Data.DataColumn("Id", GetType(Integer)),
                            New System.Data.DataColumn("Name", GetType(String)),
                            New System.Data.DataColumn("Country", GetType(String))})
        dt.Rows.Add(1, "John Hammond", "United States")
        dt.Rows.Add(2, "Mudassar Khan", "India")
        dt.Rows.Add(3, "Suzanne Mathews", "France")
        dt.Rows.Add(4, "Robert Schidner", "Russia")
        GridView1.DataSource = dt
        GridView1.DataBind()
    End If
End Sub

Ảnh chụp màn hình

Cách ẩn nút trong html dựa trên điều kiện

Làm cách nào để ẩn một nút dựa trên điều kiện trong HTML?

Để tắt một nút trong JavaScript dựa trên điều kiện, hãy sử dụng thuộc tính “disabled” với thuộc tính “length” , thuộc tính này sẽ áp dụng .

Làm cách nào để ẩn một nút bằng CSS?

Bạn có thể ẩn phần tử trong CSS bằng cách sử dụng hiển thị thuộc tính CSS. không có hoặc khả năng hiển thị. ẩn . trưng bày. không xóa toàn bộ thành phần khỏi trang và mat ảnh hưởng đến bố cục của trang. hiển thị. hidden ẩn phần tử trong khi vẫn giữ nguyên không gian.

Làm cách nào để ẩn nút sau khi nhấp vào HTML?

Để ẩn nút sau khi nhấp vào nút đó. .
Thêm trình xử lý sự kiện nhấp chuột vào nút
Mỗi lần nhấp vào nút, đặt kiểu của nó. hiển thị thuộc tính thành không
Khi thuộc tính hiển thị được đặt thành none , phần tử sẽ bị xóa khỏi DOM

Làm cách nào để ẩn một nút trong JavaScript?

"Phong cách. display” đặt loại hiển thị của phần tử được chỉ định. Kỹ thuật này có thể được triển khai để ẩn nút đã tạo bằng cách tìm nạp id được chỉ định của nó và đặt “none” làm loại hiển thị . Ở đây, thuộc tính hiển thị của “Đối tượng” được đặt là “không có”.