I am using a jqGrid with both filterToolbar and searchGrid.
When I perform a search using the filterToolbar and then open the searchGrid window, the filters come filled fine.
But when I change something after this, this feature stop working.
I can explain by testing this sample: http://srv04.wln.com.br/cpsadmin/sample
Try typing an 'a' for the fields Name, Address and City in the filterToolbar, then perform a search (pressing return when focus in any input).
After that, click in the 'Find Records' button at the footerBar, this will open the search window, with the 3 fields filleds according with the filterToolbar searchoptions.
But if we try to do something after this, nothing works ok again, since we refresh the page.
I would like to get the power of both, filterToolbar and searchGrid, working together, and in the two ways.
You can try to add recreateFilter: true searching option. To be able to find the exact reason of the problem you should use jquery.jqGrid.src.js instead of jquery.jqGrid.min.js on your demo page.
I recommend you additionally to use refreshSerchingToolbar function which I suggested in the answer. One more answer with the demo could be also interesting for you. It show how to save last searching filter (and some other information) in the localStorage. At the visit of the same page the previous used searching filter will be applied.
UPDATED: It's a little the matter of the tasted, but I personally use the settings
$.extend($.jgrid.search, {
multipleSearch: true,
multipleGroup: true,
recreateFilter: true,
closeOnEscape: true,
closeAfterSearch: true,
overlay: 0
});
or some more advanced version as my default Advanced Searching settings. The recreateFilter: true like recreateForm: true for the form editing are always my default settings. I suggested many times (see here for example) to make the settings as jqGrid defaults, but the suggestings stayed unanswered. Tony (the developer of jqGrid) has another opinion on the subject.
Related
I am using chromeless API (https://github.com/graphcool/chromeless)
How can I select an option from a dropdown list?
Specifically I want to select last option having value="other".
My HTML is:
You could achieve this with the evaluate() method which lets you evaluate any Javascript within the browser-context of any page you load:
await chromeless
.goto('http://yourwebsite.com/yourpage')
.evaluate(() => {
select = document.querySelector('select.decline-form-select')
select.value = 'other'
})
Or, specifically select whatever the last item is in the select list:
await chromeless
.goto('http://yourwebsite.com/yourpage')
.evaluate(() => {
document.querySelector('select.decline-form-select option:last-child').selected = true
})
It can be done without the evaluate() method, too, albeit in a somewhat convoluted way. Avoiding evaluate() is useful when it is unknown exactly which events have to be triggered upon change, for the web application to work.
await chromeless
.click('#the-select-element')
.type('First characters of description text of desired option', '#the-select-element')
.click('#the-select-element option[value="the-matching-value"]')
Or using the example posted in the question:
await chromeless
.click('select.decline-form-select')
.type('Oth', 'select.decline-form-select')
.click('select.decline-form-select option[value="other"]')
Selecting an option using native Chromeless commands involves first clicking the select element, then typing text to select the desired option, based on the visible text content of the option (the first few characters that unambiguously identify the option should be enough), and then clicking the desired option element. Since it is not possible to find the option element by text content using css selectors, the element must be selected by some other means – e.g. value or ordinal number.
Sending arrow key presses instead of typing characters to select the option might work, but I found in my testing that using the press() method was buggy. (A tab with Chrome settings would open randomly while executing tests that used press() to send either the return or the space key.)
All this said, I was unable to make tests run reliably with Chromeless. There seemed to be problems related to scrolling elements into view or not. While the webdriver-based systems http://webdriver.io, http://nightwatchjs.org and https://www.npmjs.com/package/selenium-webdriver are a bit more complicated to set up and code for, it might be worth the effort in order to get better reliability.
Whilst automating a collection of integration tests for various OAUTH providers, I found that watir does not seem to work with the Fitbit auth page, and always reports that the text_fields are disabled, no matter what I do.
This may be a bug in watir, or it may be something peculiar to the the Fitbit page (broken HTML or deliberate anti-scripting code).
The fitbit page is located at https://www.fitbit.com/oauth2/authorize/
watir can detect the email text_field exists:
browser.wait_until{ browser.text_field( name: 'email' ).exists? }
but any attempt to interact with it reports an error that it is disabled:
browser.text_field( name: 'email' ).wait_until_present
I've tried tabbing through all the fields on the page to see if this enables it, and I've tried using browser.driver.action.move_to to click on the element, but nothing seems to work.
Any thoughts?
The problem is that there are 3 text fields with the name "email". If you get a collection of the text fields, you can see that only some of them are visible:
browser.text_fields(name: 'email').map(&:visible?)
#=> [false, true, false]
Watir interacts with the first match, which in this case is one of the hidden fields. You actually want the second field - ie the visible one.
You can use the :visible flag to tell Watir to find the first visible one:
browser.text_field(name: 'email', visible: true).set('value')
I have a page where I wanted to use the "enableModifiedFlag" property, to let users know that their edit was not saved if they want to leave a page before saving.
I also have a search box in that page, and when I set the field to the static value "true", the message was popping because the search box was considered part of the page, and the field was modified. This all makes sense.
Since the "enableModifiedFlag" property can be computed, I decieded to set it to true only if the document was in edit mode, as the search box is not available at that time. The behaviour I got was that the message was not appearing anymore. I then tested with returning true as the value of the property, and it didn't change anything: the message was just gone. I then used the static values and set it to true, and the message was then appearing.
My conclusion is that there is a bug that prevents any computed value to be considered for that property.
So I had to find a workaround to prevent the message from popping up when users used the serach box. Here is the solution I came up with.
On the client side, we have access to the XSP object. One of its method is XSP._setDirty(). you can either set it to true or false, and it will affect if the page diplays the popup message or not. So in my search button, I added this code on the onclick event, on the client side:
XSP._setDirty(false,""); //so we don't get the "do you want to leave this page" message
showStandBy(); //show standby in case search is long or slow
return true;
That way, I tell my page not to show the message and the popup is not displayed.
It's still a shame you can't use the computed value for that property, but at least we have a workaround. Hope this will be useful to somebody!!!
GOT SOMETHING WORKING I THINK
This is what I have now, that controls teh flag:
<xp:this.enableModifiedFlag><![CDATA[${javascript:context.getUrlParameter("action")=="editDocument";}]]></xp:this.enableModifiedFlag>
I would rather use the document1.isEditable() function, but I wasn't successful with it so far, neither computed dynamically nor on page load.
At leaset I have something that seems to be working. Time to submit that code to the end users!
I have set up the jQuery-Validation-Engine addon (https://github.com/posabsolute/jQuery-Validation-Engine) and it works great on the submit button.
However, since i invoked a tab-based interface, it doesn't really bring the user back to the proper tab with the error fields.
As a work around, i've decided its better to validate each tab when leaving to the next one (as it is a step-wise tab) so that the button click at the end will only 'really' need to correct any errors on the currently displayed tab.
I'm using a simple anchor to call some div swaps (using negative margins for content off-page).
I'd like to invoke the validation method to this as well.
Documentation says it can only be attached to a form element.
Any ideas?
Update- i ditched the tab idea and am now using one big form so this no longer really applies.
No support led to going after a different approach. No longer needed.
I want to use the Watir to click a link that looks like a button attached the image.
I use the following method,but doesn't works:
#browser.div(:id,"NetworkAnalysisTabPanel").div(:index,1).div(:index,1).ul(:index,1).li(:index,1).link(:index,2).click
Note:
#browser.div(:id,"NetworkAnalysisTabPanel").div(:index,1).div(:index,1).ul(:index,1).li(:index,1).link(:index,2).flash
is working fine but click is not working in IE and FF
Link looks like this:
And HMTL like this:
Note: I am able to click on the element using selenium IDE with clickAt method
Try this (not tested):
browser.link(:class => "x-tab-strip-menu").click
If you can flash the link, but click does not do what you want, see this: How to find out which JavaScript events fired?
FYI what you have are links that are using standard background images controlled via CSS magic that keys on the class of the link to know what background to set. That's where the image comes from, and why you don't see it as part of the link in the HTML.
In that control, each tab is a list item element (li) in an unordered list (ul), and each list item has an ID, so that's the easiest way to tell it which tab you are trying to click inside.
Try identifying things starting with the LI that is the tab container, as within that container there is only one instance of each link of a given class. Of the 4 links, only one is without any kind of easy identifier, and if you need to click that one you'd need to use :index, but for the other 3 links using :class ought to work. This should result in code that is less brittle and subject to being broken if the order of tabs changes, or the page is refactored.
#browser.li(:id,"NetworkAnalysisTabPanel__ext-comp-1038").link(:class, "x-tab-strip-menu").click
If the number at the end of the ID is subject to change, you can try a regular expression to match the part you can predict and is unique from the others
#browser.li(:id,/NetworkAnalysisTabPanel__ext-comp-/).link(:class, "x-tab-strip-menu").click
If you can reliably identify the object and use .flash but .click does not seem to do anything, you may have to use .fire_event('onclick') instead or .click.
#browser.li(:id,/NetworkAnalysisTabPanel__ext-comp-/).link(:class, "x-tab-strip-menu").fire_event('onclick')
If that does not work, then you need to start experimenting with likely events that the control might be looking for (which will not necessarily show up in the HTML btw.. it may be in javascript or CSS etc)
UPDATE
This is where having an live example of the control that we can interact with is critical. doing some googling on the class names I was able to find one here and that let me play with it a little, and what I discovered is that it is looking for onmousedown. so, on that site, this works
browser.li(:id, 'TabPanel1__ctl07').link(:class, 'x-tab-strip-menu').fire_event('onmousedown')
Now since those ID's may not be the best identifier, a bit more digging (using .text on the li that holds the tab parts) found me some text, which in a menu like that ought to be unique.. SO, we can change this to make things a bit more robust and clearer as to what tab I'm clicking on (this will also be less subject to breaking if the tabs change around.
browser.li(:text, 'Menu 1').link(:class, 'x-tab-strip-menu').fire_event('onmousedown')
Lastly, since the click is causing client side code to execute, you may need a brief pause (a one or two second sleep) to wait for that portion of the page to re-render etc.