JSRender- How to display calendar icon and make date picker field read only - jquery-ui-datepicker

I am using the following code for datepicke in my template.
{^{datepicker fromValue readonly="true" class="myclass"/}}
{^{datepicker toValue ^_minDate=fromValue class="myclass" readonly icon="show"/}}
I tried to achieve following things.
I want to make the datepicker field readonly. For the above code it is not happening.
How to show the calendar icon within the text box. currently its not happening. icon=show...I tried it . I didn't see anywhere.
In my case I have to show the toDate and FromDate at same time. If user first selects the toValue and come back to from value , how to restrict his max date. Currently it is not restricting user.So I can able to select from date which is greater than todate.
Thanks in advance.

For a readonly datepicker, it needs to be on a div, and have _disabled=true. If it is not a div the setting _disabled=true will disable the input, so the datepicker won't show.
{^{datepicker startDate elem="div" _disabled=true/}}
For providing an icon:
{^{datepicker startDate
_showOn= "button"
_buttonImage="https://jqueryui.com/resources/demos/datepicker/images/calendar.gif"
_buttonImageOnly= true
_buttonText= "Select date"
/}}
For start and end date, see http://www.jsviews.com/#samples/tag-controls/datepicker/simple
{^{datepicker startDate
^_maxDate=endDate
/}}
{^{datepicker endDate
^_minDate=startDate
/}}

Related

Oracle Apex 22.21 - Chart Page - Bar Type - How to return a range of date values based on user input

I have a table ORDERS which contains column ORDER_DATE. I have created a Chart as a Bar type.
Right now, the chart returns all the orders because I did not specify a Maximum Rows. The date on the x-axis and the number of orders on the y-axis.
How can I add a form for the user to select a range of dates and return only the values for those dates?
Example:
Doesn't necessarily have to be a calendar. A dropdown is fine as well. Or even a 'text' input since that is the easiest way.. I just need to know how to go about creating this feature. Your help is appreciated. Thank you.
First create a page item as date picker or some other plugin you already have to let users select a date or date range. (make sure that when user selects a date, the page item value is set by using a dynamic action or by a setting that your plugin has (set item value after selection kind of setting) )
Then create a new view with the source of your ORDERS table but it should have a where statement as it filters records by your page item such as:
select count(1)
from ORDERS
where order_date between :P1_DATE_FROM and :P1_DATE_TO
Set the source of the chart to this new view.
After user sets a value, refresh the chart by a dynamic action if it is not refreshed automatically.
In summary, the idea is to make your chart's source filtered by page items that users can change. Then refreshing the chart so that the new page item values are effective.

Conditional Formatting based on a dropdown in another sheet

I have a Query function in Sheet2 which is based on a dropdown selection in cell I11 of Sheet1. In the Sheet2 Query, I want to automatically highlight the name selected in the Sheet1 dropdown. Per my example below, if 'New Zealand' is selected in the dropdown I want New Zealand to be highlighted like this:
I have tried MATCH, EXACT, INDIRECT and combinations of these but cannot get any to work. I would really appreciate some help.
on range A2:F use this custom formula:
=COUNTIF(A2, INDIRECT("Sheet1!I11"))
or:
=REGEXMATCH(LOWER(A2), LOWER(INDIRECT("Sheet1!I11")))

How to write a query based on the Date item, in interactive grid

I have a date field and a interactive grid. I am trying to generate the Interactive grid based on the value inputted in the date field.
I am trying to write the query as below :
select pap.effective_start_date , pap.effective_end_date
from per_all_people_f pap
where :SELECT_DATE between pap.effective_start_date and
pap.effective_end_date
Here, SELECT_DATE is the name of the Date field (datatype Date picker). I am writing a dynamic action on Change of Date field, and refreshing the interactive grid region.
But when I change the value in Date field, it doesn't return any rows.
I have done a similar change where my interactive grid was based on a dropdown. There I had to set the "page action on selection" to Submit, and it worked. But here, since it is a Date field, the "Page Action on selection" property doesn't appear on the page .
Can somebody please suggest, how can I achieve this.
You need to explicitly convert your bind variables, which are treated as strings, to dates.
to_date(:SELECT_DATE)
The format mask will come from the application properties, or you can be explicit with that, too.

QDateEdit validations

I'm trying validate two QDateEdits. I have two fields, startdate and enddate and i want to validate that the minimum date of enddate be the selected startdate date. But also, i want give the user opportunity that the enddate field can be empty.
I conected both fields
connect(startDate,SIGNAL(dateChanged(QDate)),endDate,SLOT(setMinDate(QDate)));
startDate and endDate are QDateEdit with a popup calendar.
So, where is the problem here?? When i click over endDate the minimun date it's ok but the next day (fisrt valid date) appears in blue color like it was selected, but when i clicked over that date the popup close and the date it's not set. For example:
When i open the form the startdate field have by default the current date. Latter i click over endDate field and the minimum allowed date is one more day wich it's ok, but this minimum allowed date it's blue marked and when i clicked the date it's not set.
Sorry if my english it's so bad, i hope that you can help me. Thanks any way
I found what my problem is. I connected the slot to dateChanged(QDate) signal, so, by default the QDateEdit set the first allowed date as selected, so if you select it again the signal it's not emited and by result the date it's not set. My solution is use editingFinished() signal instead dateChanged(QDate) signal. I hope has been helpful. Regards,

Refresh Apex 5.0 chart results with different dynamic actions on same SQL query

I have created a bar chart on APEX 5.0 where my query looks like below:
select col1 as label,col2 as value from table1 where :P3_NEW_1 = col3;
here: P3_NEW_1 the page item I have created of type "Select List".
The list of values in "Select List" page item are pre-populated in the dropdown using the "Shared component" type I have created and so far this worked fine and I am able to display the results of above query by passing the value through the page item select list.
Now I need to add 2 data pickers on the same Apex page such that I should now be able to filter the results using date picker through dynamic action.
I know that using an additional button I can create a dynamic action but my problem is how do I modify the above query such that following should happen.
During the page load, once I select a particular value from the "Select List", it should display records based on the value selected from dropdown
This I already achieved using above sql query for the bar chart.
Once the bar char is displayed, I should next be able to filter and display the results using date ranges through date pickers.
Here my problem is my bar chart query is same but I need to now pass the start_date and end_date to the same above sql query which but I am not sure how to achieve this. If I add a button for dynamic action I need to select the report region which is the "bar chart" region and here my query needs modification.
Once the bar chart display the results, at the next step how do I filter the results by having the date filters with dynamic action on the same region where bar chart was displayed. How to achieve this?
You can change the query to something like this:
SELECT COL1 AS LABEL,
COL2 AS VALUE
FROM TABLE1
WHERE :P3_NEW_1 = COL3
AND (:P3_START_DATE IS NULL
OR TO_DATE(TIME_STAMP,'YYYY-MM-DD-HH24:MI:SS') BETWEEN :P3_START_DATE AND NVL(:P3_END_DATE,SYSDATE));
Where :P3_Start_date and :P3_End_date are the Start and End date pickers and TIME_STAMP is your column where you store the date.
After modifying the query you can simply add a button where at Behavior>Action select Submit Page.
This way when you click the button, the page will be submitted and chart refreshed.
If you want to take your chart to the next level you can do a partial refresh on it. Here is a short video tutorial of partial refresh on a report but you can apply the same login on your chart.