I have a spring boot application that is sending an entity to the browser with a LocalDate field, the form field that receives this value in the browser is a jquery ui datepicker, I have added js code to format it to the same format but for some reason when I send today's date (June 5th 2020) it displays as MM/dd/yyyy even tough the value in the html source code seems to be correct. Any idea how to fix the display on the jquery ui datepicker?
Entity date field
#DateTimeFormat(pattern = "dd/MM/yyyy")
#Column(name = "data",columnDefinition = "DATE")
private LocalDate data;
Controller code piece
LocalDate myDate = LocalDate.now();
//this is the entity being sent to browser
Expense myExpense = new Expense();
myExpense.setData(myDate);
model.addAttribute("expense",myExpense);
Java script for datepicker
$(document).ready(function(){
$("#data").datepicker();
$("#data").datepicker( "option", "dateFormat", "dd/mm/yy" ).val();
});
In the link is a picture of the date displayed incorrectly as MM/dd/yyyy for (June 5th 2020) as if it was (May 6th 2020)
Html data source
<div class="form-group row">
<label for="data" class="col-sm-4 col-form-label">Data</label>
<div class="col-sm-8">
<input type="text" class="form-control text-info" id="data" required name="data" value="05/06/2020"/>
</div>
</div>
I have a form with datetime_local html5 datetime input so that mobile users can use their native datetime picker instead of a jquery substitute which is generally clunkier.
I want the user to be able to select multiple dates.
So far I'm using the onchange trigger to capture the selected datetime and add it to an array. I then try and paste the array into the datetime input so it can be sent with the form.
With one date, it pastes fine, with more than one the input goes blank.
var datearray = [];
$(document).on('change','#mobile_gig_date',function(){
var date = $("#mobile_gig_date").val();
datearray.push(date);
console.log(datearray.join('; '))
$("#mobile_gig_date").val(datearray);
});
The HTML element is;
<input min="2017-09-01T00:00:00" discard_seconds="true" placeholder="Enter the gig date" id="mobile_gig_date" type="datetime-local" name="gig[date]">
Is there a way to add an array to a datetime input, and if so, in what format?
Since your input has the type datetime-local you can't put inside something that is not of that type.
Note that you also tried to put array inside an input - and you can't do this (what you can do is convert your array to string using JSON.stringify and use that value).
I added another hidden input and used it to save the data of your array.
var datearray = [];
$(document).on('change','#mobile_gig_date',function(){
var date = $("#mobile_gig_date").val();
datearray.push(date);
console.log(datearray.join('; '))
$("#mobile_gig_date_temp").val(JSON.stringify(datearray));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input min="2017-09-01T00:00:00" discard_seconds="true" placeholder="Enter the gig date" id="mobile_gig_date" type="datetime-local" name="gig[date]">
<input type="hidden" value="" name="gig[date_temp]" id="mobile_gig_date_temp" />
I have one input field for time entry , need to enter hour and minute (HH:mm Format) .So how can input values automatically formatting . Eg: input values automatically formatting with HH:mm format (11:30).Any help would be appreciated.
You can use uib-timepicker directive for this purpose.It is easy to use and lot more customizable like you can switch between 12/24H etc. The doc explains it pretty clearly.
<div uib-timepicker ng-model="mytime" ng-change="changed()"
hour-step="hstep" minute-step="mstep" show-meridian="ismeridian">
</div>
you just write{{"HH:mm"}} in $scope
value = {{a.value | date: "HH:mm"}}
I've got this angular datepicker
<input type="text" bs-datepicker data-start-date="01/10/13" data-end-date="29/04/14" placeholder="Earliest date" id="BoundaryFrom" name="BoundaryFrom" ng-model="chartData.boundary.min" data-date-format="d M yyyy" />
(At the moment I've put in hard coded start and end dates just to test the functionality out. Later I will put in an Angular expression)
Now, this part data-start-date="01/10/13" data-end-date="29/04/14" correctly only displays the dates between 1st October 2013 and 29 April 2014 in the calendar control but the problem is none of those dates is selectable. I can still type in the textbox though. Why are they not selectable?
It seems that the the start date and the end date should be more specific, as well as the options being data-min-date and data-max-date. Your start and end date code should be data-min-date="10/01/2013" data-max-date="04/29/2014". The full line will be
<input type="text" bs-datepicker data-min-date="10/01/2013" data-max-date="04/29/2014" placeholder="Earliest date" id="BoundaryFrom" name="BoundaryFrom" ng-model="chartData.boundary.min" data-date-format="d M yyyy" />
Also, I think the format of the date for that would be "mm/dd/yyyy" instead of "dd/mm/yyyy" like you originally did.
Here is a plunker of working code. The calendar only allows selected dates between 1st October 2013 and 29 April 2014. I hope this helps!!!
edit: fixed a typo. Also, an upvote or accepted answer would be awesome :)
This is the code for my table:
<table border="black">
<tr><th>Date</th><th>Newsletter ID</th></tr>
<?php
while ($row = oci_fetch_array($stid)):
echo "<tr><td>" . htmlentities($row["DATE_ENG"]) . "</td>";
echo "<td>" . htmlentities($row["FEATURE_TITLE_ENG"]) . "</td>";
$NewsIDN = $row["NEWS_IDN"];
?>
<td>
<form name="editEmail" action="editEmail.php" method="GET">
<input type="hidden" name="EmailID" value="<?php echo $NewsIDN; ?>"/>
<input type="hidden" name="action" value="e">
<input type="submit" name="editEmail" value="Edit"/>
</form>
</td>
<td>
<form name="deleteEmail" action="deleteEmail.php" method="POST">
<input type="hidden" name="newsIDN" value="<?php echo $NewsIDN; ?>"/>
<input type="submit" name="deleteEmail" value="Delete" action="deleteEmail.php" onclick="return confirm('Are you sure want to delete')"/>
</form>
</td>
This is the query that is taking in the data. How do I make it so that it orders the table from top to bottom by the correct date so that january 2013 is before may 2013?
public function get_Newsletters() {
$query = "SELECT NEWS_IDN,DATE_ENG,DATE_FRA,FEATURE_TITLE_ENG,FEATURE_TITLE_FRA,FEATURE_DESC_ENG,FEATURE_DESC_FRA,FEATURE_IMG_URL_ENG,FEATURE_IMG_URL_FRA,FEATURE_IMG_ALT_ENG,FEATURE_IMG_ALT_FRA,FEATURE_URL_ENG,FEATURE_URL_FRA,LAST_MODIFIED_BY,LAST_MODIFIED_DT,PUBLISHED_IND FROM BETS.TB__BETS_NEWSLETTERS ORDER BY DATE_ENG";
$stid = oci_parse($this->con, $query);
oci_execute($stid);
return $stid;
}
So the table is calling the above query and right now I am just doing ORBEDER BY DATE_ENG
The MySQL's default sort order is ASC, meaning the rows are ordered from the lowest to highest, in date values this becomes from early time to late time.
You are using "order by DATE_ENG ASC" and that will sort the dates from small to big. And what you want should be accomplished by that.
If it is the other way around, try " order by DATE_ENG DESC"
If your DATE_ENG is type of varchar, then sorting is done alpebetically and depending on format of your dates, may not be as what you wanted to be.
Best usage is, for date fields always use unix TIMESTAMP or DATETIME, then using "order by" statement always gives you the correct results.
The advantage of this approach is that almost every language have tools to deal with unix TIMESTAMPs and mysql DATETIME formats by default.
DATE_ENG should be a DATE or DATETIME data type. Without that, it can't be accurately sorted. Once you change that around, you're able to insert the date into the database by using now(). You can then order properly by ORDER BY DATE_ENG or ORDER BY DATE_ENG DESC
Check out more information on the datetime data types.
This will order by results if the date stored in column in this format m/d/Y if your format is different then use that specific date format in the STR_TO_DATE function
SELECT NEWS_IDN,DATE_ENG,DATE_FRA,FEATURE_TITLE_ENG,FEATURE_TITLE_FRA,
FEATURE_DESC_ENG,FEATURE_DESC_FRA,FEATURE_IMG_URL_ENG,FEATURE_IMG_URL_FRA,
FEATURE_IMG_ALT_ENG,FEATURE_IMG_ALT_FRA,FEATURE_URL_ENG,FEATURE_URL_FRA,
LAST_MODIFIED_BY,LAST_MODIFIED_DT,PUBLISHED_IND FROM BETS.TB__BETS_NEWSLETTERS
ORDER BY STR_TO_DATE(DATE_ENG, '%m/%d/%Y') ASC
Here is the sql fiddle for some column but to show you how it works even if your column type is not date