CODEWITHSUNDEEP
asp.netjavascript
Shantanu Gupta
Shantanu Gupta

Reputation: 21198

Will this code work? Javascript/asp.net (Code not working)

        <td class="style4">
            <input type="text" ID="txtFirstName" runat="server" maxlength="50"
            class="DefaultTextbox" style="width:180px;" value="First Name" 
            onfocus="if(this.value=='First Name') {this.value = '';document.getElementById('spanFirstName').visible=false;}"
            onblur="if(this.value=='') this.value = 'First Name'"
            />
        </td>
        <td>
             <span id="spanFirstName">Should be less than 50 characters.</span>
        </td>

I want to do something like this

onfocus = "if(this.value=='First Name') 
{
    this.value = '';
    document.getElementById('spanFirstName').visible=false;
}"
onblur = "if(this.value=='') this.value = 'First Name'"

Upvotes: 0

Views: 96

Answers (2)

rahul
rahul

Reputation: 187050

I think you are looking for a TextBoxWatermark. Here is a nice one

Create Textbox Watermark Using CSS and JavaScript

For your code you can do like this

<script type='text/javascript'>
function HideSpan(elem)
{
    if ( elem.value == 'First Name' )
    {
        elem.value = '';
        document.getElementById("spanFirstName").style.visibility = 'hidden';   
    }   
}

function SetText(elem)
{
    if ( elem.value == '' )
    {
        elem.value = 'First Name';
            document.getElementById("spanFirstName").style.visibility = 'visible';
    }   
}

</script>
<table>
<tr>
      <td class="style4">
            <input type="text" ID="txtFirstName" runat="server" maxlength="50"
            class="DefaultTextbox" style="width:180px;" value="First Name" 
            onfocus="HideSpan(this);" onblur="SetText(this);"
            />
        </td>
        <td>
             <span id="spanFirstName">Should be less than 50 characters.</span>
        </td>
</tr>
</table>

Upvotes: 1

Sarfraz
Sarfraz

Reputation: 382696

I don't know asp.net but after looking at your code at this line:

document.getElementById('spanFirstName').visible=false;

I think it can be replaced with below line:

document.getElementById('spanFirstName').style.visibility='hidden';

Not sure, but that is how we do it, and that can be possibly the cause of the issue.

Thanks

Upvotes: 1

Related Questions