Jump to content

How to handle Nulls to avoid collapsing


doubledee

Recommended Posts

I am using a Definition List in my PHP, and I just realized that when users do NOT complete optional fields, my HTML Definition List <dl> is "collapsing" due to Nulls being returned.

 

Here is  a snippet...

 

<dl>
	<dt>Joined:</dt>
	<dd>"
	. date('M Y' , strtotime($joinedOn)) .
	"</dd>

	<dt>Location:</dt>
	<dd>"
	. str2htmlentities($location) .
	"</dd>

	<dt>Posts:</dt>
	<dd>"
	. str2htmlentities($posts) .
	"</dd>
</dl>

 

 

The problem is that I do NOT want to store Empty Strings in my database and I'd hate to have to write some big IF-THEN-ELSE to handle when no value was entered.

 

This must be a fairly common problem, and I bet there are easier solutions that are coming to me at the moment!

 

Suggestions?

 

Thanks,

 

 

Debbie

 

Link to comment
Share on other sites

I know you don't want a bunch of php in your html, but this is an option to not show empty <dd>'s in the first place.

 

echo "<dl>";

	if (!empty($joinedOn)){
		echo "<dt>Joined:</dt>
		<dd>"
		. date('M Y' , strtotime($joinedOn)) .
		"</dd>";
	}

	if (!empty($location)){
		echo "<dt>Location:</dt>
		<dd>"
		. str2htmlentities($location) .
		"</dd>";
	}

	if (!empty($posts)){
		echo "<dt>Posts:</dt>
		<dd>"
		. str2htmlentities($posts) .
		"</dd>";
	}

echo "</dl>";

Link to comment
Share on other sites

You could also build this content above <html> then echo where needed.

$sidecontent = "<dl>";

	if (!empty($joinedOn)){
$sidecontent .= "<dt>Joined:</dt>
		<dd>"
		. date('M Y' , strtotime($joinedOn)) .
		"</dd>";
	}

	if (!empty($location)){
$sidecontent .= "<dt>Location:</dt>
		<dd>"
		. str2htmlentities($location) .
		"</dd>";
	}

	if (!empty($posts)){
$sidecontent .= "<dt>Posts:</dt>
		<dd>"
		. str2htmlentities($posts) .
		"</dd>";
	}

$sidecontent .= "</dl>";

Link to comment
Share on other sites

I know you don't want a bunch of php in your html, but this is an option to not show empty <dd>'s in the first place.

 

Thanks for the suggestion, but that is the whole point...

 

I *always* want to show...

 

Joined:
Location:
Posts:

 

They are placeholders that always need to show.  Whether people choose to answer them or not is up to them, but the layout needs to remain constant.

 

Thanks,

 

 

Debbie

 

Link to comment
Share on other sites

Would adding   fit the need?

 

	echo "<dl>

	<dt>Joined:</dt>
	<dd>"
	. (!empty($joinedOn) ? date('M Y' , strtotime($joinedOn)) : ' ') .
	"</dd>

	<dt>Location:</dt>
	<dd>"
	. (!empty($location) ? str2htmlentities($location) : ' ') .
	"</dd>

	<dt>Posts:</dt>
	<dd>"
	. (!empty($posts) ? str2htmlentities($posts) : ' ') .
	"</dd>

	</dl>";

Link to comment
Share on other sites

Would adding   fit the need?

 

	echo "<dl>

	<dt>Joined:</dt>
	<dd>"
	. (!empty($joinedOn) ? date('M Y' , strtotime($joinedOn)) : ' ') .
	"</dd>

	<dt>Location:</dt>
	<dd>"
	. (!empty($location) ? str2htmlentities($location) : ' ') .
	"</dd>

	<dt>Posts:</dt>
	<dd>"
	. (!empty($posts) ? str2htmlentities($posts) : ' ') .
	"</dd>

	</dl>";

 

Let me try your way.

 

I think we came to similar solutions.

 

This is what I just wrote which *seems* to fix my problem...

 

<dl>
<dt>Joined:</dt>
<dd>"
. date('M Y' , strtotime($joinedOn)) .
"</dd>

<dt>Location:</dt>
<dd>"
. (!empty($location) ? str2htmlentities($location) : '<br />') .
"</dd>

<dt>Posts:</dt>
<dd>"
. str2htmlentities($posts) .
"</dd>
</dl>

 

 

What do you think??

 

I tried isset() but that gets messed up if someone deletes out an answer and has a '' in a field.

 

Also, Drummin is being more thorough, but I just put my code on Location, since "joined On" and "Posts" should never be Null or 0 if you are Posting a Comment...

 

Feel free to scrutinize my code, though.

 

Thanks,

 

 

Debbie

 

Link to comment
Share on other sites

This is how it looks with the min-height:

5jr2j.jpg

 

And without it:

2EldV.jpg

 

Is that what you wanted?

 

<style type="text/css">dd { min-height:20px; }</style>

<dl>
<dt>Joined:</dt>
<dd></dd>

<dt>Location:</dt>
<dd></dd>

<dt>Posts:</dt>
<dd></dd>
</dl>

 

You images (??) have everything duplicated, so no!  :P

 

 

Debbie

 

 

Link to comment
Share on other sites

Just throwing this out there and it sounds like a jury rig but … assign your queried variables to a list and then use if statements or a loop inside the main loop if any to reassign the empty variable to   if needed.

 

Then you'll have a named variable with the value from the query or   to use in your results or in your while() loop.

Link to comment
Share on other sites

This is how it looks with the min-height:

5jr2j.jpg

 

And without it:

2EldV.jpg

 

Is that what you wanted?

 

<style type="text/css">dd { min-height:20px; }</style>

<dl>
<dt>Joined:</dt>
<dd></dd>

<dt>Location:</dt>
<dd></dd>

<dt>Posts:</dt>
<dd></dd>
</dl>

 

You images (??) have everything duplicated, so no!  :P

 

They are side-by-side representations of text vs no text....

Link to comment
Share on other sites

This is how it looks with the min-height:

5jr2j.jpg

 

And without it:

2EldV.jpg

 

Is that what you wanted?

 

<style type="text/css">dd { min-height:20px; }</style>

<dl>
<dt>Joined:</dt>
<dd></dd>

<dt>Location:</dt>
<dd></dd>

<dt>Posts:</dt>
<dd></dd>
</dl>

 

You images (??) have everything duplicated, so no!  :P

 

They are side-by-side representations of text vs no text....

 

HAH!!!!!!!!!

 

Is that what that was?!  *LOL*

 

Thanks, but I like Drummin's way best.

 

 

Debbie

Link to comment
Share on other sites

Simple CSS bug... just make your css something like:

dt {
    display: block;
}
dd {
    display: block;
    padding: 0;
    margin: 0 0 2px 20px;
}

 

And done...

 

I tried that and it doesn't work, although I thought it might when I tried it on my own this morning.

 

Drummin' still in the lead...  ;)

 

 

Debbie

 

 

Link to comment
Share on other sites

This is some competition to help you or something? Jeez, have some respect for those who help you.

 

All you needed to know was given to you in the first reply. It's not our job to dumb common mark-up issues down to specific examples. Perhaps you should focus on either design, or PHP, since you can't really master both.

 

Your solution, spoon-fed as provided by scootstah

<!DOCTYPE html>
<style type="text/css">
dd { min-height: 20px; }
</style>
<dl>
<dt>Joined:</dt>
<dd>"
	. date('M Y' , strtotime($joinedOn)) .
"</dd>

<dt>Location:</dt>
<dd></dd>

<dt>Posts:</dt>
<dd>"
	. str2htmlentities($posts) .
"</dd>
</dl>

 

Works on FF/Chrome/IE9

Link to comment
Share on other sites

I tried that and it doesn't work, although I thought it might when I tried it on my own this morning.

 

Drummin' still in the lead...  ;)

 

Debbie

Ok, here's another shot at it:

 

dt, dd {
    display: block;
    float: none;
    clear: both;
    min-height: 1em;
    margin: 0 0 2px;
    padding: 0;
}
dt {
    font-weight: bold;
}
dd {
    margin-left: 20px;
}

 

Of course, the   isn't a bad idea.  I'd probably go with that myself.

Link to comment
Share on other sites

This is some competition to help you or something? Jeez, have some respect for those who help you.

 

I said Drummin had the best solution.

 

Try reading.

 

 

Debbie

 

 

I wasn't arguing that - it was how you said it.

 

You should ask your CSS guru friends how they'd do it. You obviously aren't getting the help you need in our PHP forum.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.