soumission du formulaire ajax bootstrap php
Le contenu de cet article est la soumission du formulaire php bootstrap ajax. Maintenant, je le partage avec tout le monde. Les amis dans le besoin peuvent s'y référer
Publiez le code directement :
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>Bootstrap 101 Template</title>
<!-- Bootstrap -->
<!--<link href="css/bootstrap.min.css" rel="stylesheet">-->
{load href="__STATIC__/bootstrap/css/bootstrap.min.css"}
{load href="__STATIC__/css/base.css"}
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<p class="container" style="background: #fff;min-height: 200px;">
<!--一行内容-->
<p class="row">
<p class="col-md-3"></p>
<p class="col-md-6" style="background: #fff;min-height: 150px;">
<p class="login-header">用户登录</p>
<p class="login-form">
<p class="alert alert-danger error-tips" style="display: none;" role="alert"></p>
<p class="alert alert-success success-tips" style="display: none;" role="alert"></p>
<form class="login">
<p class="form-group">
<label for="exampleInputEmail1">用户名</label>
<input type="text" name="name" class="form-control" id="exampleInputEmail1"
placeholder="请输入您的邮箱">
</p>
<p class="form-group">
<label for="exampleInputPassword1">密码</label>
<input type="password" name="password" class="form-control" id="exampleInputPassword1"
placeholder="请输入您的密码">
</p>
<p class="checkbox">
<label>
<input type="checkbox"> 下次自动登录
</label>
</p>
<button type="button" class="btn btn-default login-btn">用户登录</button>
</form>
</p>
</p>
<p class="col-md-3"></p>
<!--<p class="col-md-8" style="background: #999;min-height: 150px;">右侧菜单</p>-->
</p>
</p>
<!--<p class="container-fuild" style="background: #eee;min-height: 200px;">-->
<!--<h1>你好，世界！</h1>-->
<!--</p>-->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!--<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>-->
{load href="__STATIC__/jquery/jquery.min.js"}
<!-- Include all compiled plugins (below), or include inpidual files as needed -->
{load href="__STATIC__/bootstrap/js/bootstrap.min.js"}
<!--<script src="js/bootstrap.min.js"></script>-->
<script>
$(function(){
// 给登录按钮增加事件监听
$('.login-btn').click(function(){
//alert('你点击了登录按钮');
// 1 获取表单的数据【一般会在javascript中进行验证】
// 2 使用ajax方法进行提交
// 3 根据服务器的返回值进行操作（具体局部刷新操作）
// 1.挨个获取
var _name = $('input[name="name"]').val();
var _password = $('input[name="password"]').val();
// 2.使用jq的serialize()
// alert($('.login').serialize());
//alert(_password);
//todo::前端js数据验证
$.ajax({
type : 'POST' ,
url : "{:url('checkLoginData')}",
data : $('.login').serialize(),
dataType: 'json',
success : function(data)
{
// console.log(data);
if(data.status == 0)
{
$('.error-tips').text(data.msg).show();
}
else
{
$('.success-tips').text(data.msg).show();
setTimeout(function(){
window.location.href = "{:url('index')}";
},2000);
}
}
})
})
})
</script>
</body>
</html>Connexe. recommandations :
Explication détaillée de divers algorithmes classiques implémentés en PHP
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
AI Hentai Generator
Générez AI Hentai gratuitement.
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Sujets chauds
Configuration du projet CakePHP
Sep 10, 2024 pm 05:25 PM
Dans ce chapitre, nous comprendrons les variables d'environnement, la configuration générale, la configuration de la base de données et la configuration de la messagerie dans CakePHP.
Guide d'installation et de mise à niveau de PHP 8.4 pour Ubuntu et Debian
Dec 24, 2024 pm 04:42 PM
PHP 8.4 apporte plusieurs nouvelles fonctionnalités, améliorations de sécurité et de performances avec une bonne quantité de dépréciations et de suppressions de fonctionnalités. Ce guide explique comment installer PHP 8.4 ou mettre à niveau vers PHP 8.4 sur Ubuntu, Debian ou leurs dérivés. Bien qu'il soit possible de compiler PHP à partir des sources, son installation à partir d'un référentiel APT comme expliqué ci-dessous est souvent plus rapide et plus sécurisée car ces référentiels fourniront les dernières corrections de bogues et mises à jour de sécurité à l'avenir.
Date et heure de CakePHP
Sep 10, 2024 pm 05:27 PM
Pour travailler avec la date et l'heure dans cakephp4, nous allons utiliser la classe FrozenTime disponible.
Téléchargement de fichiers CakePHP
Sep 10, 2024 pm 05:27 PM
Pour travailler sur le téléchargement de fichiers, nous allons utiliser l'assistant de formulaire. Voici un exemple de téléchargement de fichiers.
Routage CakePHP
Sep 10, 2024 pm 05:25 PM
Dans ce chapitre, nous allons apprendre les sujets suivants liés au routage ?
Discuter de CakePHP
Sep 10, 2024 pm 05:28 PM
CakePHP est un framework open source pour PHP. Il vise à faciliter grandement le développement, le déploiement et la maintenance d'applications. CakePHP est basé sur une architecture de type MVC à la fois puissante et facile à appréhender. Modèles, vues et contrôleurs gu
Comment configurer Visual Studio Code (VS Code) pour le développement PHP
Dec 20, 2024 am 11:31 AM
Visual Studio Code, également connu sous le nom de VS Code, est un éditeur de code source gratuit – ou environnement de développement intégré (IDE) – disponible pour tous les principaux systèmes d'exploitation. Avec une large collection d'extensions pour de nombreux langages de programmation, VS Code peut être c
CakePHP créant des validateurs
Sep 10, 2024 pm 05:26 PM
Le validateur peut être créé en ajoutant les deux lignes suivantes dans le contrôleur.
