Overwriting URL of OpenLayers.Protocol.HTTP

Question

How can I overwrite the url of OpenLayers.Protocol.HTTP?

I tried

searchformPanel.protocol.url

and it works (checked with console.log), but at the end the original url is sent (in the code below: url: '/fs/') (see attached picture).

output from firebug

This is the code:

var searchformPanel = new GeoExt.form.FormPanel({
 border: false,
 width: 250,
 protocol: new OpenLayers.Protocol.HTTP({
 url: '/fs/',
 format: new OpenLayers.Format.GeoJSON()
 }),
 items:[{
 xtype: 'combo',
 id: 'idcombo',
 store: new Ext.data.SimpleStore({
 fields:['fsclass','ollayer'],
 data:[["Boreholes","Boreholes"],["All_layers","All layers"]]
 }),
 displayField: 'ollayer',
 valueField: 'fsclass',
 fieldLabel: 'Layer',
 emptyText: 'select a layer',
 submitValue: false,
 selectOnFocus: true,
 mode: 'local',
 typeAhead: true,
 editable: false,
 forceSelection: true,
 triggerAction: 'all'
 },{
 xtype: 'textfield',
 id: 'idtextfield',
 fieldLabel: 'Find features',
 emptyText: 'enter word',
 name: 'comments__like',
 allowBlank: false
 }],
 listeners:{
 actioncomplete: function(form, action){
 searchShowTip(action.response.features);
 }
 },
 buttons:[{
 text: 'search',
 listeners:{
 click: function(){
 var comboLayer = Ext.getCmp('idcombo').getRawValue();
 var keyword = Ext.getCmp('idtextfield').getRawValue();
 var newUrl = '/fs/' + comboLayer + '?format=GeoJSON&comments__ilike=' + keyword + '&queryable=comments';
 console.log('1:' + newUrl);
 //this gets '/fs/' from the searchformPanel
 console.log('2:' + searchformPanel.protocol.url);
 searchformPanel.protocol.url = newUrl;
 console.log('3:' + searchformPanel.protocol.url);
 searchformPanel.search();
 }
 }
 }]

});

Answer 1

Finally it worked!!!!!!!!! the trick was to take the protocol outside the formPanel and there replace the newUrl as "protocol.options.url = newUrl;". I didn't know about this "options" until I checked the line 180 of HTTP.js of OpenLayers, because I tried to use protocol.read() and I received an error pointing to this line (as explained here). Also, I was resending the "comments" and "queryables" of the formPanel (so I deleted "keyword" above), as it was posted by myself in this original question. Here is the piece of code that did the trick, simple and beautiful:

buttons: [{
 text: 'Search',
 handler: function() {
 comboLayer = Ext.getCmp('idcombo').getValue();
 newUrl = '/fs/' + comboLayer + '?format=GeoJSON';
 protocol.options.url = newUrl;
 formPanel.search();
 }
 }]

Also, I was confused about how variables and local/global scope work together, I think I came up with this solution because I understood that writing things inside "functions" (because all the above is inside a function() called in the handler) make that variables are being read by another variables before and after the function is declared, not sure if it's clear what I explained before, but sure this link explains it much better.

Hope this helps more people, especially those new in javascript and openlayers like me!!