Saturday, May 8, 2010

Loading Bar with JavaScript

Add divs code to your page body, or wherever you want
<div id="div1"> <div
id="Div2" style="border: solid 1px #000000; width: 7px; height: 7px; background-color:
#D3D3D3; float: left; margin-right: 5px; margin-left: 5px;">
<
/div>
<div id="Div3"
style="border: solid 1px #000000; width: 7px; height: 7px; background-color: #D3D3D3;
margin-right: 5px; float: left;"> </div> <div
id="Div4" style="border: solid 1px #000000; width: 7px; height: 7px; background-color:
#D3D3D3; margin-right: 5px; float: left;"> </div>
<
div id="Div5" style="border:
solid 1px #000000; width: 7px; height: 7px; background-color: #D3D3D3; margin-right:
5px; float: left;"><
/div
> <div id="Div6" style="border: solid 1px #000000;
width: 7px; height: 7px; background-color: #D3D3D3; margin-right: 5px; float: left;">< /div>
<div id="Div7"
style="border: solid 1px #000000; width: 7px; height: 7px; background-color: #D3D3D3;
margin-right: 5px; float: left;"> </div
> <div id="Div8" style="border: solid 1px #000000;
width: 7px; height: 7px; background-color: #D3D3D3; margin-right: 5px; float: left;">
</div> </div>

Add these two buttons at the buttom of your progress bar (divs)
<input type ="button" id="btn_StartLoad" value ="Stop Loading" onclick ="StartLoading();" />

<input type="button" id="btn_StopLoad" value="Stop Loading" onclick="StopLoading();" />


Add these javascript functions to the same page which including divs and the two buttons.
var index = 1;
var prevIndex = 0;
var divCount = 7;
var loaded = false;
var Loading;

function StartLoading() {
    if (!loaded)
   {
      Loading = setInterval(DoLoading, 450);
   }
}

function DoLoading() {
  loaded = true;
  if (index > 1 && index != prevIndex) {
    prevIndex = index - 1;
    document.getElementById("loading"
+ prevIndex).style.backgroundColor = "#D3D3D3";
    document.getElementById("loading"
+ prevIndex).style.border = "solid 1px #000000";
  }
  else if (index > 1 && index == prevIndex)
{
    document.getElementById("loading"
+ (prevIndex - 1)).style.backgroundColor = "#000000";
    document.getElementById("loading"
+ (prevIndex - 1)).style.border = "solid 1px red";
    index = 1;
  }
  if (index <= divCount) {     document.getElementById("loading"
+ index).style.backgroundColor = "#000000";
    document.getElementById("loading"
+ index).style.border = "solid 1px red";
  if ((prevIndex - 1) == divCount) {
    document.getElementById("loading"
+ (prevIndex - 1)).style.backgroundColor = "#D3D3D3";
    document.getElementById("loading"
+ (prevIndex - 1)).style.border = "solid 1px #000000";
  }
  index++;
  if (index > divCount) {
    prevIndex = index;
  }
}
}

function StopLoading() {
  clearInterval(Loading);
  for (i = 1; i <= divCount; i++) {     document.getElementById("loading"
+ (i)).style.backgroundColor = "#D3D3D3";
    document.getElementById("loading"
+ (i)).style.border = "solid 1px #000000";
  }
  loaded = false;
  index = 1;
  prevIndex = 0;
  }

Example:


Friday, April 30, 2010

How to display From & To Date Range from Query in Dynamics Ax

If you build a report that use range date you will need to show user which date range he choose 
when he view the report, this method print the date range which user selected it just  add it into
your report header and it'll be like that

Date Range: 01/01/2010..10/01/2010

(Date Range) is the the label of the display method



Display str DateRange()
{
    str rangeValue;
    QueryBuildDataSource datasource;
    QueryBuildRange range;
    ;
    datasource =  element.query().dataSourceTable(tableNum(YourDatasourceTable));
    range = datasource.findRange(fieldnum(YourDatasourceTable, YourDateField));
    if(range)
    {
       rangeValue = range.value();
    }
    return rangeValue;
}