Making ASP label visible in Javascript?

Question

This is my label I want to display if the user have left out field before clicking the button. What am I doing wrong because nothing is happening when I click the button.

<asp:Label ID="lblError" runat="server" 
Text="* Please complete all mandatory fields" style="display: none;" >
</asp:Label>

This is the function I call when I click on the button:

function valSubmit(){
    varName = document.form1.txtName.value;
    varSurname = document.form1.txtSurname.value;

    if (varName == "" || varSurname == "") 
    {
     document.getElementById('lblError').style.display = 'inherit'; 

    }
    else
    { 

     .................other code go here...........................
    return true; 
    }

}

Mike Kingscott · Accepted Answer · 2010-01-06 14:18:05Z

4

Why not use the Validation controls? These will give you client and server side validation out of the box - not that I'm lazy or anything... ;-)

Edit for comment:

The RequiredFieldValidator can be set to display a single red asterisk by the side of each control, and a validation summary control could be used BUT that would take up space.

So, it's possible that ASP.Net is renaming your control, so your JS should read:

document.getElementById('<%= lblError.ClientID %>').style.display = 'inherit';

Give that a go...

Personally, I'd still use the Validator controls ;-)

edited Jan 6, 2010 at 14:18

answered Jan 6, 2010 at 14:10

Mike Kingscott

4771 gold badge5 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Etienne Over a year ago

Space is a problem on my form, it is a very small pop up form.

Mike Kingscott Over a year ago

Incidentally, if space is a premium, you could use a Custom Validator to check the state of each control and the display of the error message would be taken care of by the Custom Validator as well. You would have to write your JS as previously mentioned (the ClientID) and you would also have to write some corresponding server-side validation in case your visitor has turned off JavaScrript - something your OQ will fall down on.

Mike Kingscott Over a year ago

Meant to mention this as well: if your are using the Validation controls, make sure you check Page.IsValid in your code before performing any operations that rely on that valid data, mmm'kay?

Mike Kingscott Over a year ago

Hi Etienne, could you please post the source of the html page that is generated by your ASPX page? I would like to see what is being emitted by the controls and what's being put in your JS.

Bill the Lizard · Accepted Answer · 2011-06-22 20:20:27Z

1

You shouldn't be using lblError as an ID in JavaScript code. Instead you should use:

'<%= lblError.ClientID %>'

Of course this is only possible if you are generating the JavaScript code in the ASP.NET file.

edited Jun 22, 2011 at 20:20

Bill the Lizard

407k213 gold badges579 silver badges892 bronze badges

answered Jan 6, 2010 at 14:13

kgiannakakis

104k28 gold badges163 silver badges197 bronze badges

Comments

score 0 · Accepted Answer · 2010-01-07 18:55:11Z

on your desired event use this

document.getElementById('<%= lblError.ClientID %>').style.display = ""; or
document.getElementById('<%= lblError.ClientID %>').style.display = "block"

ok then try this, instead of client side, make it serverside. First set it invisible like , on formload event set invisible using lblEror.visible = false and remove style ="display:none" from html. Then on the desired event/s make it visible and after processing again invisible.

If you want it strictly thorugh js.try this workaround. remove style from asp label. on body onload make it disable from some js function. now on the btn click event make it visible using the method something like this

    function Validate()
    {
         var objLbl = $get('<%=lblError.ClientID%>');
         if (validations fails)
         {
             objLbl.style.display = ""; //displays label
             return false;
         }
         else
         {
             objLbl.style.display="none" //hides label
             return true;
         }
    }
<asp:button id="btnValidate" runat="server" onclientclick="return validate();"/>

Hope this will work

maxp · Accepted Answer · 2010-01-06 14:17:09Z

-1

Take a look at jquery, you can select by classes instead of id's which will never be altered when rendered onto the page (unlike id's)

answered Jan 6, 2010 at 14:17

maxp

25.2k41 gold badges132 silver badges207 bronze badges

Collectives™ on Stack Overflow

Making ASP label visible in Javascript?

4 Answers 4

4 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related