How to refresh the page and overwriting content?
Question
Testing on IBM Worklight with a HTTP adapter.
My question is: How to refresh the page and overwriting old with new set of list items? Or emptying the list items and add/append new list items?
Without page refresh concept,from drop down, if sport is selected the cnn sport news is appended then if technology is selected the cnn technology news is appended after the last list tag ended that is after sport news.
With page refresh concept (
window.location.reload();). By trying the js code, the page refreshes but cannot append rss feeds item.
I want at a time one news category will be displayed and previous list will be overwritten.
HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>RSSnew</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="stylesheet" href="css/RSSnew.css">
<script>window.$ = window.jQuery = WLJQ;</script>
</head>
<body id="content" style="display: none;">
<!--application UI goes here-->
<select size="2" id="cc">
<option selected>select categories</option>
<option value="Sport">Sport</option>
<option value="Technology">Technology</option>
</select><br>
<input type = "button" onclick="search()" value="Search">//onclick="reload(),search()"
<ul id="news"></ul>
<script src="js/initOptions.js"></script>
<script src="js/RSSnew.js"></script>
<script src="js/messages.js"></script>
</body>
</html>
JS
function search()
{
window.location.reload();
var a=$("#cc").val();
alert(a);
var invocationData={
adapter:'cnn',
procedure:'getStories',
parameters:[a]
};
var options={
onSuccess:su,
onFailure:fa
};
WL.Client.invokeProcedure(invocationData, options);
}
function su(result)
{
alert("success");
var a=result.invocationResult.rss.channel.item.length;
var i;
for(i=0;i<=a;i++)
{
var b=result.invocationResult.rss.channel.item[i].title;
var c=result.invocationResult.rss.channel.item[i].description;
var d=$("#news");
var e=$('<li><b><u>'+b+'</u></b></li>');
var f=$('<li>').html(c);
d.append(e,f);
}
}
function fa()
{
alert("failure");
}
function reload() {
window.location.reload();
//$("#news").remove();
// search();
}
2 answers
solution1
0 2015-04-08 05:15:35
Instead of using window.location.reload(); simply empty the contents of the #news UL element.
In the search() function, replace the reload line with ul.innerHTML = ''; . Should work.
solution2
0 2015-04-08 05:25:24
If you use jQuery setInterval function method, you will refresh & overwrite your data without reloading page.
var doYourStuff = function () {
// Your functionality
};
setInterval(doYourStuff, 1000);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.