Skip to main content
B
bills89323792
Inspiring
September 29, 2016
Answered

How to control text entry box width with javascript?

  • September 29, 2016
  • 1 reply
  • 335 views

I'm using variables to position text entry boxes.  I've worked out how to shift them right/left but can't control their width, though I can do so for regular smart shapes:

 

var mybutton = document.getElementById("Text_Entry_Box_2c");

mybutton.style.left = textLeft2 + 'px';  // this works

mybutton.style.width = textWide2 + 'px';  //this doesn't work

 

Has anyone been able to do this?

This topic has been closed for replies.
Correct answer TLCMediaDesign

Your actual input field is:

var getEntry = document.getElementById("Text_Entry_Box_2_inputField");

getEntry.style.width = 250 + "px";

I've found that I need to use a setTimeout before the element is actually in the DOM.

1 reply

TLCMediaDesign
TLCMediaDesignCorrect answer
Inspiring
September 29, 2016

Your actual input field is:

var getEntry = document.getElementById("Text_Entry_Box_2_inputField");

getEntry.style.width = 250 + "px";

I've found that I need to use a setTimeout before the element is actually in the DOM.

B
bills89323792Author
Inspiring
September 29, 2016

That's fantastic, and it works w/ variables!

I had trouble using the same element name - "Text_Entry_Box_2_inputField") - to shift the position left, but it works fine for the width, so I'm just using two different pieces of code - one with "Text_Entry_Box_2_inputField" (for width), and one with  "Text_Entry_Box_2c" (for shift left).

Not very elegant, but it works.  Now is there a way to use JavaScript to control the maximum length of the text input field (i.e. max number of characters)?

Thanks for your help!

B
bills89323792Author
Inspiring
October 1, 2016

Okay - setting max characters was actually simple -  an example below:

window.cpAPIInterface.setVariableValue("textLong1",cloze6);

 

var getEntry1 = document.getElementById("Text_Entry_Box_1_inputField");

getEntry1.maxLength = textLong1;

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices