Skip to content

Instantly share code, notes, and snippets.

@SoldierCorp
Created May 31, 2014 03:31
Show Gist options
  • Save SoldierCorp/5c43ac92ebe0d3e793e4 to your computer and use it in GitHub Desktop.
Save SoldierCorp/5c43ac92ebe0d3e793e4 to your computer and use it in GitHub Desktop.
Uso básico de jQuery ajax con PHP /// How works jQuery ajax with PHP (basic usage)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ejemplo PHP con jQuery Ajax</title>
<!-- Bootstrap-->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link href="//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<!-- jQuery-->
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="main.js"></script>
<style>
body {
margin: 80px auto;
width: 500px;
}
h1 {
text-align: center;
}
.fa {
display: none;
}
</style>
</head>
<body>
<h1>jQuery<br/>Envio de datos por Ajax</h1>
<form>
<p>
<label for="username">Username</label>
<input class="form-control" id="username" name="username" type="text"/>
</p>
<p>
<label for="password">Password</label>
<input class="form-control" id="password" name="password" type="password"/>
</p>
<input class="btn btn-primary" type="submit" value="Login">
<i class="fa fa-refresh fa-spin"></i>
</form>
<span></span>
</body>
</html>
$(document).ready(function() {
$('form').submit(function(e) {
e.preventDefault();
var data = $(this).serializeArray();
data.push({name: 'tag', value: 'login'});
$.ajax({
url: 'process.php',
type: 'post',
dataType: 'json',
data: data,
beforeSend: function() {
$('.fa').css('display','inline');
}
})
.done(function() { //true
$('span').html("Correcto");
})
.fail(function() { //false
$('span').html("Falso");
})
.always(function() {
setTimeout(function() {
$('.fa').hide();
}, 1000);
});
})
})
<?php
$tag = $_POST['tag'];
if (isset($tag) && $tag !== '') {
if ($tag == 'login') {
if ($_POST['username'] === 'soldier')
echo true;
echo false;
}
}
?>
@fredkrudger
Copy link

thank's.... me fue de mucha ayuda!

@ZabdiBen
Copy link

muchas gracias

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment