Develop Reference

Laravel: how to fixed Null input when i add a variable from jquery?

I have this
<input type="number" disabled name="amount" id="amount" placeholder="0.00" >
and this Jquery
$('#amount').val(100);
it goes smoothly and it shows in the UI. my problem is when I submit the button the value of $request->amount is null? how can I fix it? please help and save my day guys. thank you

Instead of disabled use readonly
<input type="number" name="amount" id="amount" placeholder="0.00" readonly>

Prevent an input type box from being typed in

I have a datepicker with input box. When clicking the box, the calendar widget (Bootstrap Datepicker) shows. I want to prevent that a user can type anything in the box, meaning he is forced to select from the calendar. How to do?
I tried using 'disable' but that disables it all.
<div class="input"><label for="date posted">Date posted</label>
<input class='datepicker' id="date-posted" name="date-posted" placeholder="Enter your date posted" required="" type="text"></div>

Just disable the keydown event:
<input onkeydown="return false" class='datepicker' id="date-posted" name="date-posted" placeholder="Enter your date posted" required="" type="text"></div>
Or if you are using that bootstrap picker then you can make the input readonly and enable the flag of enableOnReadOnly

$(".datepicker").keydown(function() {
return false;
})
Or you can use readonly attribute

How can I submit disable input element in a form?

This input tag is disabled but I want to submit this form value.
<input type="text" name="quantity" value="400" class="field left" disabled />
Please help me about this tag. Thanks in advance.

Try using readonly instead of disabled
<input type="text" name="quantity" value="400" class="field left" readonly />
If you still want it grayed out, you can set a background color:
<input type="text" name="quantity" value="200" style="background-color: #f0f0f0;" readonly />

Use hidden field.
<input type="hidden" name="quantity" value=400>
Disabled one can be there too, just remove the name attribute.
<input type="hidden" name="quantity" value=400>
<input type="text" value="400" class="field left" disabled>

Take hidden field
<input type="hidden" name="quantity" value="400" class="field left"/>
So it will not be visible and it will also be submitted in the form

Use read-only and hidden to do this as disabled values cannot be submitted.If you do not want the user to edit the values ,then use a text element instead and read its value along the form using onsubmit attribute of form tag.

Jquery UI Datepicker does not focus input

I am trying to create a form using the jquery ui datepicker.
Everything works perfectly except that since I changed the design of the input fields the placeholder attribute is not removed when a date is picked.
Here is the fiddle: https://jsfiddle.net/deqguphb/
HTML
<form>
<ol>
<li>
<input id="input1" name="input1" value="" placeholder="Input1: Working just fine"/>
<label for="input1">Input1</label>
</li>
<li>
<input id="input2" name="input2" value="" placeholder="Input2: The placeholder stays" />
<label for="input2">Input2</label>
</li>
<li>
<input id="input3" name="input2" value="" placeholder="Input3: The placeholder stays" />
<label for="input3">Input3</label>
</li>
</ol>
</form>
Javascript
/* The focus effect */
$("input:not([value]),input[value='']").addClass('empty');
/* Input event handling */
$('input').on('input keyup', function() {
$(this).toggleClass('empty', !Boolean($(this).val()));
});
I do not know what event is fired after a date is picked. I tried with onKeyup and onChange but that did not solve the problem.
I would be beyond happy for a solution on this.

I have updated your fiddle,
I have added two events to your each of the textbox for place holder.
onfocus="this.placeholder = ''" onblur="this.placeholder = 'Input1: Working just fine'"
Fiddle is : https://jsfiddle.net/deqguphb/4/
You need to use focus and blur event for textbox.
Hope this will help you :)

loop focus of input fields inside a form

<form>
<input tabindex="1" required>
<input tabindex="2" required>
<input>
<input tabindex="3" required>
<input>
<input tabindex="4" required>
<input tabindex="5" required>
<button type="button" tabindex="6"></button>
<button type="submit" tabindex="7"></button>
</form>
Here I have a form with some input fields and two button at the end of the form... and I am using tabindex attribute to focus them in order... now on tab key down I need to focus the first input field with tabindex="1" after release focus from the submit button as like as the form focus input field of tabindex="3" after releasing focus from input field of tabindex="2"... How can I do that...??
please don't use any jQuery... only javascript or html...

Black Cobra's answer works, unless you're using your id attributes for something (which I was). It's easy enough to edit his code to work for anyone though:
<form>
<input tabindex="2" autofocus required>
<input tabindex="3" required>
<input>
<input tabindex="4" required>
<input>
<input tabindex="5" required>
<input tabindex="6" required>
<button type="button" tabindex="7"></button>
<button type="submit" tabindex="8" id=""
onFocus="this.tabIndex=1;"
onBlur="this.tabIndex=8;">
</button>
</form>
I just changed this:
onFocus="this.id=this.tabIndex;this.tabIndex=1"
onBlur="this.tabIndex=this.id">
to this:
onFocus="this.tabIndex=1;"
onBlur="this.tabIndex=8;">
It's not dynamic, but it's really easy. If you want dynamic, see here.

Finally, I have solved my problem... with HTML and a little javascript it can be done easily... means loop focus of input fields inside a form...
<form>
<input tabindex="2" autofocus required>
<input tabindex="3" required>
<input>
<input tabindex="4" required>
<input>
<input tabindex="5" required>
<input tabindex="6" required>
<button type="button" tabindex="7"></button>
<button type="submit" tabindex="8" id=""
onFocus="this.id=this.tabIndex;this.tabIndex=1"
onBlur="this.tabIndex=this.id">
</button>
</form>
Here I skip the tabindex="1" and start with tabindex="2"... then I add 2 more attribute in the submit button... onFocus & onBlur... moreover, I am using the id attribute to memory the primary or real tabindex number of the submit button... when the user will focus on the submit button, javascript will change its tabindex from 8 to 1... now if the user hit the tab button the form will try to find out the element that have the next tabindex... means the first input field... again, when the focus will leave the submit button, javascript will retrieve its real tabindex from its id... means the tabindex will be changed from 1 to 8... in this way the focus will keep looping inside the form...
Live Demo