'Add a day' using onClick event

(0) Share

Report

Posted on by PeterJK

Hello again everyone!

I'm still pretty new to JavaScript, so I could use a little assistance with this requirement.

I have two buttons setup at the top of the form (new_dayPagePreviousButton and new_dayPageNextButton), and between them is a calendar field (new_daypagedate). We have subgrids on the page configured to return results depending on the date chosen in the calendar field.

The requirement is to have a single day added or subtracted from the calendar field whenever a user clicks the Previous Day or Next Day button.

*This post is locked for comments

I have the same question (0)

All responses (10)

Answers (1)

PeterJK 49 on at

Like (0)

Report

RE: 'Add a day' using onClick event

Eran

Added your suggestion to the script, and it works! Once the button is trigger, each of the subgrids on the form refresh and populate! Thanks for the quick response!

Aric

Thanks for the continuous support on this. Learning a lot from this!

Was this reply helpful? Yes No
Verified answer

EranYaron 140 on at

Like (0)

Report

RE: 'Add a day' using onClick event

You can call the attribute's firOnChange() method - docs.microsoft.com/.../fireonchange

add it in after you set the new value, so after window.parent.Xrm.Page.data.entity.attributes.get("new_daypagedate").setValue(d); add the line window.parent.Xrm.Page.data.entity.attributes.get("new_daypagedate").fireOnChange();

Good luck!

Was this reply helpful? Yes No
Suggested answer

Aric Levin - MVP 30,188 Moderator on at

Like (0)

Report

RE: 'Add a day' using onClick event

You can call a JavaScript method of the parent page/window after you click the previous/next buttons (either using parent.functionToCall or postMessage).

Also, what happens after the value is changed on the date control if you navigate away from the control, does it refresh then? You can try changing to focus of the fields and see if that changes anything.

Hope this helps.

Was this reply helpful? Yes No
PeterJK 49 on at

Like (0)

Report

RE: 'Add a day' using onClick event

After doing a little research, I now have a partial solution. I have the following code for each button, each successfully modifies the date;

<html><head>
<script type="text/jscript">
function AddDays(arg) {
var d=window.parent.Xrm.Page.data.entity.attributes.get("new_daypagedate").getValue();
d.setDate(d.getDate() + arg);
window.parent.Xrm.Page.data.entity.attributes.get("new_daypagedate").setValue(d);
}
</script><meta><style type="text/css">P { margin: 0; }</style><meta><style type="text/css">P { margin: 0; }</style></head><body onfocusout="parent.setEmailRange();" style="overflow-wrap: break-word;">

<button type="button" id="new_dayPageNextButton" onclick="AddDays(1)">Next Day</button>

</body></html>

After publishing, the button successfully changes the date. However, once the date is changed, the subgrids on the form do not refresh to reflect the new date. It works if I click on the date field and change the date manually, but not if I use the new buttons. The relevant JScript for this is below, and an onChange event is present in the form Properties ;

function filterSubGrid( ) {
var newDayPageDate = Xrm.Page.getAttribute("new_daypagedate").getValue();

var formattedDate =
newDayPageDate.getFullYear() + "-" +
("00" + (newDayPageDate.getMonth() + 1)).slice(-2) + "-" +
("00" + newDayPageDate.getDate()).slice(-2);

// Branch Services

var objSubGrid = document.getElementById("Branch_Services");
if (objSubGrid == null) objSubGrid = parent.document.getElementById("Branch_Services");

var serviceID = 172130000;

var FetchXml = "<fetch version='1.0' output-format='xml-platform' mapping='logical' distinct='false'>" +
"<entity name='brg_shipment'>" +
"<attribute name='brg_name' />" +
"<attribute name='brg_originaddress' />" +
"<attribute name='brg_ordertype' />" +
"<attribute name='brg_orderstatus' />" +
"<attribute name= 'brg_vip'/>" +
"<attribute name='brg_destinationaddress' />" +
"<attribute name='brg_customername' />" +
"<attribute name='brg_contractnumber' />" +
"<attribute name='brg_clientcontacted' />" +
"<attribute name='new_arrivaltime' />" +
"<attribute name='brg_account_new' />" +
"<attribute name='new_shipmentbranchid' />" +
"<attribute name='brg_shipmentid' />" +
"<order attribute='brg_orderstatus' descending='false' />" +
"<filter type='and'>" +
"<condition attribute='statecode' operator='eq' value='0' />" +
"<condition attribute='brg_service' operator='eq' value='" + serviceID + "' />" +
"<condition attribute='new_dateofservice' operator='on' value='" + formattedDate + "' />" +
"</filter>" +
"</entity>" +
"</fetch>";
objSubGrid.control.SetParameter("fetchXml", FetchXml);
objSubGrid.control.Refresh();

Was this reply helpful? Yes No
PeterJK 49 on at

Like (0)

Report

RE: 'Add a day' using onClick event

The current HTML for the "Next Date" button reads as follows:

<html><head></head>

<body>

<button type="button">Next Day</button>

</body></html>

What would the new HTML look like if I were to add your function to it? Assuming it's supposed to be placed within the HTML.

Was this reply helpful? Yes No
Aric Levin - MVP 30,188 Moderator on at

Like (1)

Report

RE: 'Add a day' using onClick event

You can use a click event on the button. For example on the move next date:

function moveNext_OnClick(){

var date = parent.Xrm.Page.getAttribute(“datefield”).getValue();

date.setDate(date.getDate()+1);

parent.Xrm.Page.getAttribute(“datefield”).setValue(date);

}

Test this out.

Was this reply helpful? Yes No
PeterJK 49 on at

Like (0)

Report

RE: 'Add a day' using onClick event

Thanks for the additional clarification Aric!

Each of the buttons are individual HTML webresources on the form, and the field I'm attempting to change using these buttons is a standard Date field.

So once I add the function to a webresource on the form, how do the buttons then 'trigger' the date to change? I'm assuming an Event Handler?

Was this reply helpful? Yes No
Aric Levin - MVP 30,188 Moderator on at

Like (1)

Report

RE: 'Add a day' using onClick event

Hi Peter,

It's a little hard to visualize your exact solution, but I think I understand your layout.

You can add this to the web resource or to a separate js file.

You have to make sure that if the field is not in the web resource, then you call the Xrm.Page using window.parent.Xrm.Page...

Was this reply helpful? Yes No
PeterJK 49 on at

Like (0)

Report

RE: 'Add a day' using onClick event

Hello Aric

Thanks for the quick response on this! Quick question; where would I add this function? Within the HTML webresource for each button?

Was this reply helpful? Yes No
Suggested answer

Aric Levin - MVP 30,188 Moderator on at

Like (1)

Report

RE: 'Add a day' using onClick event

Hi,

You can add or subtract days by using the functions below.

function SubtractDays() {

var date = Xrm.Page.getAttribute(“datefield”).getValue();

date.setDate(date.getDate() -1);

Xrm.Page.getAttribute(“datefield”).setValue(date);

}

function AddDays(){

var date = Xrm.Page.getAttribute(“datefield”).getValue();

date.setDate(date.getDate()+1);

Xrm.Page.getAttribute(“datefield”).setValue(date);

}

Hope this helps.

Was this reply helpful? Yes No

Community site session details

'Add a day' using onClick event

Helpful resources

News and Announcements

Quick Links

Responsible AI policies

Andrés Arias – Community Spotlight

Congratulations to the August Top 10 Community Leaders!

Leaderboard > 🔒一 Microsoft Dynamics CRM (Archived)

Featured topics

Product updates

Community site session details

'Add a day' using onClick event

Helpful resources

News and Announcements

Quick Links

Responsible AI policies

Andrés Arias – Community Spotlight

Congratulations to the August Top 10 Community Leaders!

Subscribe to this forum!

Select categories

Leaderboard > 🔒一 Microsoft Dynamics CRM (Archived)

Featured topics

Product updates