Backend Development
PHP Tutorial
javascript - A problem with using jquery's ajax and php together to achieve non-refresh form submission
javascript - A problem with using jquery's ajax and php together to achieve non-refresh form submission
The picture is my page. After opening the homepage link, the main part (black box on the left) is displayed;
The subpage on the right (the subpage obtained through ajax in the div#main_box on the right)
When the homepage link is just opened Display the subpage loaded when pressing the button
Now I have a form in subpage 2 that is loaded when button 2 is pressed. I need to submit the form and then get the value submitted by the form through PHP, then go to the database to query the information, return the database data and then output it to this subpage 2. I don’t know. How to achieve.
I found this method after searching online for a long time:
<code><form action="teacher.php" method="post">
<p>学期</p>
<select name="xueqi" id="xueqi">
<option value="201520161">2015-2016学年第一学期</option>
<option value="201520162">2015-2016学年第二学期</option>
<option value="201620171">2016-2017学年第一学期</option>
</select>
</form>
<script>
$(function(){
$("#jiansuo").click(function(){
var xueqi = $("#xueqi").val();//取得表单的值
var one = $("#one").val();
var one_week = $("#one_week").val();
var more = $("#more").val();
var more_week_num = $("#more_week_num").val();
var more_week_ba = $("#more_week_ba").val();
var xingqi = $("#xingqi").val();
var banji = $("#banji").val();
//Ajax post数据
$.ajax({
type: "POST",//Ajax请求为post
url: "teacher.php?c=fankui",//ajax请求URL 脚本地址
data: {"xueqi":xueqi,"one":one,"one_week":one_week,"more":more,"more_week_ba":more_week_ba,"xingqi":xingqi,"banji":banji}, //传递的值
success: function(data){ //回调函数 这里的data你可以返回HTML也可以是JSON 为了简单你返回HTML就可以了。
$("#main_right_box").html("").html(data);//将返回的列表插入分类.
}
});
});
}
</script>
</code>But I don’t know how to use it, please give me some advice
Reply content:
The picture is my page. After opening the homepage link, the main part (black box on the left) is displayed;
The subpage on the right (the subpage obtained through ajax in the div#main_box on the right)
When the homepage link is just opened Display the subpage loaded when the button is pressed
Now I have a form in subpage 2 that is loaded when I press button 2. I need to submit the form and then get the value submitted by the form through PHP, then go to the database to query the information, return the database data and then output it to this subpage 2. I don’t know. How to achieve.
I searched online for a long time and found this method:
<code><form action="teacher.php" method="post">
<p>学期</p>
<select name="xueqi" id="xueqi">
<option value="201520161">2015-2016学年第一学期</option>
<option value="201520162">2015-2016学年第二学期</option>
<option value="201620171">2016-2017学年第一学期</option>
</select>
</form>
<script>
$(function(){
$("#jiansuo").click(function(){
var xueqi = $("#xueqi").val();//取得表单的值
var one = $("#one").val();
var one_week = $("#one_week").val();
var more = $("#more").val();
var more_week_num = $("#more_week_num").val();
var more_week_ba = $("#more_week_ba").val();
var xingqi = $("#xingqi").val();
var banji = $("#banji").val();
//Ajax post数据
$.ajax({
type: "POST",//Ajax请求为post
url: "teacher.php?c=fankui",//ajax请求URL 脚本地址
data: {"xueqi":xueqi,"one":one,"one_week":one_week,"more":more,"more_week_ba":more_week_ba,"xingqi":xingqi,"banji":banji}, //传递的值
success: function(data){ //回调函数 这里的data你可以返回HTML也可以是JSON 为了简单你返回HTML就可以了。
$("#main_right_box").html("").html(data);//将返回的列表插入分类.
}
});
});
}
</script>
</code>But I don’t know how to use it, please give me some advice
-
Use the iframe function. The element of button two is an a tag. Display it as you want the button to look like. Add the target attribute, so that your second requirement is naturally solved.
<code> <a href="相应的url" target="main_box_frame">按钮二</a> <div id="main_box"><iframe name="main_box_frame"></iframe></div></code>
Copy after login Add a click event to the second label of the button, get the content to be displayed in the main_box through ajax, and add it to the main_box, then tie it to the submit event on the retrieved form, and insert the response from the form submission into in main_box.
My approach is to disable the default submission event, use jq's ajax to send the request, and use data:
$(formSelector).serialize() for the form data, so there is no need to read the value separately, and refresh the page through the callback function.
I know this, let’s put it this way, what ajax returns is actually what is printed in your teacher.php. Taking the dataType format as html as an example, you can do a test in that teacher.php and directly echo '
Hi, I want to be passed back
', and then return to this success:function(data){alert(data)};//See what it is, if it is json, then teacher.php The only data that can be output is echo json encode($array); here it is dataType:'json'//I don’t know if I wrote it wrong= =#
//By the way, you have to add an onsubmit=' to that form return checnkForm()';Write ajax in the checkForm() function, and finally return false, otherwise the form submission will jump a bit
<code>$.ajax({
url:"teacher.php?c=fankui",
type:"post",
data:{"xx":"xx"},
dataType:'html',
success:function(data){
//数据加载成功
},
error:function(){
//数据加载失败
}
});
</code>
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
PHP and Python: Different Paradigms Explained
Apr 18, 2025 am 12:26 AM
PHP is mainly procedural programming, but also supports object-oriented programming (OOP); Python supports a variety of paradigms, including OOP, functional and procedural programming. PHP is suitable for web development, and Python is suitable for a variety of applications such as data analysis and machine learning.
Choosing Between PHP and Python: A Guide
Apr 18, 2025 am 12:24 AM
PHP is suitable for web development and rapid prototyping, and Python is suitable for data science and machine learning. 1.PHP is used for dynamic web development, with simple syntax and suitable for rapid development. 2. Python has concise syntax, is suitable for multiple fields, and has a strong library ecosystem.
Laravel Introduction Example
Apr 18, 2025 pm 12:45 PM
Laravel is a PHP framework for easy building of web applications. It provides a range of powerful features including: Installation: Install the Laravel CLI globally with Composer and create applications in the project directory. Routing: Define the relationship between the URL and the handler in routes/web.php. View: Create a view in resources/views to render the application's interface. Database Integration: Provides out-of-the-box integration with databases such as MySQL and uses migration to create and modify tables. Model and Controller: The model represents the database entity and the controller processes HTTP requests.
PHP and Python: A Deep Dive into Their History
Apr 18, 2025 am 12:25 AM
PHP originated in 1994 and was developed by RasmusLerdorf. It was originally used to track website visitors and gradually evolved into a server-side scripting language and was widely used in web development. Python was developed by Guidovan Rossum in the late 1980s and was first released in 1991. It emphasizes code readability and simplicity, and is suitable for scientific computing, data analysis and other fields.
PHP's Impact: Web Development and Beyond
Apr 18, 2025 am 12:10 AM
PHPhassignificantlyimpactedwebdevelopmentandextendsbeyondit.1)ItpowersmajorplatformslikeWordPressandexcelsindatabaseinteractions.2)PHP'sadaptabilityallowsittoscaleforlargeapplicationsusingframeworkslikeLaravel.3)Beyondweb,PHPisusedincommand-linescrip
Solve database connection problem: a practical case of using minii/db library
Apr 18, 2025 am 07:09 AM
I encountered a tricky problem when developing a small application: the need to quickly integrate a lightweight database operation library. After trying multiple libraries, I found that they either have too much functionality or are not very compatible. Eventually, I found minii/db, a simplified version based on Yii2 that solved my problem perfectly.
Laravel framework installation method
Apr 18, 2025 pm 12:54 PM
Article summary: This article provides detailed step-by-step instructions to guide readers on how to easily install the Laravel framework. Laravel is a powerful PHP framework that speeds up the development process of web applications. This tutorial covers the installation process from system requirements to configuring databases and setting up routing. By following these steps, readers can quickly and efficiently lay a solid foundation for their Laravel project.
MySQL vs. Other Programming Languages: A Comparison
Apr 19, 2025 am 12:22 AM
Compared with other programming languages, MySQL is mainly used to store and manage data, while other languages such as Python, Java, and C are used for logical processing and application development. MySQL is known for its high performance, scalability and cross-platform support, suitable for data management needs, while other languages have advantages in their respective fields such as data analytics, enterprise applications, and system programming.
