I have a page that catalogues media (think similar to an instagram page). The media is viewable on modals, and I'd like to record a "view count" for each piece of media. So whenever the modal containing that media is toggled open, it records a view.
This is a simplified version of my code:
<button data-toggle="modal" data-target="media-number-999">Click to view Media 999!</button>
<div class="modal" id="media-number-999">Media #999 viewable here!</div>
I also have a page set up where visiting that page automatically increases the viewcount by 1, and then redirects elsewhere (using django)
urls.py:
path('views/<id>/', views.media_views, name="mediaviews"),
views.py:
def media_views(request,id):
Media.objects.filter(id=id).update(views=F('views') + 1)
return redirect('media_detail', id=id)
The reason I'm doing this is so that I can then reference the viewcount in the database to use for sorting/filtering/etc.
How can I make a button that both opens the modal, and also records a visit to /views/999/ ? Also open to alternative approaches if there are better ways! I've tried to figure out how to use Ajax to do this but haven't had any luck.
Thanks!
Add an onclick function to
</button data-toggle="modal" data-target="media-number-999" onclick="recordview(999)">Click to view Media 999!<//button>
Create a new endpoint on your app that has the following format: /record/{id}
Make a function recordview() that makes a simple HTTP request (No need for AJAX) to your new endpoint
Remove the Media.objects.filter(id=id).update(views=F('views') + 1)in media_views to avoid double recording (From when they clicked vs when they opened) or change the model in media_views
(There is no / at the start of but i had to add it otherwise StackOverflow wouldn't format it properly. Make sure to remove it (And let me know if you know how to format it without the damn slash!)
Related
I am using Selenium to automate our document downloading tasks. The function I have looks like this:
def download_csv()
i = 2
while True:
try:
button_main_page=wait.until(ec.element_to_be_clickable((By.XPATH,'/.../div[{}]/button'.format(i)))
button_main_page.click()
i = i+1
button2=wait.until(ec.element_to_be_clickable((By.XPATH,'/...')))
button2.click()
download_button = wait.until(ec.element_to_be_clickable((By.XPATH,'/...')))
download_button.click()
driver.back()
driver.back()
except:
Next_Page = wait.until(ec.element_to_be_clickable((By.XPATH,'/...')))
Next_Page.click()
download_csv()
The main page has a table containing 10 elements and a button for each. To download each document, I need to navigate to the download location by doing 3 clicks and return to the main page to repeat the operation for the next element in the table, after that I am looking to repeat it on the next pages.
My issue is after I download the first element on the second page and do
driver.back()
I get returned to the original first page and start accessing the same elements again. The page url doesn't change and there is nothing I see going off in the Network tab when I click on "Next Page" button. I believe the content update is triggered when the next page button is clicked, however I have very limited knowledge of AJAX/js etc to know where to start looking.
Is it possible to bypass something like this with Selenium? And how do I look for what is triggering the table content update, if nothing is displayed in the network tab during button clicking.
Thanks!
I'm hoping to select a particular Region to highlight on the page load based on the link the user follows to get to that page. This is a drill-down report with multiple options, so the goal is to have all options available but focus on the one the user selected to reduce the number of times a user has to navigate to/from the base report to the drill-downs.
Currently, I'm trying to implement this solution https://svenweller.wordpress.com.../, further explained in an Oracle Community discussion here: https://community.oracle.com/..., but it is not working for me.
What I have now is similar to what is shown in those examples, and for now I'm just trying to link to a static Region Display Selector (RDS) tab (the goal will be to have the selected Region be dynamic based on which link is clicked in the feeder page, but I'm clearly not there yet).
I have a Dynamic Action set to fire on Page Load event, and a True action that executes JavaScript code and uses the JavaScript in the example (both with and without the Timeout function suggested in the Oracle thread). I have set Static IDs for the RDS and Region, but when I load the page the RDS still defaults to Show All (or the first region if Show All is off).
Can someone help me understand what I'm doing wrong?
Thanks.
let sesStorage = apex.storage.getScopedSessionStorage({
useAppId:true,
usePageId:true});
setTimeout(sesStorage.setItem( "tabs.activeTab", "#R3" ) { apex.region("tabs").widget().aTabs("getTabs")["#R3"].makeActive();}, 300);
\\version without setTimeout
let sesStorage = apex.storage.getScopedSessionStorage({
useAppId:true,
usePageId:true});
sesStorage.setItem( "tabs.activeTab", "#R3" );
I have done something like this in the past. Create a hidden variable on the page P1_TEST, make sure to set the value not to be protected.
You will need to set the value of that variable when the link is clicked.
Then you need to add static IDs TAB1, TAB2 etc. to the tabs of you region display selector.
Then add a DA on Page Load:
if (apex.item("P1_TEST").getValue() === "Value1"){
$(".apex-rds [href='#TAB1']").trigger('click');
} else if (apex.item("P1_TEST").getValue() === "Value2"){
$(".apex-rds [href='#TAB2']").trigger('click');
}
I have a product page with infinite scroll pagination. More products are loaded with Ajax.
Like this: domain/books.
When the user clicks on a product it will go to the product page: domain/books/the_selected_book.html
When the browser back button is clicked, domain/books loads but not the the Ajax content.
What I'm trying to accomplish is that the previous page loads exactly as the user leaved it and in the same position, when back button is pressed on the new page.
Just like YouTube works.
I have searched the web without finding a good option to do this.
What is the best solution?
window.onbeforeunload = function(){
created_session = window.pageYOffset;
};
and in the product page just add this javascript code after loading ajax content. Also keep a variable that counts how many product loaded from database. For example 5 times new product added (12 for each for example). You should keep this in a session and multiply them 5*12 = 60. You can load the products from database by its limit property.
if (isset? created session)
window.scrollBy(0, created_session for pageYOffSet);
Consider the following link:
https://www.officeworks.com.au/shop/officeworks/c/technology/monitors-digital-signage/27--monitors
The "View 100 per page" link does not change the url, nor does it have an onclick() attribute, yet it does reload the page and show up to 100 items. What variable has changed here, and how is it stored? Is it possible to get the HTML of the page with 100 items directly, without having to click the link or reload? Or get the page with 100 items programatically? (eg in Python)
One answer is the Ajax and Event system un Javascript.
You can have one HTML item like
<button id="but1">Show 100 items</button>
and add a "click" event on it from Javascript (example with JQuery)
$("#but1").click(function_but1_click);
This will launch the function_but1_click() function when the HTML button is clicked by the user.
After it, you can ask this function to perform an Ajax request to bring more data to the page (Example with JQuery)
function_but1_click()
{
$.get('myDataLoader.php',function(data){
items = JSON.parse(data)
draw_my_items(items)
});
}
And then implement the draw_my_items() function to display your new item on the screen.
The content is loaded dynamicly, an example of such feature is jQuery Ajax
http://api.jquery.com/jquery.ajax/
There is no need to add a link, or onclick. You can bind event handlers to html tags / classes / IDs ...
https://api.jquery.com/click/
I think the storage happend on the server side, session side. Because i was not able to find a related cookie.
Good luck!
I have a jquery portfolio gallery with 4 categories which are sortable. When you click on a category the portfolio is rearranged on the same page through jquery showing only those project in that category. Upon clicking a specific project the user can then see the project page/details. I want to add a back button on this page so that when a user is viweing a project they can return to category they were at before.
I tired the following which creates the back button but it take me back to the main portfolio page, not the category which I was browsing before.
function goBack() {
window.history.back();
}
This is one of the gallery page just in case: http://goo.gl/JeSNjD
Not knowing any of your application's code, this is a bit of a shot in the dark but I think I know what you're probably missing.
Using the history.back() will take you to the last page you visited (a page visit is only recorded if the URL is updated). If you are updating content in your website with jQuery and not loading a new page, your browser's history doesn't record this so back takes you back to the top page still.
What you will need to do is change your back button code to hide the current project, and redisplay the category page. You cannot use history.back().
Edit:
If you need more data to correctly rebuild the previous page, you can either change the url for the category page (not necessarily simple to implement but perhaps the most robust thing to do), or to store information about what page they came from. If you are using cookies, you could save navigation there, but you could also add a ref value to the query string when you navigate to a project page.
Category page:
Link to project
Project page:
Back button
Then use that information to reopen or resort your categories.
One problem is knowing which category a back button should return to.
For example, /portfolio/foothill-pasadena-2 should route back to the office category and /portfolio/131house should route back to the Residential category. If I emailed you a link to one of those and you clicked it to go straight to the project page, should there be a back button on the page when you go to it and would it take you back to all categories or to the category related to the project?
One thing you could do is to change your permalink structure to include the category, such as /portfolio/office/foothill-pasadena-2 and /portfolio/residential/131house. Then your could hard-code your back button to go to /projects. You have some jquery running there (wp-content/themes/yourtheme/js/jquery.custom.js):
var isotopeContainer = jQuery('.portfolio-wrapper, .gallery-wrapper'),
isotopeFilter = jQuery('#filter'),
isotopeLink = isotopeFilter.find('a');
isotopeContainer.isotope({
itemSelector : '.isotope-item',
layoutMode : 'fitRows',
filter : '.food-service'
});
isotopeLink.click(function () {
var selector = jQuery(this).attr('data-category');
isotopeContainer.isotope({
filter : '.' + selector,
itemSelector : '.isotope-item',
layoutMode : 'fitRows',
animationEngine : 'best-available'
});
isotopeLink.removeClass('active');
jQuery(this).addClass('active');
return false;
});
That is finding the four category links inside your filter div and adding a click function.
Maybe you can add some extra code that would get the document.referrer, checks it for a match against yoursite.com/new/projects/{category}/{project}, and pulls out the value of {category}. If the category matches one of your four values (food-service, office, residential, other), then call the click function on that element.