on redirecting to a previous html page the page should not refresh
Question
Actually I have two fields in "click.html".One is "Name" field and other is "client_ip" field.I have entered my name in the "Name" field and later on click of "client_ip" text box has redirected to index.html.
In index.html I'll select some required client_ip's and redirect the page again to click.html.So that the selected client_ip fields are placed in the client_ip text box of click.html page.
Now after redirecting to the click.html,the name I had entered in the "Name" text box is vanishing because of page refresh while redirecting.But Now,I want to redirect to click.html without refreshing the click.html page.How can I achieve this ...
My click.html:
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/mpryvkin/Plugins/master/pagination/simple_numbers_no_ellipses.js"></script>
<link rel='stylesheet' href='style.css'>
<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
</head>
<body>
<div>
<label>Start Time:<select id="Start Time" id="startID" name="StartTime">
<option value="00:00" >00:00</option>
<option value="00:30">00:30</option>
<option value="01:00">01:00</option>
<option value="01:30">01:30</option>
<option value="02:00">02:00</option>
<option value="02:30">02:30</option>
<option vlaue="03:00">03:00</option>
</select></label>
</div>
<div id="clicDiv">
Client IP :<input type="text" id="ipClick" onclick="getValue();" name="Client IP" style="width:600px;"/>
</div>
<script>
function getUSERIP(){
if(!window.location.href.match(/client_ip=.*?([^\&]+)/))
return;
var ip = window.location.href.match(/client_ip=.*?([^\&]+)/)[0].replace('client_ip=','');
var res = ip.replace(/%2C/g,",")
$("#ipClick").val(res);
}
getUSERIP();
function getUSERName(){
if(!window.location.href.match(/name=.*?([^\&]+)/))
return;
var name = window.location.href.match(/name=.*?([^\&]+)/)[0].replace('name=','');
if($("#hiddenName").length)
$("#hiddenName").val(name);
else $('#textDiv').val(name);
}
getUSERName();
function getStartTime(){
if(!window.location.href.match(/StartTime=.*?([^\&]+)/))
return;
var StartTime = window.location.href.match(/StartTime=.*?([^\&]+)/)[0].replace('StartTime=','');
var res = StartTime.replace(/%253A/g,",")
if($("#hiddenName5").length)
$("#hiddenName5").val(res);
else $('#startID').val(res);
}
getStartTime();
function getValue(){
var name = $("#textDiv").val()?('?name='+$("#textDiv").val()):'';
location.href='/home/divya/html_docs/index.html'+name;
}
</script>
</body>
</html>
My index.html:
<!DOCTYPE html>
<meta charset='utf-8'>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/mpryvkin/Plugins/master/pagination/simple_numbers_no_ellipses.js"></script>
<link rel='stylesheet' href='style.css'>
<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
<script>
$(document).ready(function() {
$("#ip").val('');
$('#example').DataTable( {
"pagingType": "full_numbers"
} );
} );
</script>
</head>
<body>
<div>
<form action="/home/divya/html_docs/click.html" method="get" >
Client_ip :<input type="text" id ="ip" name="client_ip" style="width: 600px;"/>
<div id="subDiv">
<button type="submit" value="Submit">Submit</button>
</div>
</div></br>
<table id="example" class="display" cellspacing="0" width="100%">
</table>
<script>
var selectedIps = [];
var tabulate = function (data,columns) {
var svg = d3.select('#ip').append("svg")
var table = d3.select('#example')
var thead = table.append('thead')
var tbody = table.append('tbody')
thead.append('tr')
.selectAll('th')
.data(columns)
.enter()
.append('th')
.text(function (d) { return d })
var rows = tbody.selectAll('tr')
.data(data)
.enter()
.append('tr')
var cells = rows.selectAll('td')
.data(function(row) {
return columns.map(function (column) {
return { column: column, value: row[column] }
})
})
.enter()
.append('td')
.text(function (d) { return d.value })
.append("input")
.attr("id","change")
.attr("type", "checkbox")
.style("float","left")
.on("change", function(d, i) {
if ($(this)[0].checked) {
if (selectedIps.indexOf(d.value) < 0) {
selectedIps.push(d.value);
}
} else {
if (selectedIps.indexOf(d.value) > -1) {
selectedIps.splice(selectedIps.indexOf(d.value), 1);
}
}
$('#ip').val(selectedIps.join(','));
});
return table;
}
d3.csv('some1.csv',function (data) {
var columns = ['client_ip']
tabulate(data,columns)
});
</script>
</body>
</html>
Can anyone please help me out...
1 answers
solution1
1 ACCPTED 2015-09-30 05:42:51
Update function on click.html
function getValue(){
var name = $("#textDiv").val()?('?name='+$("#textDiv").val()):'';
location.href='/home/divya/html_docs/index.html'+name;
}
on index.html
Put hidden in form element
<input type="hidden" id="hiddenName" name="name" />
Put this function on common js file or in both index.html and click.html
function getUSERName(){
if(!window.location.href.match(/name=.*?([^\&]+)/))
return;
var name = window.location.href.match(/name=.*?([^\&]+)/)[0].replace('name=','');
if($("#hiddenName").length)
$("#hiddenName").val(name);
else $('#textDiv').val(name);
}
getUSERName();
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.
Related Question
Redirecting to previous page
refresh the page without redirecting
Page will refresh instead of redirecting
Refresh previous page
Redirecting html page
Redirecting html page with javascript
Page refresh on submitting form redirecting to another page
Refresh previous page dropdown selection
Refresh html page to the top of the page
Keep previous values when redirecting to a new page
Related Tags