[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 194
  • Last Modified:

hide rows in a table

I created a table,tr's and td's to display data.The first 5 rows are student personal info like name,address,gender,etc. From row 6 to 11 asked for student enrollment info like course,subject,schedule,etc.
I'd like to hide 6 to 11 if mo data entered and display if there is.
0
zachvaldez
Asked:
zachvaldez
1 Solution
 
Kyle HamiltonData ScientistCommented:
do you want to do this with javascript or server side?
0
 
dimmergeekCommented:
I assume you're pulling data from some type of database and then populating values into JavaScript variables?

Where is data coming from?
0
 
Julian HansenCommented:
Assuming you have a record you are working with - don't know what that is so will use generic

if (row[course] != '')
   output <td>row[course]</td>
else
   don't

The question is - do you want the rows to be there but just not visibile in which case you can add a class to the <tr class="hideme"> and then use

.hideme {display: none;}

To turn them off

OR

Do you not wish to output the row at all if the data is empty in which case you need to test your data and if empty don't output.

Without knowing more about your code can't really offer more than that.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
zachvaldezAuthor Commented:
in the page I have a button,it opens another page where the Student enrollment details are entered and saved. When the previous page is open this data  is seen in that page( this part I know how to display the data) When data is not entered in the 2nd page, the first page will hide the rows where the data should display.
So technically, when the page is open for the first time, rows 6 to 11 will be hide cause no data has been read for that ID, but will only display if data has been entered in the 2nd page. This part is read from the database so it will populate the first page.
0
 
zachvaldezAuthor Commented:
can you show javascript and server side? which is practical and easy to implement?
0
 
SamuelShawCommented:
The best way to do this would be to assign a class specific to those rows you want to show and hide dynamically. Each row of the form would have that class assigned.
<tr class="enrollForm">...</tr>

Open in new window


In your style definitions, set display to "none" for tr elements of that class.
tr.enrollForm { display: none }

Open in new window


You can then use JavaScript to set the display style for each row with that class whenever the button is clicked. jQuery makes this easy and the code below shows how.
$("tr.enrollForm").css("display", $("tr.enrollForm").css("display") == "none" ? "" : "none");

Open in new window

0
 
Julian HansenCommented:
Ok so in your first page all you need to do is determine if the data has been entered or not. If it has then out put the rows otherwise don't

For instance

row = get_row_from_db();

// output rows 1 - 5
<tr>
 <td>...</td>
</tr>
...
if (row != null) // data exists so data has been captured
   <tr>
      <td>data for row 6</td>
  </tr>
  <tr>
     <td>data for row 7</td>
  </tr>
 ...
endif

So basically on the server side you are not outputing the rows for 6-11 - when you come back to this page (the first page) after succesfully capturing details on the second page the if () above will evaluate to true so the remaining rows will be displayed.

Because you are controlling this on the server there is no reason to hide anything - just simply don't output the rows you don't need on the first view.
0
 
zachvaldezAuthor Commented:
Can you expand o this approach? I like this propose solution

("tr.enrollForm").css("display", $("tr.enrollForm").css("display") == "none" ? "" : "none");
0
 
Julian HansenCommented:
What are you trying to achieve with that line?

Looks like you are saying if display is set to none then set display to none - sort of redundant?
0
 
zachvaldezAuthor Commented:
Do you recommend server side or JavaScript?
0
 
Julian HansenCommented:
Server side is a lot simpler.
0
 
zachvaldezAuthor Commented:
Can you provide more details in your code julianH?
0
 
Julian HansenCommented:
What details do you need - you need to give us more information about your application - I have outlined the basicis of what you can do in an earlier post which is
$data = get_data_from_db();
// output the rows that you want based on some condition
echo "
<tr>
  <td>Row1" . $data['somefield'] . "</td>
</tr> ";
...
if ($data['somevalue'] != "")  {
   // output other rows
}

Open in new window

You need to provide more info on the specifics of what you are trying to do.
0
 
zachvaldezAuthor Commented:
Not the best solution
0
 
Julian HansenCommented:
Not the best solution
!!!
Did you see my last post
You need to provide more info on the specifics of what you are trying to do.
I can only assist you based on the input you give me!!!
0

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now