Full AJAX only with pushState to work correctly with history

This commit is contained in:
Jakub Vrana 2010-11-12 17:09:30 +01:00
parent b37435d716
commit b535853694
6 changed files with 41 additions and 17 deletions

View file

@ -64,7 +64,7 @@ if ($_POST["save"]) {
}
?>
<form action="<?php echo h($_SERVER["REQUEST_URI"]); // required for sending the form after an AJAX request ?>" method="post" enctype="multipart/form-data">
<form action="" method="post" enctype="multipart/form-data">
<?php
if ($fields) {
echo "<table cellspacing='0'>\n";
@ -106,8 +106,5 @@ if ($fields) {
if ($update) {
echo "<input type='submit' name='delete' value='" . lang('Delete') . "' onclick=\"return confirm('" . lang('Are you sure?') . "')" . (isset($_GET["select"]) ? " &amp;&amp; !ajaxForm(this.form, 'delete=1')" : "") . ";\">\n";
}
if (isset($_GET["select"])) {
echo "<a href='" . h($_SERVER["REQUEST_URI"]) . "' onclick='return !ajaxMain(this.href, undefined, event);'>" . lang('Cancel') . "</a>\n";
}
?>
</form>

View file

@ -130,7 +130,7 @@ document.getElementById('username').focus();
*/
function selectQuery($query) {
global $jush;
return "<p><a href='" . h(remove_from_uri("page")) . "&amp;page=last' title='" . lang('Page') . ": " . lang('last') . "' onclick='return !ajaxMain(this.href, undefined, event);'>&gt;&gt;</a> <code class='jush-$jush'>" . h(str_replace("\n", " ", $query)) . "</code> <a href='" . h(ME) . "sql=" . urlencode($query) . "'>" . lang('Edit') . "</a>" . (is_ajax() ? " <a href='" . h($_SERVER["REQUEST_URI"]) . "'>#</a>" : "") . "\n";
return "<p><a href='" . h(remove_from_uri("page")) . "&amp;page=last' title='" . lang('Page') . ": " . lang('last') . "' onclick='return !ajaxMain(this.href, undefined, event);'>&gt;&gt;</a> <code class='jush-$jush'>" . h(str_replace("\n", " ", $query)) . "</code> <a href='" . h(ME) . "sql=" . urlencode($query) . "'>" . lang('Edit') . "</a>\n";
}
/** Description of a row in a table

View file

@ -361,10 +361,14 @@ function redirect($location, $message = null) {
$_SESSION["messages"][] = $message;
}
if (isset($location)) {
if ($location == "") {
$location = ".";
}
if (!is_ajax()) {
header("Location: " . ($location != "" ? $location : "."));
header("Location: $location");
exit;
}
header("X-AJAX-Redirect: $location");
$_POST = array();
}
}

View file

@ -289,6 +289,4 @@ $translations = array(
// function translation used in Editor
'now' => 'teď',
'Cancel' => 'Storno',
);

View file

@ -231,7 +231,7 @@ if (!$columns) {
$result->seek($limit * $page);
}
$email_fields = array();
echo "<form action='" . h($_SERVER["REQUEST_URI"]) . "' method='post' enctype='multipart/form-data'>\n"; // $_SERVER["REQUEST_URI"] is required for sending the form after an AJAX request
echo "<form action='' method='post' enctype='multipart/form-data'>\n";
$rows = array();
while ($row = $result->fetch_assoc()) {
$rows[] = $row;

View file

@ -172,13 +172,17 @@ function textareaKeydown(target, event, tab, button) {
function ajax(url, callback, data) {
var xmlhttp = (window.XMLHttpRequest ? new XMLHttpRequest() : (window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : false));
if (xmlhttp) {
xmlhttp.open((data === undefined ? 'GET' : 'POST'), url);
xmlhttp.open((data ? 'POST' : 'GET'), url);
if (data) {
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
}
xmlhttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xmlhttp.onreadystatechange = function (text) {
if (xmlhttp.readyState == 4) {
var redirect = xmlhttp.getResponseHeader('X-AJAX-Redirect');
if (redirect && history.replaceState) {
history.replaceState(null, '', redirect);
}
callback(xmlhttp.responseText);
}
};
@ -203,16 +207,12 @@ function ajaxSetHtml(url) {
var ajaxState = 0;
var ajaxTimeout;
/** Load content to #main
/** Safely load content to #main
* @param string
* @param [string]
* @param [MouseEvent]
* @return XMLHttpRequest or false in case of an error
*/
function ajaxMain(url, data, event) {
if (event && event.ctrlKey) {
return false;
}
function ajaxSend(url, data) {
var currentState = ++ajaxState;
clearTimeout(ajaxTimeout);
ajaxTimeout = setTimeout(function () {
@ -230,6 +230,29 @@ function ajaxMain(url, data, event) {
}, data);
}
/** Load content to #main
* @param string
* @param [string]
* @param [MouseEvent]
* @return XMLHttpRequest or false in case of an error
*/
function ajaxMain(url, data, event) {
if (!history.pushState || (event && event.ctrlKey)) {
return false;
}
history.pushState(data, '', url);
return ajaxSend(url, data);
}
/** Revive page from history
* @param PopStateEvent
*/
window.onpopstate = function (event) {
if (ajaxState || event.state) {
ajaxSend(location.href, event.state);
}
}
/** Send form by AJAX GET
* @param HTMLFormElement
* @param [string]
@ -239,7 +262,9 @@ function ajaxForm(form, data) {
var params = [ ];
for (var i=0; i < form.elements.length; i++) {
var el = form.elements[i];
if (el.name && (!/checkbox|radio|submit|file/i.test(el.type) || el.checked)) {
if (/file/i.test(el.type) && el.value) {
return false;
} else if (el.name && (!/checkbox|radio|submit|file/i.test(el.type) || el.checked)) {
params.push(encodeURIComponent(el.name) + '=' + encodeURIComponent(/select/i.test(el.tagName) ? selectValue(el) : el.value));
}
}