Append JQuery value to input field instead of select option - html

I have already append the JQuery value to the select option but I want to append value to an input field, any solutions?
Select option:
<select name="c_email" class="form-control" ></select>
JQuery value append:
$('select[name="c_email"]').append('<option value="'+ value +'">'+ value +'</option>');
Instead of drop down select I want the value here in input field:
<input type="email" class="form-control" name="c_email" placeholder="">

$('input[name="c_email"]').val(value);
And you can target that input with any of these, or all to be more precise:
$('input[name="c_email"][type="email"].form-control')
var value="test";
$('input[name="c_email"]').val(value);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="email" class="form-control" name="c_email" placeholder="">

Related

How to check if a value is empty and return dummy text like NA

I have a input field that has data pulling form the database, however when the data base is empty the input field displays the disabled that is used to disable the field when not editable.
For example in my html:
<label for="fname">CompanyCode:</label>
<input type="text" id="fname" name="fname" value={{$id->CompanyCode}} disabled>
This above pulls data however if there is now data to pull it uses the "disabled" word as the value and then the field doesn't become disabled.
Can I use a condition to overcome this using something like:
<label for="fname">CompanyCode:</label>
<input type="text" id="fname" name="fname"
value= #if($id->CompanyCode) count() == 0)
<td colspan="5" class="text-center"> Nothing Found </td>
#endif
disabled>
I was able to get the answer :
<label for="fname">CompanyCode:</label
<input type="text" id="fname" name="fname" value="{{ $id->CompanyCode}}" {{$id->companyCode ? '' : 'disabled' }}>
I could have also added Quotations for the desired result aswell :
<label for="fname">CompanyCode:</label
<input type="text" id="fname" name="fname" value="{{ $id->CompanyCode }}" disabled>

Validation of the input fields

I have two input fields as shown below
<input type="number" name="number" placeholder="Enter minimum price">
<input type="number" name="number" placeholder="Enter maximum price">
<input type="submit">
want to validate always first input value must be less than the second input value.
You can Set it manually in html by max = "" min = "" in both field
or You can validate it in your function which is better way to handle it

html5 input datetime-local: optional time is possible?

I have this input field
<input type="datetime-local" required>
I would like the date part to be always required, but not the time part...
I tried with pattern, like
pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}.*"
but it doesn't seem to work...
any idea...
Edit:
I explain better here
<form name="test" method="POST" action="/">
<input type="datetime-local" name="event_date_start" id="event_date_start"
min="2011-06-07T00:00"
max="2099-06-14T00:00" required><br>
<input type="submit"/>
What I want is to use datetime, but time must be optional.
With the above example, submit is not allowed until you insert 00 in the time field..
I want to leave that optional...
No need for pattern just use the attributes min, max and value:
<input type="datetime-local"
value="2018-06-12T19:30"
min="2018-06-07T00:00"
max="2018-06-14T00:00" required>
If you want an inputfield with date only use:
<input type="date" required>
For time is optional:
<input type="date" required> <input type="time">

Fill the textbox value in angularJs

I have working on Edit Profile page in angular Js
Normally List of details will be show. When click on one list , I called the one method
$scope.editContact = function(user){
$('#editContactSection').show();
$scope.eUser = user;
}
Then I assigned the text box value by eUser
<input type="text" class="form-control" id="fname" ng-model="fname" name="fname" ng-minlength='3' value="{{eUser.firstname}}" required>
<div ng-show='editContacForm.fname.$error.minlength' class='error'>Enter atleast 3 characters</div>
Here i got the textbox value in input tag in console like value="somename".
Value is assigned correctly. But i can't see in textbox in browser window
And how to change the drop down list value. That drop down list value filled by angular js ng-repeat
Try setting ng-model='eUser.firstname'
as in
<input type="text" class="form-control" id="fname" ng-model="eUser.firstname" name="fname" ng-minlength='3' required>
Try this
$scope.editContact = function(user){
$('#editContactSection').show();
$scope.eUser = user;
$scope.fname = $scope.eUser.firstname;
}
Or
<input data-ng-init="fname=eUser.firstname" type="text" class="form-control" id="fname" ng-model="fname" name="fname" ng-minlength='3' required>
<div ng-show='editContacForm.fname.$error.minlength' class='error'>Enter atleast 3 characters</div>

Input text onkeyup ajax insert to mysql

I have a form, and i want to post it to mysql, without submit. I found out to post the values with ajax on every values. If i click on the one text field it inserts a new row to mysql and if i move to the next field it updates the mysql with my values. Is it possible?
My form:
<input type="text" maxlength="50" size="50" value="" name="name">
<input type="text" maxlength="50" size="50" value="" name="level">
<input type="text" maxlength="50" size="50" value="" name="pass">
<input type="text" maxlength="50" size="50" value="" name="date">
etc.
Create a hidden input with the id and give it no value, then on the submit on every keyup event, and if the id field is empty run an insert query and return the id, and update the id field with the value. If the value is not empty, run an update query with the form data. I provided an example using jQuery, but you could do the same thing without it. Ajax is just much easier with jQuery or any other library.
<input type='hidden' id='id' name='id' value=''/>
$('input').keyup(function(){
var data = $('#myform').serialize();
$.ajax({
type:'post',
data:data,
url:'...',
dataType:'json',
success:function(response){
var id = response.id;
if(typeof(id) != 'undefined'){
$('#id').val(id);
}
}
});
});