Javascript jQuery Error Overload Ajax Request? - javascript

I have two buttons. One Button refreshes the table (html table) with a ajax php request. And there is another button to refresh it every 10 seconds. If I try to access the document it throw a lot of errors that I don't know about how to solve the problem.
My Javascript Code is here:
<script>
$(document).ready(function(){
$("#reloadLoginActivities").click(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities"
});
});
$("#liveUpdateLoginActivities").click(setInterval(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities2"
},10000);
}));
});
</script>
I get a lot of errors in : https://prnt.sc/pp33s1
My jQuery File is here: https://www.prodigy-official.de/resources/js/jquery-3.3.1.min.js

I think that your formation is not correct.
$(document).ready(function(){
$("#reloadLoginActivities").click(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities"
});
});
$("#liveUpdateLoginActivities").click(setInterval(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities2"
});
}, 10000));
});

$(document).ready(function () {
$("#reloadLoginActivities").click(function () {
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities"
});
});
$("#liveUpdateLoginActivities").click(liveActivityHandler);
function liveActivityHandler () {
$("#liveUpdateLoginActivities").text("Stop Live Update");
setInterval(function () {
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities2"
});
}, 10000);
}
});

Related

<div> value not updating in html page

I am using jquery to auto update a part of the HTML page. Following is the code
$(document).ready( function() {
$('#auto').load("static/l.txt");
refresh();
});
function refresh() {
setTimeout(function() {
$('#auto').load("static/l.txt");
refresh();
}, 1000);
}
The id of the HTML div tag to be updated is auto
The file static/l.txt is continuously being updated by another python program.
But when I load the html page , the div only gets updated once and does not update the value until and unless I open the developers console on the browser.
I am hosting the web page using Flask in python
How about trying this?
var counter =0 ;
$(document).ready( function() {
$('#auto').val("starting");
refresh();
});
function refresh() {
setInterval( function() {
counter ++;
$('#auto').val(counter);
}, 1000);
}
Use a callback to know, when the content is actually loaded and move the function definition in the ready block, also.
$(document).ready(function() {
function loadData() {
$('#auto').load('static/l.txt', function(completed) {
setTimeout(loadData, 1000);
});
}
loadData();
});

Get yahoo comments with web scraping

I'm trying to get the news comments on yahoo, where there is a link "See reactions", with the following id: "caascommtbar-wide" and tried to get the element with CasperJS, Selenium, ScrapySharp, to click on the link and display the comments, but in those tools you never find the element and I've even tried using the XPath
CasperJS:
casper.then (function () {
if (this.exists ('a.caascommtbar-anchor')) {
this.echo ("It exists");
} else
this.echo ("It Does not Exist");
});
casper.then (function () {
// Click on 1st result link
this.click ('a.caascommtbar-anchor');
});
Selenium:
driver.FindElement (By.Id ("caascommtbar-anchor")). Click ();
Does anyone know why you can not access this part of the HTML code where the comments are located?
It should be noted that the same thing happens to me when trying to access the Facebook comments contained in the news forums.
As Isaac said the part of pages are loaded asynchronously, so you should implement waitFor steps in your code. Here is the code that does just that.
var url = "https://es-us.vida-estilo.yahoo.com/instagram-cierra-la-cuenta-de-una-modelo-por-ser-gorda-103756072.html";
var casper = require('casper').create({
viewportSize: {width: 1280, height: 800},
});
casper.start(url, function() {
this.echo('Opened page');
});
casper.waitForSelector('a.comments-title', function() {
this.click('.comments-title');
});
casper.waitForSelector('ul.comments-list > li', function() {
this.echo(this.getHTML('ul.comments-list'));
});
casper.run();
Hope that helps
The problem was why the page was not loaded yet and I had to wait, I'm new with casperjs.
Now I have the problem when trying to remove all comments along with their answers, but can not find an algorithm to help me. Try to press all the answer buttons, but only get the first answers to the first comments.
casper.waitForSelector('button.showMore', function () {
this.click('.showMore');
}, function onWaitTimeout() {
});
var buttons;
casper.waitForSelector('ul.comments-list', function getLinks() {
buttons = this.evaluate(function ()
{
var buttons = document.getElementsByClassName('replies-button');
buttons = Array.prototype.map.call(buttons, function (button) {
button.click();
casper.waitForSelector('ul.comments-list', function () {
casper.wait(3000, function () {
});
});
return button.getAttribute('class');
});
return buttons;
});
}, function onWaitTimeout() {
});
function wait5seconds() {
casper.wait(3000, function () {
});
}
casper.waitForSelector('ul.comments-list > li', function () {
var x = this.getHTML('ul.comments-list');
this.echo(x);
}, function onWaitTimeout() {
});
casper.run();

JQuery function POST on the same page works only twice

The function below allows me to use an href link to POST request to the same page. It works for the first 2 times I click on the link, but this function doesn't seem to be recognized after a third POST request.
$(function() {
$('.sort-link').on('click', function(e) {
e.preventDefault();
$.post(this.href, function(data) {
$('.container').html(data);
});
});
});
I need to modify the function to have it work even after a POST request has been submitted.
As per #Elvin85's advice, I revised my function as follows:
$(function() {
$(document).on("click", '.sort-link', function(e) {
e.preventDefault();
$.post(this.href, function(data) {
$('.container').html(data);
});
});
});
It was a DOM-related issue.

How to override function in javascript ? casperjs then function

I want to check if the "login page" appear before each step :
Here is my code:
casper.then(function() {
checkIfRedirectedToLoginPage();
this.evaluate(function() {
document.getElementById("").click();
});
});
casper.then(function() {
checkIfRedirectedToLoginPage();
this.evaluate(function() {
});
});
function checkIfRedirectedToLoginPage(){
if loginPage{
this.then(function(){
this.sendKeys(x('//*[#id="user_name"]'), USER_NAME);
this.sendKeys(x('//*[#id="password"]'),PASSWORD);
this.click(x(//*[#id="login"]));
});
}
}
How it's possible to override casper.then without littering my code with the checkIfRedirectedToLoginPage function . thanks
it is possible to do this though it is not recommended. what I would suggest instead is to create a helper method that calls casper.then and accepts a function as a callback.
function myCasperThen(callback) {
return casper.then(function() {
checkIfRedirectedToLoginPage();
callback();
}
}

How to call a method from controller more once time? AJAX

Sorry if the question is really dumb, however, I couldn't find how to solve it.
I have a very simple methid in a controller:
public string ExactSeconds()
{
string str = DateTime.Now.Second.ToString();
return str;
}
The view is simpler than the method:
<p id="rData"></p>
<p id="qqqqq">click me!</p>
JavaScriptCode:
<script type="text/javascript">
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ExactSeconds";
$.get(url, null, function (data) {
$("#rData").html(data);
});
});
});
});
However, When I click at id="qqqqq", then it just uploads data(seconds) just for the first time. Then if I click the second time and the next times, then alert('') works perfectly, however it is not called method ExactSeconds, that is I cannot see updated seconds at the view.
How to call method ExactSeconds() always when I click at #qqqqq?
When I remove your AJAX calls, this works fine.
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
$("#rData").html(Date.now);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="rData"></p>
<p id="qqqqq">click me!</p>
Secondly, why do you have nested one AJAX get call inside another. How about just one call?
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ProverbPartialView";
$.get(url, null, function (data) {
$("#rData").html(data);
});
});
});
<script type="text/javascript">
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ProverbPartialView";
$.get(url, null, function (data) {
$.get(url, null, function (data) {
$("#rData").empty();
$("#rData").html(data);
});
});
});
});
Try this by adding $("#rData")..empty(); in the code

Categories