jquery 直接调用 wcf,面向服务的SOA架构 ( 第三天)
所谓万事 具备,只欠东风了!! 接下来就是 wcf 的调用,
首先 在客户端下,随便 写一个 html页面,然后写入如下方法:
<script src="scripts/jquery.min.js"></script> ---这里必须得先导入 jquery 的插件
//下面这个方法是 获得网站的 相对路径
$.getrooturl = function () {
return window.location.protocol + "//" + window.location.host;
}
接下来我们来写 一个js方法
function getdate() {
var url = $.getrooturl() + "/WebService.svc/operate/select"; //这个是 我们访问的路劲
//这个是数据库的名字
var database = "vbk";
//这个是后台我们要执行的 方法名字
var method = "select";
//这里是你要写入的sql 语句 var sql = $("#txt_sql").val();
$.ajax({
url: url,
contentType: "application/json",
data: '{"database":"vbk" ,"method":"select","sql":"'+sql+'"}',
type: "post",
success: function (data) {
var datatable = eval(data)[0].data;
var html = jsonToTable(datatable);
$("#table").html(html);
},
error: function (err) {
$("#table").html(err.responseText);
}
}); }
接下来 我们要做的就是 怎么将让查询变的更简单:(直接将JSON数据变成table)
function jsonToTable(json) {
var cols = new Array();
$.each(json[], function (index, value) {
// cols[cols.length] = value;
cols.push(index);
});
shtml = "<table border=1><tr>"; //create header row - save html of table in shtml
for (i = ; i < cols.length; i++) {
shtml += "<th>" + cols[i] + "</th>";
}
shtml += "</tr>";
// var irowmax = myJSONobj.records.length;
for (irow = ; irow < json.length; irow++) { //add the rows
shtml += "<tr>";
for (i = ; i < cols.length; i++) {
shtml += "<td>" + $( json[irow]).attr([cols[i]]) + "</td>";
}
shtml += "</tr>";
}
shtml += "</table>";
return shtml;
}
另外我附加 body里面的代码:
<body>
<input type="text" style="width:200px " id="txt_sql" value="select * from dbo.MdcDatKanBan"/>
<input type="button" value="获取数据" onclick="getdate()"/>
<div id="table"> </div>
</body>
接下来我们来看下效果:(另外告诉大家,由于不同的电脑不同的配置,修改下你的配置文件就可以使用了)
写入你的sql语句,然后点击获取数据,就可以看到你要写的效果了。
VS2012版本源码下载:
http://files.cnblogs.com/files/liujing379069296/Vs2012Client.rar
vs2010 源码下载
http://files.cnblogs.com/files/liujing379069296/VS2010Client.rar
jquery 直接调用 wcf,面向服务的SOA架构 ( 第三天)的更多相关文章
- 面向服务的SOA架构与服务总线ESB
之前的软件的开发主要是面向对象的编程架构 方法---对象---模块---组件---服务,感觉现在的开发的主流的软件架构的设计思想都是对其进行重用,只不过范围越来越大,有一个系统之间进行通信到多个系统之 ...
- jquery 直接调用 wcf,面向服务的SOA架构 ( 第二天)
在前面的基础上,我们来开始第二天编写 客户端 的东西,不过讲之前,我想告诉大家的是: 这个简单的SOA的架构,我们直接通过wcf 调用到 后台的方法, 而中间没有使用 C#代码,大大减少我们客户端的代 ...
- WCF入门教程(四)通过Host代码方式来承载服务 一个WCF使用TCP协议进行通协的例子 jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding System.ServiceModel.WSHttpBinding协议 学习WCF笔记之二 无废话WCF入门教程一[什么是WCF]
WCF入门教程(四)通过Host代码方式来承载服务 Posted on 2014-05-15 13:03 停留的风 阅读(7681) 评论(0) 编辑 收藏 WCF入门教程(四)通过Host代码方式来 ...
- 面向服务的体系架构SOA
面向服务的体系架构SOA 序言 在.Net的世界中,一提及SOA,大家想到的应该是Web Service,WCF,还有人或许也会在.NET MVC中的Web API上做上标记,然后泛泛其谈! 的确,微 ...
- 面向服务的体系架构(SOA)
面向服务的体系架构(SOA) 1.面向服务的体系架构(SOA) 面向服务的架构(service-oriented architecture)是Gartner于2O世纪9O年代中期提出的面向服务架构的概 ...
- jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding
Jquery ajax调用WCF服务 例子效果如下:原界面 点击按钮GetList get后,通过指定的Url获取数据添加到table 新建一个控制台项目,添加IContract.cs,DBServi ...
- SOA——面向服务的体系架构
上一篇博文中提到了"紧耦合"的现象.怎样解决?SOA.採用面向服务的体系架构. 一.What? SOA=Service-oriented Architecture面向服务的体系结构 ...
- 一个通过JSONP跨域调用WCF REST服务的例子(以jQuery为例)
JSONP(JSON with Padding)可以看成是JSON的一种“使用模式”,用以解决“跨域访问”的问题,这篇简单的文章给出一个简单的例子用于模拟如何通过jQuery以JSONP的访问调用一个 ...
- 说说面向服务的体系架构SOA
序言 在.Net的世界中,一提及SOA,大家想到的应该是Web Service,WCF,还有人或许也会在.NET MVC中的Web API上做上标记,然后泛泛其谈! 的确,微软的这些技术也确实推动着面 ...
随机推荐
- Freedur为什么免费?
难道没有人看到他们官方网站权? Freedur倒闭了...... 一个中国人.Chris Lee,作为Freedur的会计师.窃取了公司的银行帐号.并将Freedur的官方站点指向自己的空间. 而且声 ...
- Sublime Text 3 搭建Go开发环境(Windows)
一.安装GO 如果已经环境已经配置好,这一步省略.... 1.下载并安装go sdk 2.配置环境变量 (1). 新建 变量名:GOBIN 变量值 :F:\Go\bin (2). 新建 变量名:GOA ...
- HDU 4333 Revolving Digits 扩张KMP
标题来源:HDU 4333 Revolving Digits 意甲冠军:求一个数字环路移动少于不同数量 等同 于的数字 思路:扩展KMP求出S[i..j]等于S[0..j-i]的最长前缀 推断 nex ...
- apache-maven-3.2.1设备
maven 是一个项目管理工具,并建立自己主动.本文所讲apache-maven-3.2.1设备. 它的下载: http://maven.apache.org/download.cgi ,选apach ...
- RH133读书笔记(8)-Lab 8 Manage Network Settings
Lab 8 Manage Network Settings Goal: To build skills needed to manually configure networking Estimate ...
- 使用Canvas和Paint自己绘制折线图
主要用于Canvas一个特别简单的小demo. 能够手动点击看每一个月份的数据.很easy.就是用paint在canvas上画出来的. 主要内容就是计算左边价格的位置,以下日期的位置,三根虚线的位置, ...
- SQL Server错误代码及解释(留着备用)
原文:SQL Server错误代码及解释(留着备用) 转自:http://www.ajia.me/Article/193.html Code Error Message 0 操作成功完成. 1 功能 ...
- HTTP请求中POST与GET的差别
一.原理差别 一般我们在浏览器输入一个网址訪问站点都是GET请求;再FORM表单中,能够通过设置Method指定提交方式为GET或者POST提交方式,默觉得GET提交方式. HTTP定义了与serve ...
- 怎么样sourceforge开源项目发现,centos安装-同htop安装案例
一个.htop什么? top是linux下经常使用的监控程序.htop相当于其加强版,颜色显示不同參数.且支持鼠标操作. 详细介绍參看此说明文档. watermark/2/text/aHR0cDovL ...
- asp.net使用post方式action到另一个页面,在另一个页面接受form表单的值!(报错,已解决!)
原文:asp.net使用post方式action到另一个页面,在另一个页面接受form表单的值!(报错,已解决!) 我想用post的方式把一个页面表单的值,传到另一个页面.当我点击Default.as ...