AJAX, JS - hide element if number of post is equal to zero

Question

In my Django project I want the table head will be hide if at my Database with posts is empty. Can you give advance how I should it implement at my project?

Thanks in advance!

Answer 1

After you receive the response from the ajax call...with plain javascript you can check if the response is empty or null and then use

document.getElementById(id).style.visibility = "hidden"; now if you want to again show the header then use after you receive the response

document.getElementById(id).style.visibility = "visible";

In this case, space is allocated on the page Check this for more details

Answer 2

Just change your rendering logic.

First store both button markup and table markup in an each variable. Eg: renderTable and renderButton

Then check for length of your ajax response result array. Display the table or button element with conditional operator as below:

var renderTable = `<table><thead>...</thead><tbody>...</tbody></table>`;
var renderButton = `<button>Create Table</button>`;
results.length > 0 ? renderTable : renderButton;