rich:calendar ignored format pattern for the day of the week after selecting - jsf-2

As a part of , I am using component with settled value of datePattern as follows:
<rich:calendar id="effectiveDate"
value="#{itemBean.effectiveDate}"
datePattern="EEEE, MM/dd/yyyy" />
So when I load the form, the existing effectiveDate from the requested itemBean is properly displayed in the text field.
Problems:
when clicking on calendar icon, the content of the text field will be gone. So if I didn't select anything from the calendar popup, then the text field remains empty.
when the date is selected it is displayed like that (for example):
EEEE, 11/19/2012
So the week day is not displayed properly.
Noticed that without specifying the week day (EEEE part of datePattern) none of mentioned above problems occurs.
Is there some specific way to display the week day after selecting?
I am on RichFaces 4.2.2.
Thanks!

As I think this is a known issue with <rich:calendar>. I don't know much about that.
However try this,
<rich:calendar id="effectiveDate" value="#{itemBean.effectiveDate}" onchanged="formatCalendarString(event, this);" datePattern="EEEE, MM/dd/yyyy" />
Within <head></head> tags put this.
<head>
<script>
function formatCalendarString(event, cal) {
var date = new Date(Date.parse(event.rich.component.getSelectedDate()));
var weekdays=new Array(7);
weekdays[0]='Sunday';
weekdays[1]='Monday';
weekdays[2]='Tuesday';
weekdays[3]='Wednesday';
weekdays[4]='Thursday';
weekdays[5]='Friday';
weekdays[6]='Saturday';
var day = weekdays[date.getDay()];
if(typeof(day) !== 'undefined') {
var formattedDate = (day + ', ') + event.rich.component.getSelectedDateString().substring(6);
cal.value = formattedDate;
}
}
</script>
</head>

Related

How to add today's date in Marp markdown

all
I am looking for a simple way to add today's date in my marp markdown. Something like
{{ date }}
Any idea?
Thanks
Here is one way using the Date() function in JS. This could then be customised to display exactly what you wanted (date, time, specific date format etc.)
With this method though, if viewing as a HTML slide deck then the datetime will change each time the page is loaded.
If you wanted to insert a static time (e.g. file save date etc), perhaps the easiest way would be to just do a regex replace on a certain phrase eg. {{ date }} as above, before you get Marp to convert the document.
---
marp: true
---
Refresh to see changes...
<p id="date1"></p>
<p id="date2"></p>
<p id="date3"></p>
<script>
const now = new Date()
document.getElementById("date1").innerHTML = now;
document.getElementById("date2").innerHTML = now.toLocaleDateString("en-US");
document.getElementById("date3").innerHTML = now.toLocaleDateString("en-US", {weekday: 'long'});
</script>

WIX Editor - form where you can select dates which will be pasted into adress http://...com#/&from=2021-07-16&to=2021-07-17

Please help me!!!
I can see there are some calendars available in WIX Editor you can use on your site.
Now, how to make this: you click on calendars where you can select date of arrival and departure (f.example 2021-07-16 and 2021-07-17) and click a button (confirm) which picks up those dates and forward you to the new site where those dates will be pasted into address http://....com#/&from=2021-07-16&to=2021-07-17
Thank you!!!
UI
Add a form component
Add 2 date fields
Add a submit button
(I don't know of a way of setting range of dates in a single datepicker)
Code
$w.onReady(function () {
//
$w('#datePicker1').onChange(e => {
const fromDate = new Date(e.target.value);
fromDate.setDate(fromDate.getDate() + 1);
$w('#datePicker2').value = fromDate;
// this way the user couldn't select an "to" date lower than the "from" date
$w('#datePicker2').minDate = fromDate;
});
$w('#wixForms1').onWixFormSubmit(e => {
const fromDate = e.fields[0].fieldValue.toLocaleDateString('fr-CA');
const toDate = e.fields[1].fieldValue.toLocaleDateString('fr-CA');
wixLocation.to(`https://example.com/?start=${fromDate}&end=${toDate}`);
});
});
https://moshef9.wixsite.com/dates-range
OK! Thanks Mosh! I'm a huge step forward!
I make a simple form with 2 dates an "submit" button.
I pasted your code on my Wix site.
If I click "submit" button then ...nothing happens;(
Why???
I'd like to just say that imported wixLocation from 'wix-location' and everything
seems to be correct.

Datebox - get the event and validate year, month, and date by entering a value manually

I am using datebox plugin for jquery mobile http://dev.jtsage.com/jQM-DateBox2/unit/datebox.html
Everything works fine.
Here my question is how do i validating the individual year, month, date input fields by entering the numeric values in the specific fields ((ie) keydown/keypress..) without using of plus and minus buttons.
Thanks in advance...
This function checks if the input changed and logs the new date into the console.log:
$("div.ui-grid-b div input.ui-input-text").change(function() {
var parent = $(this).parent().parent();
console.log("date changed to: "
+parent.find("div.ui-block-a input.ui-input-text").val()+":"
+parent.find("div.ui-block-b input.ui-input-text").val()+":"
+parent.find("div.ui-block-c input.ui-input-text").val()
);
});

How to format date in a templatefield of a detailsview according to culture

I've been searching a lot on how to this
There is a lot of posts here and there on how to do it
However I cannot find a way to do what I want
I have this textbox in a TemplateField: (I cannot use a BoundField)
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("myDate", "{0:d/M/yyyy}") %>'>
That works good, but in my website i can change back and forth from english (us) to spanish (mx) so the date format is different and has to change as well.
en-US: M/d/yyyy es-MX: d/M/yyyy
how can i change that format in a postback?
I tried to have the TEXT intruction in a meta:ResourceKey but it displays '<%# Bind("myDate", "{0:d/M/yyyy}") %>' instead of the date
I also tried changing it from codebehind using: Text='<%# GetDate(Container.DataItem) %>'
public string GetDate(object dataItem)
{
DateTime dt;
DataRowView _row = (DataRowView)dataItem;
string fecha = _row["myDate"].ToString();
if (culture == "es-MX")
dt = DateTime.ParseExact(fecha, #"d/M/yyyy", System.Globalization.CultureInfo.InvariantCulture);
else if(culture == "en-US")
dt = DateTime.ParseExact(fecha, #"M/d/yyyy", System.Globalization.CultureInfo.InvariantCulture);
return dt.ToShortDateString();
}
It does the trick but when I try to update or insert I get a null value error :/
Im using visual studio 2012 .net 4.5 and c#
Thanks for your help
rubenc
Well it turned out that this is a way of doing it
The null error was from another value :)
Thanks anyway

jQuery datepicker year change when select month, IE7

Our project using JSF1.2, Icefaces 1.8.2, jQuery UI component datepicker (veresion 1.8.14). Problem with IE7 (Firefox is fine). Problem will happen with following sequence: Select a date (for example, couple days befor doday). Note we have set year range from 1991 to 2012. Our business logic is print a document use that date (in code, called dateOfStudy) as title, once done, in the JSF back bean, I clear the calendar inputext date field to null. Now click datepicker icon again, the year corrtly shows 2011, select any previous month (for example go back to Auguest, 2011), problme happend right here: the year will change to 1991, can not keep at 2011.
The problem will not happen if I do not touch that date field (don't do clear, keep the old date). The problem will still appear even I just change the date font to other color via CSS (seems whenever I touch that field, datepicker will messed up). The problem will not happen if you click today once, or close datepicker, open again.
Seems the datepick need some initializtion after I cleared date?
I attached some code. I have trid method/option like setDate, onChangeMonthYear, beforShowDay, can not solve. Any help is appreciated !!
<script type="text/javascript">
var jq = jQuery.noConflict();
jq(document).ready(function() {
jq("[id$=fmv]").live('click', function() {
jq(this).datepicker( {
showOn : 'focus',
changeMonth : true,
changeYear : true,
dateFormat : 'mm/dd/yy',
yearRange : '-20:+1',
showButtonPanel : true,
closeText : 'Close'
}).focus();
});
});
</script>
<ice:inputText id="fmv"
style="background-image:url ('../../../jquery/images/calendar1.png');
background-repeat:no-repeat;background-position:right;"
value="#{pItem.dateOfStudy}"
validator="#{pItem.validate}"
partialSubmit="true"
name="fmv"
valueChangeListener="#{pItem.dateChangeListener}">
</ice:inputText>
When backbean clear or change input text in calendar inputText, I think that causes a focus event, and calendar confused under IE7. The reason I am using showOn focus is the code is in a table AJAX display area, so use calendar show on image button not work since the button image will not show when AJAX update comes back (the jQuery calendar will not get called), which force me to use showOn focus. I finally solved this year change problem by adding the following refresh calendar line after the final .focus():
jq(this).datepicker("setDate",jq("[id$=fmv]").datepicker("getDate"));
things working fine now. I am not sure how to make this call only when backbean clean the calendar date, but performance seems ok.

Resources