ajax get调用请求过程

1. 主页面超链接到DB连接测试

main.html

	<dl>  
				    <dt><i class="icon-menu i_1 fl"></i>在线监控平台<i class="icon-menu i_6 fr"></i></dt>  
				    <dd><a href="/addMachine">监控设备添加</a></dd>
				    <dd><a href="/transactionIndex">MysqL 事务监控</a></dd>
					<dd><a href="/lockIndex">MysqL 行锁监控</a></dd>
					<dd><a href="/deltableindex">zabbix 表分区删除</a></dd>
					<dd><a href="/static/index.PHP/Monitor/logIndex">日志查看</a></dd>
					<dd><a href="/testdb">DB连接测试</a></dd>
				</dl> 
				

				
2.调用/testdb 

node2:/django/mysite/mysite#cat urls.py

from django.conf.urls import include,url
from django.contrib import admin
from blog import views as view
from news import views as newview
urlpatterns =( 
url(r'^admin/',admin.site.urls),url(r'^blog/$',view.archive),url(r'^articles/',include("news.urls")),url(r'^upload/$',newview.upload,name='upload'),url(r'^main/$',newview.main),url(r'^$',newview.index),url(r'^get_name/$',newview.get_name),url(r'^index/$',url(r'^test_func/$',newview.test_func),url(r'^addMachine/$',newview.addMachine),url(r'^transactionIndex/$',newview.transactionIndex),url(r'^lockIndex/$',newview.lockIndex),url(r'^deltableindex/$',newview.deltableindex),url(r'^testdb/$',newview.testdb)



3.调用对应的页面:
node2:/django/mysite/news/templates#cat testdb.html 
<html>
<head>
	<title>运维平台</title>
	<link rel="stylesheet" type="text/css" href="/static/Css/Equipment/index.css">
	<link rel="stylesheet" type="text/css" href="/static/Css/Public/header.css">
	<link rel="stylesheet" type="text/css" href="/static/Css/Public/menu.css">
</head>
<body>
	<include file="Public:header"/>
	<div class="content">
		<include file="Public:menu"/>
		<div class="con fl">
			<div id="condition">
				<label class="condition">用户</label><input type="text" name="condition" class="equipment_sz1">
				<label class="condition">密码</label><input type="text" name="condition" class="equipment_sz2">
				<label class="condition">端口</label><input type="text" name="condition" class="equipment_sz3">
				<label class="condition">IP</label><input type="text" name="condition" class="equipment_sz4">
				<label class="condition">DB</label><input type="text" name="condition" class="equipment_sz5">
				<input type="submit" value="测试连接" class="equipment_search_btn es_2">
			</div>
			<table class="gridtable">
				<tr>
					<th>IP </th><th>Info</th><th>ENV</th>
				</tr>
			</table>
		</div>
	</div>
</body>
<script type="text/javascript" src="/static/Js/jquery-2.2.2.min.js"></script>
<script type="text/javascript" src="/static/Js/Monitor/testdb.js"></script> 
<!-- <script type="text/javascript" src="/static/Js/Public/ajax.js"></script> -->
</html>


4.调用JS

node2:/django/mysite/static/Js/Monitor#cat testdb.js 
$(function(){
	var _env_bt = $(".content .con #condition .es_2");
	_env_bt.on('click',function(){
		var __user = $(".equipment_sz1").val();
		var __password = $(".equipment_sz2").val();
		var __port = $(".equipment_sz3").val();
		var __ip = $(".equipment_sz4").val();
		var __db = $(".equipment_sz5").val();
                console.log(__user);
                console.log(__password);
                console.log(__port);
                console.log(__ip);
                console.log(__db);
		var data={};
                data.user = __user;
		data.password = __password;
		data.port=__port;
		data.ip=__ip;
		data.db=__db;
		var successfn = function(jdata){
                    // $(".gridtable").empty();
					// var _HTML="<tr><th>IP </th><th>Info</th><th>ENV</th></tr>";
					// $.each(jdata,function(i,val){
						// _HTML=_HTML+"<tr><td>"+jdata[i].ip+"</td><td>"+jdata[i].info+"</td><td>"+jdata[i].env+"</td></tr>";
					// });
					// $(".gridtable").html(_HTML)
		alert("connect success")
                };
		var errorfn = function(){
                    alert("could not connect now");
                };
	$.ajax({
				type: "get",data: data,url: "/api/check_db_connect",dataType: "text",success: function(d){
					successfn(d);
				},error: function(e){
					errorfn(e);
				}
			});
	});
	
});
ajax get调用请求过程

猜你在找的Ajax相关文章
