How to assign javascript variable value to HTML Attribute?

Question

I am having 2 text box.. Value of first text box should been an length of second text box.. Eg: If user gives First text box value as "10", then my second text box should not allow user to type more than 10 characters..

Here is my code..

function field_length() {
  var fieldValue = document.getElementById('Length').value;
  alert(fieldValue);
}

<input type="text" name="Length[]" maxlength="2" class="required" id="Length" onkeypress="return isNumberKey(event);" placeholder="Field length" class="form-control">
<input type="text" name="Label[]" class="required" id="Label" maxlength="" onClick="field_length();" placeholder="Field Label" class="form-control">

In this code what i did was.. if user is gives value for first field as "5", on tap of second field it will alert the value.. But i want that value to be assigned to Maxlenght attribute. Give me some idea..

try this document.getElementById("yourID").maxLength .. L should be capital. And please do some research before asking such easy questions as there are already so many posts available if you google it .. thanks — Mittul At TechnoBrave
– Mittul At TechnoBrave, Commented Oct 27, 2016 at 5:58
@MayankVadiya he wants to achieve this using javascript as per what his code suggests .. — Mittul At TechnoBrave
– Mittul At TechnoBrave, Commented Oct 27, 2016 at 6:01

selami · Accepted Answer · 2016-10-27 06:01:29Z

5

Get length and set maxLength attribute.

function field_length(){
   var length = $("#Length").val();
  $("#Label").attr("maxlength", length)
}

answered Oct 27, 2016 at 6:01

selami

2,4981 gold badge21 silver badges26 bronze badges

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

Comments

Rajesh Patel · Accepted Answer · 2016-10-27 06:01:54Z

1

You can use setAttribute
<script type="text/javascript">
     function field_length()
    {
     var fieldValue= document.getElementById('Length').value;
    document.getElementById("Label").setAttribute('maxlength',fieldValue);
     }
    </script>


<input type="text" name="Length[]" maxlength="2"  class="required" id="Length" onkeypress="return isNumberKey(event);" placeholder="Field length"  class="form-control">
<input type="text" name="Label[]" class="required" id="Label" maxlength="" onClick="field_length();" placeholder="Field Label" class="form-control">

answered Oct 27, 2016 at 6:01

Rajesh Patel

2,0461 gold badge17 silver badges22 bronze badges

Comments

Mayank Pandeyz · Accepted Answer · 2016-10-27 06:03:13Z

0

Try this:

$("#Label").attr("maxlength", length);

or

$("#Label").prop("maxlength", length);

NOTE:

As of jQuery 1.6. , the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.

answered Oct 27, 2016 at 6:03

Mayank Pandeyz

26.3k4 gold badges43 silver badges61 bronze badges

Collectives™ on Stack Overflow

How to assign javascript variable value to HTML Attribute?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related