How can I increase controls top size in form using java script

Question

0.00/5 (No votes)

See more:

design time we are design page with controls but we need to increase and decrease controls top size based on condition how can i resolve this by using javascript or jquery in asp.net, below mentioned my controls code some of controls i need to display default and some of controls i need to display based on condition but the controls allignment always top

What I have tried:

Quote:
<asp:label id="lblEmpID" style="Z-INDEX: 100; LEFT: 8px; POSITION: absolute; TOP: 42px" runat="server" CssClass="labelBoldClass">Employee ID
<asp:label id="lblDispEmpID" style="Z-INDEX: 115; LEFT: 136px; POSITION: absolute; TOP: 42px" runat="server" CssClass="fieldClass">Employee ID
<asp:label id="lblFirstName" style="Z-INDEX: 100; LEFT: 8px; POSITION: absolute; TOP: 74px" runat="server" CssClass="labelBoldClass">First Name
<asp:textbox id="txtFirstName" style="Z-INDEX: 115; LEFT: 136px; POSITION: absolute; TOP: 72px" runat="server" Width="250px" MaxLength="14" CssClass="fieldClass" tabIndex="1">
<cc1:AbraRequiredFieldValidator ID="arfvFirstName" ControlToValidate="txtFirstName" style="LEFT: 126px; POSITION: absolute; TOP: 77px" runat="server">
<asp:label id="lblMiddleName" style="Z-INDEX: 116; LEFT: 8px; POSITION: absolute; TOP: 106px" runat="server" CssClass="labelBoldClass">Middle Name
<asp:textbox id="txtMiddleName" style="Z-INDEX: 113; LEFT: 136px; POSITION: absolute; TOP: 106px" tabIndex="2" runat="server" Width="250px" MaxLength="14" CssClass="fieldClass">
<asp:label id="lblLastName" style="Z-INDEX: 101; LEFT: 8px; POSITION: absolute; TOP: 138px" runat="server" CssClass="labelBoldClass">Last Name
<asp:textbox id="txtLastName" style="Z-INDEX: 111; LEFT: 136px; POSITION: absolute; TOP: 138px" tabIndex="3" runat="server" Width="250px" MaxLength="25" CssClass="fieldClass">

Posted 4-Oct-18 3:49am

Member 13995256

Updated 4-Oct-18 4:13am

Add a Solution

Comments

ZurdoDev 4-Oct-18 10:09am

I would suggest googling how to change css properties using jQuery.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

littleGreenDude · Answer 1 · 2018-10-04T04:14:00

Use the control's id and set the top with css. For example (JQuery), let's say you wanted to increase the top of the first name label by 250

JavaScript

var newtop = $('#lblFirstName').position().top + 250;
$('#lblFirstName').css('top', newtop + 'px');

Please keep in mind that ASP will change the lables and you will have to account for that. You would probably be better off applying a common class to the elements you want to adjust and then you could adjust all fields at once by reference the class.

var newtop = $('.adjustabletopclass').position().top + 250;
$('.adjustabletopclass').css('top', newtop + 'px');