I am using ionic 4. I want to do search function in my apps. I am using search bar and get the result from API.
My problem is it always output duplicate result.
One problem is I haven't typing the word finish it already match the result that I want to search, then it will output the result.
Another problem is when I finish typing it output again the result.
How can I solved or avoid this problem?
Here is my html code:
<ion-searchbar [(ngModel)]="name" (ionCancel)="onCancel($event)" (ionChange)="Search($event)"></ion-searchbar>
Here is my home.page.ts
Search() {
this.myService.getSearch(this.name);
}
The second one sounds like you are not wiping the data in your this.myService.getSearch call - check what it does in there, is it starting from a new list or just returning more results? If that doesn't solve that issue then post the code for that section.
The first issue is by design.
You can slow this down with the debounce option:
<ion-searchbar debounce="1500"></ion-searchbar>
There are two input events you can experiment with ionChange and ionInput - they act differently but I cannot remember exactly which does which, you will have to try them both. A third option would be to handle neither of them and just use a submit button.
Related
Situation:
I have a pandas dataframe which I convert into an html table via df.to_html(). I then add the DataTables class to the table. This DataTables-table has the following columns:
ID | X | Y | Val |...More columns...| Selection_Criteria |...More columns...
The values in Selection_Criteria can be either 1 or 0. I know that with:
$('#ProductList').DataTable( {
...
"fnInitComplete": function(oSettings, json) { $('#ProductList tbody tr:eq(0)').click(); }
});
(Source: http://code.datatables.net/forums/discussion/38171/automatic-select-of-the-first-row-on-reload)
..it is theoretically possible to select the first row. (In reality, I have not been able to simulate a click for the first row.)
But my question goes more towards: How do I automatically pre-select ALL rows where the value is 1 in Selection_Criteria? What is the best approach? Should this be done client/server side?
In pandas the term "select"(ing) means to screen out that which was not selected for. I know that in a table on a web page, selected can mean being highlighted to stand out from the others. There are a couple of ways you can do this on the server side. You could display two tables, one for each state of Selection_Criteria. This would save you the hassle of trying to select individual rows out of a table in the first place (which would be done with Javascript, not Pandas). While pandas has the ability to add a class to the resulting html, the class is applied to the element.
If you are using jquery you are going to use these pieces. as you haven't put example data I can't be exact.
replace x in the next line with the number of columns the Selection_Criteria=1 is across the table
$( "tr td:nth-child(x):contains('1')" ).addClass('selected');
There are solutions on the backend using beautifulsoup and css selectors, or lxml.etree with xpath selectors. But jquery is going to be the most concise with this problem.
#Aliester. Thank you for the pointer!
This helped me find the solution to my own question. What I did:
1.) Identify row index that I want to select when the table loads.
2.) Pass the index to js.
3.) Loop over the indices and apply the following command to each index entry:
table.row(':eq('+hit_index_row+')').select();
So I am using the API to select each individual row. This works for me and hopefully could be helpful to others as well. It may be a bit hacky, so more elegant suggestions are welcome!
You can do this by providing a function for the "rowCallback" option when initializing the DataTable. https://datatables.net/reference/option/rowCallback
Also it is generally better to use the API methods to select rows instead of just changing the class. I found that the DataTable + Select libraries keep an internal collection of selected row indexes (just current page if serverside processing is on) instead of using the class to resolve selected items.
So while the display will look right, if you just change the class, if you rely on any of the API methods to get selected items later on there will be issues. Additionally just changing the class on the row will not fire any of the "select" events on the table so you can't rely on those either.
I have this logic which gets the current page's title first clicks on next button, fetches the title again and if both the titles are the same, meaning navigation has not moved to the next page, it clicks on Next again.
However, my problem is that the title element's Xpath differs - the same title element has two Xpaths. One is some pages the other in some other pages.
It is either this,
(.//span[#class='g-title'])[2]
OR
.//span[#class='g-title']
So, how can I handle this?
If the element has two xpath, then you can write two xpaths like below
xpath1 | xpath2
Eg: //input[#name="username"] | //input[#id="wm_login-username"]
It will choose any one xpath
You can use or operator like
(.//span[#class='g-title'])[2] or .//span[#class='g-title']
For more details : Two conditions using OR in XPATH
You can use or, like below:
//tr[#class='alternateRow' or #class='itemRow']
I had an interesting insight I had using this method. In my python code I was clicking a cart button and the or "|" ONLY works with separate xpath statements like so ...
WebDriverWait(webdriver,20).until(EC.visibility_of_element_located((By.XPATH,"//*[#class='buttoncount-1'] | //button[contains(text(), 'Add to Cart')]")))
or
btn = webdriver.find_element_by_xpath("//*[#class='buttoncount-1'] | //button[contains(text(), 'Add to Cart')]")
I found that "or" ONLY works when they share the same bracket []
WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"//button[contains(text(), 'Add to Cart') or contains(text(),'Buy')]"))).click()
And since you're here. If you're curious about "and" statements this worked for me...
WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"//button[contains(text(), 'Continue To Order Rev')][#data-attr='continueToOrderReviewBtn']"))).click()
Simply pairing two separate statements was sufficient. No "and" necessary.
Note: This was all in python. I do not know how this will transfer over to java. Hope this was somewhat useful. It took me a few migraines to narrow this down.
I'm trying to check if a value is contained in the innertext of a webelement but I'm having a little problem: frames seem to change at every refresh of the pages.
These are the steps I've recorded:
Browser("SystemPage").Page("SystemP").Frame("dme2_header").Image("Gestione Anagrafiche").Click<br>
Browser("SystemPage").Page("SystemP").Frame("dme2_appl").WebEdit("pdrBean.pdrPod").Set parameter("POD")<br>
Browser("SystemPage").Page("SystemP").Frame("dme2_appl").WebButton("Cerca").Click
Browser("SystemPage").Page("SystemP").Frame("dme2_appl_2").Image("show_files").Click
Browser("SystemPage").Page("SystemP").Frame("dme2_appl_6").Image("Lente").Click
cctype = Browser("SystemPage").Page("SystemP").Frame("dme2_appl_7").WebElement("arrow_down").GetROProperty("innertext")<br>
DataAct = Browser("SystemPage").Page("SystemP").Frame("dme2_appl_7").WebElement("arrow_down_2").GetROProperty("innertext")<br>
Browser("SystemPage").Page("SystemP").Frame("dme2_header").Image("Gestione Anagrafiche").Click
The frames "dme2_appl6" and "dme2_appl7" changes at every refresh of the two pages.
The question is simple: how can I rewrite these two actions to make them universal?
I've tried to do something like:
Set objFrame = Frame("title:=dme2_appl_.")
and then
Browser("SystemPage").Page("SystemP").objFrame.Image("Lente").Click
But QTP gives me an error in return: "property or method not supported by the object"
Please try using the below code
Browser("SystemPage").Page("SystemP").Image("Lente").Click
Avoid using the "Frame" and if you really want to use it, put regex for name property of Frame.
Go to Object Properties--> Click on the Frame object --> Mandatory Properties--> Change name property as
like iFrame_213123123 to i.*
Hope this will solve your problem.
I don't think you can use a frame object that way. When you write Page().Frame() UFT sets the frame's parent in different way than if you first create the Frame.
Think of Frame() as a function that behaves differently when called on a Page or as a free function.
Try:
Browser("SystemPage").Page("SystemP").Frame("title:=dme2_appl_.")
I wasted a lot of time trying to solve this problem but didn't find any solution. I wanted to use django-autocomplete-light in Admin-interface not only selecting values existing in another table but adding new values. If I use it like this:
class MeaningAdmin( admin.ModelAdmin):
form = autocomplete_light.modelform_factory( Meaning)
everything is Ok and I can see and use 'add-another'-button on the form, but when I use it like following:
class MeaningAdmin( admin.ModelAdmin):
form = MeaningForm
'add-another'-button disappears. Does anybody know how to force get this button back in the 2nd case?
I'm doing some drag and drop js testing with selenium-client. It works (taking screengrabs before and after clearly show the elements to switch places), but I'm having trouble programatically asserting the change happened.
Am I mental, or can I not do something like:
selenium.assert_equal("css locator", "expected id of element")
which, in this case, would look something like:
selenium.assert_equal("css=li:nth-child(1)", "li#list_item_2")
Any tips on how to implement this would be great.
Thanks,
Adam
Edit: if I had selenium.get_element that would take a selector and return what it was, I could then perform the assertion in the next step.
i.e.
element = selenium.get_element("css=li:nth-child(1)")
assert_equal(element, "li#list_item_2")
(I think).
Your example won't work because you're comparing two strings that aren't equal. One way to assert that your element has moved would be to use isElementPreset as demonstrated below:
//before drag and drop
assertTrue(selenium.isElementPresent("css=#source li:nth-child(1)"));
assertFalse(selenium.isElementPresent("css=#target li:nth-child(1)"));
//drag and drop code here
...
//after drag and drop
assertTrue(selenium.isElementPresent("css=#target li:nth-child(1)"));
assertFalse(selenium.isElementPresent("css=#source li:nth-child(1)"));
This example uses the Java client API, but it should be easy to work out how to do it in your preferred client API. It will also depend heavily on your application, as the above will check that the element with id of 'target' has one child li element before the drag and drop, and none afterwards. If you have a snippet of your HTML source I might be able to prove a more robust example.