Why query params are disappearing from the url? - javascript

My React app is using react-router-dom#4.3.1.
This is how I add search after checkbox is clicked:
this.props.history.push({search: `?packages=${list.join(',')}`})
As soon as I click the checkbox, queryparam would display for a split second and disappear. UI does appear corresponding to the queryparams.
What could be the reason it is disappearing?

I think you need to provide pathname as well, path is required
Do it as this
this.props.history.push({pathname: '/yourpath', search: `?packages=${list.join(',')}`})
Hope it helps

Related

Select component didn't re-render when cell gets new record - Ant Design

Currently, I am using Select component as a column in Ant Design table like that:
enter image description here
But I found that although the record has changed, the value shown in "Select" component still is not changed. That means when I change to page 2 or 3, the "Action" column, or what shown in "Select" component in particular, still displays the same values, even thought the record is changed.
enter image description here
When I click on to change the value, "Select" works normally & call the API to update the correct record. I have tried to use "shouldCellUpdate" attribute of "Table" component but it didn't work.
Could you please help me solve this problem or give me a suggestion?
Thank you.

Preselected HTML Dropdown has a show/hide script, but only works on page and not via URL Parameter

Newcomer here, I've been learning from this community a lot and finally came to a sort of a small problem.
So right now I have a html dropdown option/selector.
On that selector's ID I have a code that grabs the URL Parameter and assigns the correct option, and it works. If you put in the right url parameter it takes you to the page and preselects the option. I also have a code that shows or hides sections based on the selection, using a mix of IDs and Classes as it's a complicated approach.
<script>
$(function() {
$('#all-content').change(function(){
$('.hide-knowledgecenter').hide();
$('#' + $(this).val()).show();
$('.' + $(this).val()).show();
});
});
</script>
Now the problem is that, using the URL parameter the show/hide script doesn't run based on the preselected option, it just shows the preselected option but it won't run the code.
this is the preselect code. I don't know if it's a hiearchy problem or what but i can't seem to get it to work. Should the preselect code be global to the whole website or only loaded on this specific page? Is there one code that should go first then the second? Or is it something completely else?
<script>
var val = location.href.match(/[?&]all-content=(.*?)(?:$|&)/)[1]; // get params from URL
$('#all-content').val(val); // assign URL param to select field
</script>
Thanks in advance.
Simply added
}).triggerHandler('change');
to the bottom of the filter code and it loaded along with the preloader.

How to find the first element if Xpath returns a list of elements(selenium-python)

browser = webdriver.Chrome(path)
browser.maximize_window()
browser.get("https://www.flipkart.com")
browser.find_element_by_xpath('//button[#class="_2AkmmA _29YdH8"]').click()
browser.find_element_by_name("q").send_keys("Mobiles")
browser.find_element_by_xpath("//button[#class='vh79eN']").click()
p = browser.find_elements_by_xpath("//div[#class='_3wU53n']")
Using the above code, I have to search for Mobiles in flipkart and click on any Mobile which should that open page onto new Tab.
I am facing issue with locating a mobile as Xpath returns a list of Mobiles. I want to find the first element and click so that it opens in new tab.
Can Anyone help me with this? Thanks!
When you used browser.find_elements_by_xpath("//div[#class='_3wU53n']") p will be a lists, so you can access items as easy as p[0], more info here.
But if you only need the first element, I suggest u should use browser.find_element_by_xpath("//div[#class='_3wU53n']") without the "s" as it should select the first element in that class
You can store in List by using list class in selenium.
List lists=driver.findElements(By.xpath(".."));
lists.get(0).click();
//Above code for click first element in lists
Once you "CLICK" the SEARCH button, the webpage redirects to a new page which shows the list of mobile. However, it takes some time to load the page. So you need to add some delay to it, so as to perform the next actions.
<the code above remains the same>
browser.find_element_by_xpath("//button[#class='vh79eN']").click()
import time
time.sleep(3) # Added a delay
browser.find_element_by_xpath("//div[#class='_3wU53n']").click() # Changed the "elements" to "element"
This opens the first mobile phone in the new tab.
PS. This code works great if you need only the first mobile. If you need all the mobiles on the page, you will have to create a loop for it!

Ember.js outlet's model change but the content not change

In my user controller,i use a outlet to render userLog section,and use controllerFor('userLog').set('model',App.UserLog.find(model.id)) to set the model of userLog,but i want to add a button to userLog section ,when user click it,it will load more logs,but i tried to push new object to its model,nothing happened.
here is the project address:https://bitbucket.org/magicshui/web/src/4ff895b5c22823c6ec1c1536ca2e7b59237f0459/assets/coffee/app/routes/?at=master
when you goto web/index.html#/users and then click one user name,it will show the section,because i haven't set all url correctly,so you should fill into the address bar this address directly.
the problem file is user.coffee and userLog.coffee
thanks for your help
you should be using pushObject instead of push that's how Ember catches that you've changed the array and updates the template

How do I combine check all script and filtering?

I am new to JavaScript and jQuery, but have used HTML and CSS before. In any case, I appreciate the help. I have implemented the script discussed here http://net.tutsplus.com/tutorials/javascript-ajax/using-jquery-to-manipulate-and-filter-data/ for filtering data and the one discussed here http://www.dustindiaz.com/check-one-check-all-javascript/ for a check one to check all script. The problem is, when I filter the list of items and then use the check all box, it is checking even the JS items that are hidden from the user due to filtering. Does this make sense?
I have been trying to figure out how to edit the check all script so that only items with the "visible" class (as added to visible checkboxes with the filtering script) are checked with the checkAll button. The original script had:
var checks = document.getElementsByName('del[]');
I was trying to do something like this (it wasn't working, of course):
var visiblechecks = $('input:del[]:checked.visible');
among other things.
Thank you! Also, if you have a recommended resource, I would appreciate it.
var visiblechecks = $('input[name="del[]"]:checked:visible');
Your selector just needs a bit of refinement. Try:
$(".myCheckAllSelector").change(function () {
$("input[name='del[]']:visible").attr("checked", $(this).is(":checked"));
});
This should set the checked attribute of all currently visible checkboxes with the name del[] to the checked status of the check all box. You simply need to update the check all selector appropriately to target your master checkbox element.
You don't necessarily "need" to add a visible class as there is a :visible filter you can use to make that determination for you. However, just change your selector from input to input.visible if you still wish to use the class and remove the :visible filter..

Categories