Maison interface Web js tutoriel 如何使用json在前后台进行数据传输实例介绍_javascript技巧

如何使用json在前后台进行数据传输实例介绍_javascript技巧

May 16, 2016 pm 05:37 PM
json 数据传输

上一篇博客写到用javascript生成多组文本,可以让数据的输入不受显示,现在我们需要把这些输入写入数据库,这里就用到json传入。

首先,我们来写一下后台如何生成要传输的数据
[html]

复制代码 代码如下:

function generateDtb() {
//写入
var txtName = document.getElementById("txtName").value;
//创建数组
var dtb = new Array();
//通过循环把数据写入到数组并返回
for (var i = 0; i var row = new Object();
row.Name = txtName;
row.fullMoney = firstGroup[i].value;
row.discount = secondGroup[i].value;
dtb.push(row);
}
return dtb;
}
function generateDtb() {
//写入
var txtName = document.getElementById("txtName").value;
//创建数组
var dtb = new Array();
//通过循环把数据写入到数组并返回
for (var i = 0; i var row = new Object();
row.Name = txtName;
row.fullMoney = firstGroup[i].value;
row.discount = secondGroup[i].value;
dtb.push(row);
}
return dtb;
}

把数组转换成json串传入到后台:
[html]
复制代码 代码如下:

$(function () {
//点击botton1
$("#lbtnOK").click(function () {
var url = "DiscountManger.aspx?ajax=1";
var dtb = generateDtb();
// var strName = document.getElementById("txtName").value;
if (dtb == null)
{ }
else {
//序列化对象
var postdata = JSON.stringify(dtb);
//异步请求
$.post(url, { json: postdata }, function (json) {
if (json) {
jBox.tip("添加成功!", "提示");
location.reload();
}
else {
jBox.tip("添加失败!", "提示");
location.reload();
}
}, "json")
}
});
});
$(function () {
//点击botton1
$("#lbtnOK").click(function () {
var url = "DiscountManger.aspx?ajax=1";
var dtb = generateDtb();
// var strName = document.getElementById("txtName").value;
if (dtb == null)
{ }
else {
//序列化对象
var postdata = JSON.stringify(dtb);
//异步请求
$.post(url, { json: postdata }, function (json) {
if (json) {
jBox.tip("添加成功!", "提示");
location.reload();
}
else {
jBox.tip("添加失败!", "提示");
location.reload();
}
}, "json")
}
});
});

在后台的操作:
首先判断是否需要传输数据
[html]
复制代码 代码如下:

if (!IsPostBack)
{
//判断是否异步请求
if (Request.QueryString["ajax"] == "1")
{
ProcessRequest();
}
if (!IsPostBack)
{
//判断是否异步请求
if (Request.QueryString["ajax"] == "1")
{
ProcessRequest();
}

在这里进行对数据的处理:
[html]
复制代码 代码如下:

///
/// 处理异步请求
///

private void ProcessRequest()
{
//存入要填写的策略
ArrayList arrDiscount = new ArrayList();
Response.ContentType = "text/html";
string json = Request.Form["json"];
//反序列化DataTable
if (json == null)
{
return;
}
else
{
DataTable newdtb = Json2Dtb(json);
for (int i = 0; i {
Entity.StrategyDiscount enStrategyDiscount = new Entity.StrategyDiscount();
//打折方案名
enStrategyDiscount.name = newdtb.Rows[i]["Name"].ToString();
//商店ID
enStrategyDiscount.shopId = long.Parse(LoginInfo.ShopID);
enStrategyDiscount.fullMoney = Convert.ToDecimal(newdtb.Rows[i]["fullMoney"].ToString());
enStrategyDiscount.discount = Convert.ToDecimal(newdtb.Rows[i]["discount"].ToString());
//写入数据到数组
arrDiscount.Add(enStrategyDiscount);
}
//写入数据到数据库
IStrategyBLL strategy = new StrategyBLL();
if (strategy.AddStrategyDiscount(arrDiscount))
{
Response.Write("true");
Response.End();
}
else
{
Response.Write("false");
Response.End();
}
}
///
/// 处理异步请求
///

private void ProcessRequest()
{
//存入要填写的策略
ArrayList arrDiscount = new ArrayList();
Response.ContentType = "text/html";
string json = Request.Form["json"];
//反序列化DataTable
if (json == null)
{
return;
}
else
{
DataTable newdtb = Json2Dtb(json);
for (int i = 0; i {
Entity.StrategyDiscount enStrategyDiscount = new Entity.StrategyDiscount();
//打折方案名
enStrategyDiscount.name = newdtb.Rows[i]["Name"].ToString();
//商店ID
enStrategyDiscount.shopId = long.Parse(LoginInfo.ShopID);
enStrategyDiscount.fullMoney = Convert.ToDecimal(newdtb.Rows[i]["fullMoney"].ToString());
enStrategyDiscount.discount = Convert.ToDecimal(newdtb.Rows[i]["discount"].ToString());
//写入数据到数组
arrDiscount.Add(enStrategyDiscount);
}
//写入数据到数据库
IStrategyBLL strategy = new StrategyBLL();
if (strategy.AddStrategyDiscount(arrDiscount))
{
Response.Write("true");
Response.End();
}
else
{
Response.Write("false");
Response.End();
}
}

这里,我们需要把json转换成datatable
[html]
复制代码 代码如下:

///
/// Json转DataTable
///

///
///
private DataTable Json2Dtb(string json)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic = jss.Deserialize(json);
DataTable dtb = new DataTable();
if (dic.Count > 0)
{
foreach (Dictionary drow in dic)
{
if (dtb.Columns.Count == 0)
{
foreach (string key in drow.Keys)
{
dtb.Columns.Add(key, drow[key].GetType());
}
}
DataRow row = dtb.NewRow();
foreach (string key in drow.Keys)
{
row[key] = drow[key];
}
dtb.Rows.Add(row);
}
}
return dtb;
}
///
/// Json转DataTable
///

///
///
private DataTable Json2Dtb(string json)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic = jss.Deserialize(json);
DataTable dtb = new DataTable();
if (dic.Count > 0)
{
foreach (Dictionary drow in dic)
{
if (dtb.Columns.Count == 0)
{
foreach (string key in drow.Keys)
{
dtb.Columns.Add(key, drow[key].GetType());
}
}
DataRow row = dtb.NewRow();
foreach (string key in drow.Keys)
{
row[key] = drow[key];
}
dtb.Rows.Add(row);
}
}
return dtb;
}

这样,就可以把数据无刷新的写入到数据库。
当然,如果我们有一个从数据库读取的datatable,如果通过json显示在前台呢。
首先,我们需要把datatable转换为json数据
[html]
复制代码 代码如下:

///
/// DataTable转Json
///

///
///
private string Dtb2Json(DataTable dtb)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic = new ArrayList();
foreach (DataRow row in dtb.Rows)
{
Dictionary drow = new Dictionary();
foreach (DataColumn col in dtb.Columns)
{
drow.Add(col.ColumnName, row[col.ColumnName]);
}
dic.Add(drow);
}
return jss.Serialize(dic);
}
///
/// DataTable转Json
///

///
///
private string Dtb2Json(DataTable dtb)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic = new ArrayList();
foreach (DataRow row in dtb.Rows)
{
Dictionary drow = new Dictionary();
foreach (DataColumn col in dtb.Columns)
{
drow.Add(col.ColumnName, row[col.ColumnName]);
}
dic.Add(drow);
}
return jss.Serialize(dic);
}

然后写回到前台
[html]
复制代码 代码如下:

///
/// 处理异步请求
///

private void ProcessRequest()
{
Response.ContentType = "text/html";
string json = Request.Form["json"];
//反序列化DataTable
DataTable newdtb = Json2Dtb(json);
//序列化DataTable为JSON
string back = Dtb2Json(newdtb);
Response.Write(back);
Response.End();
}
///
/// 处理异步请求
///

private void ProcessRequest()
{
Response.ContentType = "text/html";
string json = Request.Form["json"];
//反序列化DataTable
DataTable newdtb = Json2Dtb(json);
//序列化DataTable为JSON
string back = Dtb2Json(newdtb);
Response.Write(back);
Response.End();
}

在前台接受显示:
[html]
复制代码 代码如下:

$(function() {
//点击botton1
$("#botton1").click(function() {
createTable(json);
});
});
//显示Json中的数据
function createTable(json) {
var table = $("
");
for (var i = 0; i o1 = json[i];
var row = $("");
for (key in o1) {
var td = $("");
td.text(o1[key].toString());
td.appendTo(row);
}
row.appendTo(table);
}
table.appendTo($("#back"));
}
$(function() {
//点击botton1
$("#botton1").click(function() {
createTable(json);
});
});
//显示Json中的数据
function createTable(json) {
var table = $("
");
for (var i = 0; i o1 = json[i];
var row = $("");
for (key in o1) {
var td = $("");
td.text(o1[key].toString());
td.appendTo(row);
}
row.appendTo(table);
}
table.appendTo($("#back"));
}

这样,就完成了json向后台传输数据和显示后台数据了,当然,这种传输方式只是传输的一种,如果是简单的字符串也可以用get和post进行传输,但是,javascript本身具有不安全性和不稳定行,对于一些比较重要的数据,建议还是寻找一些更可靠的方法。
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Combinaison de golang WebSocket et JSON : réalisation de la transmission et de l'analyse des données Combinaison de golang WebSocket et JSON : réalisation de la transmission et de l'analyse des données Dec 17, 2023 pm 03:06 PM

La combinaison de golangWebSocket et JSON : réaliser la transmission et l'analyse des données Dans le développement Web moderne, la transmission de données en temps réel devient de plus en plus importante. WebSocket est un protocole utilisé pour établir une communication bidirectionnelle. Contrairement au modèle de requête-réponse HTTP traditionnel, WebSocket permet au serveur de transmettre activement des données au client. JSON (JavaScriptObjectNotation) est un format léger d'échange de données, concis et facile à lire.

Quelle est la différence entre MySQL5.7 et MySQL8.0 ? Quelle est la différence entre MySQL5.7 et MySQL8.0 ? Feb 19, 2024 am 11:21 AM

MySQL5.7 et MySQL8.0 sont deux versions différentes de la base de données MySQL. Il existe quelques différences principales entre elles : Améliorations des performances : MySQL8.0 présente quelques améliorations de performances par rapport à MySQL5.7. Ceux-ci incluent de meilleurs optimiseurs de requêtes, une génération de plans d'exécution de requêtes plus efficaces, de meilleurs algorithmes d'indexation et des requêtes parallèles, etc. Ces améliorations peuvent améliorer les performances des requêtes et les performances globales du système. Prise en charge JSON : MySQL 8.0 introduit la prise en charge native du type de données JSON, y compris le stockage, la requête et l'indexation des données JSON. Cela rend le traitement et la manipulation des données JSON dans MySQL plus pratiques et efficaces. Fonctionnalités de transaction : MySQL8.0 introduit de nouvelles fonctionnalités de transaction, telles que l'atome

Conseils d'optimisation des performances pour la conversion de tableaux PHP en JSON Conseils d'optimisation des performances pour la conversion de tableaux PHP en JSON May 04, 2024 pm 06:15 PM

Les méthodes d'optimisation des performances pour la conversion des tableaux PHP en JSON incluent : l'utilisation d'extensions JSON et de la fonction json_encode() ; l'ajout de l'option JSON_UNESCAPED_UNICODE pour éviter l'échappement de caractères ; l'utilisation de tampons pour améliorer les performances d'encodage de boucle et l'utilisation d'un tiers ; Bibliothèque d'encodage JSON.

Comment gérer les formats de données XML et JSON dans le développement C# Comment gérer les formats de données XML et JSON dans le développement C# Oct 09, 2023 pm 06:15 PM

La gestion des formats de données XML et JSON dans le développement C# nécessite des exemples de code spécifiques. Dans le développement de logiciels modernes, XML et JSON sont deux formats de données largement utilisés. XML (Extensible Markup Language) est un langage de balisage permettant de stocker et de transmettre des données, tandis que JSON (JavaScript Object Notation) est un format d'échange de données léger. Dans le développement C#, nous devons souvent traiter et exploiter des données XML et JSON. Cet article se concentrera sur la façon d'utiliser C# pour traiter ces deux formats de données et les attacher.

Utilisez la fonction json.MarshalIndent dans Golang pour convertir la structure en une chaîne JSON formatée Utilisez la fonction json.MarshalIndent dans Golang pour convertir la structure en une chaîne JSON formatée Nov 18, 2023 pm 01:59 PM

Utilisez la fonction json.MarshalIndent dans Golang pour convertir la structure en une chaîne JSON formatée. Lors de l'écriture de programmes dans Golang, nous avons souvent besoin de convertir la structure en chaîne JSON. Dans ce processus, la fonction json.MarshalIndent peut nous aider à implémenter. sortie formatée. Ci-dessous, nous expliquerons en détail comment utiliser cette fonction et fournirons des exemples de code spécifiques. Commençons par créer une structure contenant des données. Ce qui suit est une indication

Tutoriel d'utilisation de Pandas : Démarrage rapide pour la lecture de fichiers JSON Tutoriel d'utilisation de Pandas : Démarrage rapide pour la lecture de fichiers JSON Jan 13, 2024 am 10:15 AM

Démarrage rapide : méthode Pandas de lecture des fichiers JSON, des exemples de code spécifiques sont requis Introduction : Dans le domaine de l'analyse des données et de la science des données, Pandas est l'une des bibliothèques Python importantes. Il fournit des fonctions riches et des structures de données flexibles, et peut facilement traiter et analyser diverses données. Dans les applications pratiques, nous rencontrons souvent des situations où nous devons lire des fichiers JSON. Cet article expliquera comment utiliser Pandas pour lire des fichiers JSON et joindra des exemples de code spécifiques. 1. Installation de Pandas

Comment les annotations de la bibliothèque Jackson contrôlent-elles la sérialisation et la désérialisation JSON ? Comment les annotations de la bibliothèque Jackson contrôlent-elles la sérialisation et la désérialisation JSON ? May 06, 2024 pm 10:09 PM

Les annotations dans la bibliothèque Jackson contrôlent la sérialisation et la désérialisation JSON : Sérialisation : @JsonIgnore : Ignorer la propriété @JsonProperty : Spécifiez le nom @JsonGetter : Utilisez la méthode get @JsonSetter : Utilisez la méthode set Désérialisation : @JsonIgnoreProperties : Ignorez la propriété @ JsonProperty : Spécifiez le nom @JsonCreator : utilisez le constructeur @JsonDeserialize : logique personnalisée

Utilisez la fonction json_encode() de PHP pour convertir un tableau ou un objet en chaîne JSON et formater la sortie Utilisez la fonction json_encode() de PHP pour convertir un tableau ou un objet en chaîne JSON et formater la sortie Nov 03, 2023 pm 03:44 PM

L'utilisation de la fonction json_encode() de PHP pour convertir un tableau ou un objet en chaîne JSON et formater la sortie peut faciliter le transfert et l'échange de données entre différentes plates-formes et langages. Cet article présentera l'utilisation de base de la fonction json_encode() et comment formater et générer une chaîne JSON. 1. Utilisation de base de la fonction json_encode() La syntaxe de base de la fonction json_encode() est la suivante : stringjson_encod

See all articles