Atozed Forums

Howdy All!

 I am trying to hook to a bootstrap region OnScroll event and then have it fired back to a C Builder OnEvent to let me know if the use has scrolled to the bottom of the window.

The problem is that I am obviously not calculating the scroll position with the right object in my javascript event. My question is how do I in a generic OnEvent() in javascript reference the object that the event is executed for (i.e. like the Delphi Sender object)?

Here is what I have:

1) In my form's OnCreate() event, I have the following code:

  // this is the JavaScript function that we want to call.
  // This function, in turn, will call IWForm2.DoMyAjaxFunc()
  TStringList * pJS = new TStringList;
  pJS->Add(L"function OnWindowScroll()");
  pJS->Add(L"{");
  pJS->Add(L"  var myData;");
  pJS->Add(L"  if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight - 20)");
  pJS->Add(L"  {");
  pJS->Add(L"    myData = 'eof = true';");
  pJS->Add(L"  }");
  pJS->Add(L"  else");
  pJS->Add(L"  {");
  pJS->Add(L"    myData = 'eof = false';");
  pJS->Add(L"  }");
pJS->Add(L"executeAjaxEvent(\"&data=\"+myData, null,\"" + UpperCase(Name) + L".OnWindowScroll\", false, null, false);");
  pJS->Add(L"return true;}");
  PageContext->ExtraHeader->Add ( UnicodeString().sprintf ( L"<script language=\"javascript\" type=\"text/javascript\">%s</script>",
  pJS->Text.c_str()
                                                        )
                            );

  // If we want to call IWForm2.DoMyAjaxFunc, then we have to register it as a Callback
  WebApplication->RegisterCallBack(UpperCase(Name) + L".OnWindowScroll",OnWindowScroll);


2) In a button OnAsyncClick event, I attach the above event to the region that I want to check the scrolling of:

// Create dialog
pTermsAndConditionsFrame_ = new TTermsAndConditionsDialogFrame(this);
pTermsAndConditionsFrame_->Name = L"TermsAndConditionsDialogFrame" + IntToStr((int) GetTickCount());

// Hook region's onscroll event...
pTermsAndConditionsFrame_->ModalBodyRegion_->ScriptEvents->HookEvent(L"onscroll",L"OnWindowScroll();");


pTermsAndConditionsFrame_->Parent = this;

3) The registered OnWindowScroll() is always called.

Thanks in advance,

Shane

Hi Shane,

Add a parameter "event" to your function OnWindowScroll() and use event.target to obtain the element which triggered the event. So you should have:

function OnWindowScroll(event) {
var theObject = event.target;
...
}

Please let me know if it does what you want.

Kind regards

(11-14-2018, 08:40 AM)Alexandre Machado Wrote: [ -> ]Hi Shane,

Add a parameter "event" to your function OnWindowScroll() and use event.target to obtain the element which triggered the event. So you should have:

function OnWindowScroll(event) {
  var theObject = event.target;
   ...
}

Please let me know if it does what you want.

Kind regards

Howdy Alexandre!

I am finally getting back to this and it still doesn't work. 

I have a region with a long string of text and I just want to know when the user scrolls to the end of it so I can enable an Accept Terms button.

Any chance for a quick small demo  ?

Thanks in advance,

Shane

Hi Shane, put the button at the end of the region, after long string. When users goes to the end, the button is there.

Howdy Jose!

Thanks for the suggestion but I would prefer my original solution. If I start the button off hidden, I will get more UNWANTED phone calls than I usually do !

All the best,

Shane