Getting Data In

How can I change the width and height of a TextInput?

petersso
Engager

I am trying to change the width and height of a form input (TextInput). The code for creating the form input is below:

var input5 = new TextInput({
"id": "input5",
"value": "$form.ID$",
"el": $('#input5')
}, {tokens: true}).render();

I would have assumed I'd be able to change the width and height by simply including something like the code below, but nothing has worked so far.

var input5 = new TextInput({
"id": "input5",
"value": "$form.ID$",
"style": "width:400px; height:300px",
"el": $('#input5')
}, {tokens: true}).render();

How would I change the width and height of a TextInput?

kbarker302
Communicator

Based on your example, you should be able to set the width and height using jQuery:

$('input5-input').css('width','400px');
$('input5-input').css('height','300px');

or CSS:

input#input5-input {
   width: 400px;
   height: 300px;
}

petersso
Engager

It seems like I'm only able to resize the div containing the input, but not the input itself.

Here's the code for my div:

`<div class="input input-text" id="input5"></div>`

Any other advice?

0 Karma

nikkkc
Path Finder

same problem here, is there any solutuon out there for this? thanks

0 Karma
Get Updates on the Splunk Community!

Splunk Mobile: Your Brand-New Home Screen

Meet Your New Mobile Hub  Hello Splunk Community!  Staying connected to your data—no matter where you are—is ...

Introducing Value Insights (Beta): Understand the Business Impact your organization ...

Real progress on your strategic priorities starts with knowing the business outcomes your teams are delivering ...

Enterprise Security (ES) Essentials 8.3 is Now GA — Smarter Detections, Faster ...

As of today, Enterprise Security (ES) Essentials 8.3 is now generally available, helping SOC teams simplify ...