We Keep Coding

jQuery: Make a text input box selected

You know how when you open a new tab, you can start typing without having to select the search bar? I've got a text input box in HTML, and I'd like to be able to open my webpage and have that text input box immediately typeable, for lack of a better term. Say my input box looks like this:
<input type="text" class="myInput" value="add an item"></input>
I'm using HTML, CSS and JavaScript/jQuery right now. What code can I add to make sure the text input box is immediately typeable?

Use autofocus:
<input type="text" class="myInput" value="add an item" autofocus/>
From the input documentation on MDN:
This Boolean attribute lets you specify that a form control should have input focus when the page loads, unless the user overrides it (e.g. by typing in a different control). Only one form element in a document can have the autofocus attribute, which is a Boolean. It cannot be applied if the type attribute is set to hidden (that is, you cannot automatically set focus to a hidden control). Note that the focusing of the control may occur before the firing of the DOMContentLoaded event.

<input type="text" class="myInput" value="add an item" autofocus>
https://www.w3schools.com/TAgs/att_input_autofocus.asp

in html use autofocus, in jquery use $('.myInput').focus()

Select specific text within an INPUT text field on change with JQuery Trigger

I have this input text field and I would like to select (highlight really) the first 3 characters, when it changes.
<input class="descriptions" value="temp text"/>
And I have this script monitoring the onChange event...
$(document).on('change','.descriptions',function(event) {
event.target.focus();
event.target.setSelectionRange(0,3);
});
When I manually change the text in this input text field, the script works. However, when I trigger the event using Jquery and a link, it does NOT:
<a onMouseDown="javascript:$('.descriptions').val('test text');
$('.descriptions').trigger('change');">update input</a>
I thought they were virtually the same! I did notice that if I log the event.target to the console, the output is not quite exactly the same.
Any thoughts?

You didn't show all your code together, but this code does what you are after:
$('.descriptions').on('change', function(event){
event.target.focus();
event.target.setSelectionRange(0,3);
});
$('#lnkChange').on("click", function(){
$('.descriptions').val("changed text");
$('.descriptions').trigger("change");
});
$('#btn').on("click", function(){
$('.descriptions').trigger("change");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="descriptions">
Change text of input
<input type="button" id="btn" value="Trigger Change Event Only">

Angular JS getting a value to appear in an input text

I have this value here:
{{step1.$valid}}
which returns false. What I am trying to do is get the text "false" to appear in an input text box:
<input type="text" ng-model="user.stepValidation" ng-value="{{step1.$valid}}"/>
I have also tried value and ng-bind and neither of these get the value from {{step1.$valid}} to appear in my input text...please help.

Try this:
<input type="text" ng-model="user.stepValidation.step1.$valid"/>
Here's a Fiddle.

Textboxes to show and edit data

I currently have text boxes that have the border removed so they don't appear as text boxes and are read only. I also have an edit button that shows the border and allows a user to edit the information and save it to a database.
My question should I be displaying data in a text box? It just makes it easier to edit otherwise I would have to add the text box dynamically when the edit button is clicked.

Another option is a 'span' or 'div' with the html5 attrtibute 'contenteditable' set to true;
<div contenteditable="true"/>
You can toggle true/false on click button event.

You could just use a div tag and load your output there.
<div id="output"></div>
It would remain invisible until used, and it would not be editable, and of course you could mark it up any way you like if you want the output area to stand out later.

You can try like this with jquery-
Html :
<input type="text" id="data" disabled="true" value="sampel data"/>
<input type="button" id="button" value="Edit" />
Jquery:
$("#button").click(function(){
$("#data").attr("disabled", false);
});
Live Preview

How to select the content inside a textbox when loading the page?

I'm working on an application, and I want a text field to be selected when the page is loading so that when a user uses Ctrl + v it paste the content inside the textbox. Any one knows how to do that?
the text field is
<div>
<input wicket:id="email-address" type="text" id="textbox-email" />
</div>
Thanks!

3p3r answer is of course perfectly right. If you want this to be reusable and contolled via wicket, than please check the wicket wiki page.

You can use HTML5's autofocus attribute:
<input type="text" autofocus />
Works of course for just one field.

you should set focus to your input:
document.forms['your_form'].elements['your_textbox'].focus();
For your example above:
document.getElementById('textbox-email').focus()
After it gained focus, you should select it:
either add this onfocus attribute to your inputs (better)
<input type="text" onfocus="this.select()" />
Or use this jQuery snippet (best):
$(document).ready(function() {
$("#textbox-email").focus(function() { $(this).select(); } );
});
Pure Javascript:
var element = document.getElementById('textbox-email');
element.onfocus = function() {element.select();}
document.getElementById('textbox-email').focus();
Add the whole thing to window.onload or onload attribute of body tag.