CODEWITHSUNDEEP
javascriptreactjsfilter
Hazel Noreen Castro
Hazel Noreen Castro

Reputation: 11

Filter condition in Reactjs

I'm trying to execute if the table has data or not. If there's data only that table will show the other will stay on no records found and vice versa. I feel like I'm wrong about my condition.

 render() {
    const { legal_records } = this.props;

    return (
      <div className="row">
        <div className="col">
          <div className="card">
            <div className="card-body">
              {legal_records.size ? (
                <div
                  className="table-responsive"
                  style={{ overflowX: "hidden", maxHeight: 600 }}
                >
                  <LegalService 
                    data={legal_records} 
                    onSettle={this.onSettle} 
                  />
                </div>
              ) : (
                <div className="no-content text-center my-3">
                  <i className="material-icons">find_in_page</i>
                  <h6 className="text-muted">No Record Found</h6>
                </div>
              )}
            </div>
            <div className="card-body">
              {legal_records.size ? (
                <div
                  className="table-responsive"
                  style={{ overflowX: "hidden", maxHeight: 600 }}
                >
                  <LegalDivision
                    data={legal_records}
                    onSelectPay={this.onSelectPay}
                  />
                </div>
              ) : (
                <div className="no-content text-center my-3">
                  <i className="material-icons">find_in_page</i>
                  <h6 className="text-muted">No Record Found</h6>
                </div>
              )}
            </div>
          </div>
        </div>
      </div>
    );
  }
}

Upvotes: 1

Views: 76

Answers (3)

Sam Gomena
Sam Gomena

Reputation: 1479

Assuming that legal_records is an object you could do something like this:

Object.entries(legal_records).length > 0

Which will determine whether or not an object has any items in it. See the docs on Object.entries(...) here.

Though, without knowing the type of legal_records it's hard to give an appropriate answer.

Upvotes: 0

Nacho Zullo
Nacho Zullo

Reputation: 571

Assuming that legal_records is an array:

legal_records.size should be legal_records.length

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/length

Upvotes: 1

Emilio
Emilio

Reputation: 389

If legal_records is an array, you need to access .length instead:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/length

change the condition to:

legal_records.length > 0

Upvotes: 1

Related Questions