Why is textarea filled with mysterious white spaces?

Question

I have a simple text area in a form like so:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink">
<?php     if($siteLink_val) echo $siteLink_val;?> 
                                </textarea>

I keep getting extra white space in this text area. When I tab into it my cursor is like in the middle of the textarea and not in the beginning? What is the explanation?

Answer 1

Well, everything between <textarea> and </textarea> is used as the default value for your textarea box. There is some whitespace in your example there. Try to eliminate all of that.

Answer 2

Look closely at your code. In it, there are already three line breaks, and a ton of white space before </textarea>. Remove those first so that there are no line breaks in between the tags any more. It might already do the trick.

Answer 3

Open (and close!) your PHP tags right after, and before, your textarea tags:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?php
  if($siteLink_val) echo $siteLink_val;
?></textarea>

Answer 4

To make it look a bit cleaner, consider using the ternary operator:

<textarea><?=( $siteLink_val ? $siteLink_val : '' );?></textarea>

Answer 5

Also, when you say that the cursor is in the "middle" of the textarea, it makes me think you could also either have extra padding or text-align: center defined somewhere in your CSS.

Answer 6

I'm against HTML code mixed with PHP code.

However try this:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink">
<?php 
    if($siteLink_val) 
        echo trim($siteLink_val);
?> 
</textarea>

Answer 7

Make sure first that your $siteLink_val isn't returning white space as a value. The <textarea> element by default has an empty value so if the variable you're echo'ing for some reason has spaces, there's your problem right off the bat.

To make the code the absolute cleanest, I would suggest you could do something like this, allowing for some more flexibility later. I've made a function that returns either a NULL if the variable isn't present (what you seem to be aiming for in the original post) and the absolute value otherwise. Once you've made sure of your variable's contents, try this:

function build_siteLink_val() {
     if ( $siteLink_val ) {
          return $siteLink_val;
     }

     else {
          return "";
     }
}

$output_siteLink_val = build_siteLink_val();

And the following code in your textarea would now read:

<textarea style="width:350px; height:80px;" cols="42" rows="5" name="sitelink"><?=$output_siteLink_val?></textarea>

This is assuming your PHP install is configured for short-hand variable calls, as seen in the shortened "<?=?>" tags. If you cannot output this way, remember to preface your PHP code with "<?php" and close with "?>".

Avoid line breaks between <textarea>'s because it can create the potential of erroneous characters.

Also, check your CSS to make sure there isn't a padding rule pushing text inward.

Also, you specify a cols and rows value on the textarea, and then style a width and height. These rules are counter-productive, and will result in inconsistent visuals. Stick with either defining the size through style (I recommend giving the element a class) or the rows/cols.