ExecuteJavascript Order Preference
Greetings all,
I was wondering if there was anyway to control the order of execution for Javascript calls mixed with Ajax. For instance, I have a button executing an Ajax method in a QPanel. During the execution, I was hoping to execute a Javascript event using QApplication::ExecuteJavascript, then change the properties of some of the controls within the QPanel by changing the blnModified property to TRUE, and then execute another Javascript event on the new visible controls. It seems to be a problem where the QPanel is rerendered with the changes before the first Javascript command is executed on the client. I need the Javascript to execute, have the QPanel change by setting blnModifed to TRUE, and then execute more Javascript. Am I going about this the wrong way?
Cheers!
Basically, if you want javascript to run before the server side stuff happens, you have to add it as a seperate QJavascriptAction before the QServerAction is added to the control that triggers it all.
To have extra js done after the server call, you can then add another QJavascriptAction after the QServerAction one, or have the QServerAction output the needed javascript, your choice.
I implemented it this way:
$action = new QJQFadeOutAction($this);
QApplication::ExecuteJavascript($action->RenderScript($this));
$this->strTemplate = sprintf('%s/workflow/%s', __PANELS__, WorkflowState::GetTemplate($intWorkflowState));
$this->blnModified = true;
$action = new QJQFadeInAction($this);
QApplication::ExecuteJavascript($action->RenderScript($this));
But it seems the QPanel must get updated before the JQuery finishes the animation because I see the updated QPanel before the JQuery FadeOutAction even begins. I guess it is a timing thing with how long it takes the JQuery to animate, not the order of execution. If you have any better suggestions, I'm open to new ideas. Thanks for your help!
As I said, you should be adding the QJQFadeOutAction to the button before your QServerAction is added, so it should look something like this:
$btnSomeButton->AddAction(new QClickEvent(), new QJQFadeOutAction($this->btnSomeButton));$btnSomeButton->AddAction(new QClickEvent(), new QServerEvent('btnSomeButton_click'));
$btnSomeButton->AddAction(new QClickEvent(), new QJQFadeInAction($this->btnSomeButton));
Hello guys,
I'm sorry of digging out this topic but I've a similar issue with javascript.
I try to do something like this :
$this->btnSearch->AddAction(new QClickEvent(), new QServerAction('btnSearch_Click'));
$this->btnSearch->AddAction(new QClickEvent(), new QJavaScriptAction("document.location.hash=#bottom;"));
protected function btnSearch_Click() {
$this->dtgResults->Refresh();
//QApplication::ExecuteJavaScript("alert('hello');", true);
}
But my issue is that the QJavaScript action is triggered before the end of the process launched by the QServerAction.
And, if I try to handle that query into btnSearch_Click method with an ExecuteJavaScript, it doesn't work at all and nothing happen..
I'm lost here, please, help me.
Regards,
Laurent
Hi laurent3,
I think you have a "misunderstood" of concept here.
The QServerAction is in fact a HTML POST Action, that means require refresh the page to send the data to server.
In the other side, the QJavaScriptAction is a call to a "client side" javascript function you have on the page, that means not refresh page executed.
Try put a QAjaxAction instead the QServerAction.
QAjaxAction is like a QServerAction but not refresh the page and you can continue access to methods or function do you have on the PHP file.
Something like this...
$this->btnSearch->AddAction(new QClickEvent(), new QAjaxAction('btnSearch_Click', $this->waitIcon));
$this->btnSearch->AddAction(new QClickEvent(), new QJavaScriptAction("document.location.hash=#bottom;"));
protected function btnSearch_Click() {
$this->dtgResults->Refresh();
//QApplication::ExecuteJavaScript("alert('hello');", true);
}
Hope this help you, JMI