0

I use an online forex trading website. I use this website (scroll down on the trade website to see the asset graph). I use this to trade and view forex graph. When I open the page in my browser (firefox) I want to use Greasemonkey script to automatically select or "preset" the page with the forex asset i trade in so that the page is loaded with the graph I use. For example I want to automatically select "AUD/USD".

i have tried different methods of selecting/clicking using JQuery/JS none works. I will really appreciate if someone can help with this.

I have tried each of the following to no avail:

$("#assetPlatformSelect_0_chzn a span").text("AUD/USD");
$(".chzn-search input").val("AUD/USD");

    // $(".chzn-search input").focus(); //tried with and without focus
    var p = jQuery.Event('keydown');
    p.which = 13;
    p.keyCode = 13;
    $(".chzn-search input").trigger(p);

=======================================

    $("#assetPlatformSelect_0 optgroup[label='currencies'] option").each(function()
    {       
        if($(this).text() == "AUD/USD") 
        {
            $(this).attr('selected', true);                         
        }
        else
        {
            $(this).attr('selected', false);                
        }
    }); 
var clickNode = "";
    var val2 = "assetPlatformSelect_0_chzn_o_";
    $("li[id^=" + val2 + "]").each(function()
    {   
        if($(this).text() == "AUD/USD") 
        {
                       //tried each and combination of these....
            clickOnFollowButton($(this));
clickNode = $(this).attr('id');
            $(this).click();
            $(this).addClass('result-selected');
            $(this).live('click', function () {
                    $(this).click();
                    });             
        }
        else
            $(this).removeClass('result-selected');

    });

function clickOnFollowButton (jNode) {
    var clickEvent  = document.createEvent ('MouseEvents');
    clickEvent.initEvent ('click', true, true);
    jNode[0].dispatchEvent (clickEvent);
}

=======================

waitForKeyElements ("#assetPlatformSelect_0_chzn a", triggerMostButtons);
function triggerMostButtons (jNode) {
    triggerMouseEvent (jNode[0], "mouseover");
    triggerMouseEvent (jNode[0], "mousedown");
    triggerMouseEvent (jNode[0], "click");
    triggerMouseEvent (jNode[0], "mouseup");
    //clickNode is the Li item to select/click
console.log($(clickNode));
triggerMostButtons2 (clickNode);
}
function triggerMostButtons2 (jNode) {
    triggerMouseEvent (jNode[0], "mouseover");
    triggerMouseEvent (jNode[0], "mousedown");
    triggerMouseEvent (jNode[0], "click");
    triggerMouseEvent (jNode[0], "mouseup");

}
user3113019
  • 9
  • 4
  • Note that that control is in an iframe, you must account for that. Also, you may need to send mouseover and mousedown events as well as clicks. – Brock Adams Apr 08 '14 at 10:30
  • Thanks for that observation about iframes. When i am logged in, the control is on the page itself not in an iFrame. I have updated the link with the non-iframe page. click here --> [link](https://www.traderworld.com/home-platform). – user3113019 Apr 08 '14 at 11:59
  • I will try the mouseover, mousedown & click sequence you proposed. Really hoping that will solve my issue. – user3113019 Apr 08 '14 at 12:15
  • I tried the mouseover, mousedown, click sequence. I made some progress. Now the dropdown menu opens up. But i still cannot click on a particular item to trigger the graph to load the asset. – user3113019 Apr 08 '14 at 13:45
  • You need multiple, sequential waitfors. See [Choosing and activating the right controls on an AJAX-driven site](http://stackoverflow.com/q/15048223/331508). You *might* also need to wait for a drop-down choice to be visible, not just present. – Brock Adams Apr 08 '14 at 20:00
  • yes i tried multiple sequential waitfor. As you can see in the code above I actually do a console.log($(clickNode)) which i used to verify in firebug that the object was always already available/loaded. – user3113019 Apr 09 '14 at 09:47

1 Answers1

0

After hours of testing and testing different options nothing worked. I finally went back and used chrome inspect to inspect each of the elements and then i discovered that the parent element of the options list has a change eventListener. I dont know why but the change eventlistener is not triggered when greasemonkey/js updates the list. So now after updating the list object i trigger the change event in greasemonkey and that solved the problem. See code below.

$("#assetPlatformSelect_0_chzn a span").text("AUD/USD");
//trigger the change eventlistener on the <select> object
fireChangeEvent("assetPlatformSelect_0");

==============

function fireChangeEvent(elmId)
{
    var element = document.getElementById(elmId);
    if ('fireEvent' in element)
        element.fireEvent("onchange");
    else {
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent("change", false, true);
        element.dispatchEvent(evt);
    }
}
user3113019
  • 9
  • 4
  • I don't think you need that much code. `$('#assetPlatformSelect_0_chzn_o_4').mouseup()` should be sufficient. (I tested with the [link](https://www.traderworld.com/home-platform) you provided.) – zanetu Apr 09 '14 at 10:16
  • The option you provided looks more elegant but it doesnt work when i tried it. So i have to revert back to the bulky js option above. – user3113019 Apr 09 '14 at 17:42