Javascript: Append a string to search query after clicking submit/search button

Question

In this case, Let's take Google as example:

The code is JScript .NET, which is basically a .NET version of Javascript. Regardless of language, Anyone with appending type of skill can answer my question.

This code is used in Fiddler(It's a Man-in-the-middle proxy)

if (oSession.uriContains("&q=")) // oSession is a Fiddler object session // uriContains() function, checks for case-insensitive string from the URI
    {
        var str = oSession.fullUrl;
        var sAppend = "test1+test2+test3";
        if (!oSession.uriContains(sAppend))
        {
            oSession.fullUrl = str.replace( "&q=","&q="+sAppend);
        }
    }

For those who are confused, It says, If &q= is present in the URI, replace/append &q= with &q=test1+test2+test3

Problem: It appends test1+test2+test3 instantly, when it sees &q= in the URL.

Basically, how do I make it wait until I click the submit/search button

Thank you.

Answer 1

Identifying your problem

I'm assuming:

1. you want to use Fiddler for your solution (since you're already using it)
2. you've figured out how to alter the request URI (as shown in your example), and your problem is that you want to target only those requests where the "search" button was clicked, not auto-submitted searches

Isolating those requests that stem from the search button being pressed on google is not straightforward, but I came up with a hack that seems to work. Basically, the oq (original query) get parameter is only added when the user explicitly hits button/enter key, so we test for its presence in order to identify such requests.

Solution

In your OnBeforeRequest method in Fiddler Handlers class (where you're already putting your code), we'll:

1. Check that request is to www.google.com and contains q parameter
   • If true, log (in the fiddler log) that a query was submitted to google.com & highlight request in pink
2. Check that request contains oq parameter (original query)
   • If true, log alert that submit button was pressed & highlight request in Light Forest Green

Code

if(oSession.HostnameIs('www.google.com') && oSession.uriContains("&q=")){
    FiddlerApplication.Log.LogString('query submitted to google.com...');
    oSession['ui-backcolor'] = 'pink'; //highlight this request

    //test for original query
    if(oSession.uriContains('&oq=')){
        FiddlerApplication.Log.LogString('SUBMIT BUTTON OR ENTER CLICKED (probably)');
        oSession['ui-backcolor'] = '#369369'; //highlight in Light Forest Green
        //whatever sort of request manipulation you want to do here...
    }

}

Other notes:

• I'm assuming you want to prepend your query string to the existing q value, i.e. q=Hello will become q=test1+test2+test3Hello. If you want to replace it you need More Regex.
• Depending on your needs, Naomi or Ahmed's request may be better (it's in-browser, not in fiddler).
• Modifying a request or response in Fiddler
• Understanding Fiddlerscript

Answer 2

Well in Javascript you can bind actions to events. In your case the event is the submit of the form For example:

function addEventsToHTML(){
    var form1 = document.getElementById('form1');
    form1.onsubmit = submitHandler;
    function submitHandler(){
        alert("You just submit: "+this.email.value);
    }
}

If you want to bind it on click you can do:

object.onclick=function(){myScript};

Or

object.addEventListener("click", myScript);

Note: The addEventListener() method is not supported in Internet Explorer 8 and earlier versions.