HTML表中的PHP JSON数组值将更新发布到API [英] PHP JSON Array Values In HTML Table Post Update To API
本文介绍了HTML表中的PHP JSON数组值将更新发布到API的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在从HTML表中更新JSON记录。
I am working on updating JSON records from a HTML Table.
基本上它的工作方式是将它从一个api url中拉出json数据 - 将它设置在一个表内 - 在表的最后一列ROW a SAVE按钮已设置 - 我单击此按钮，它使TR的所有TD都可编辑 - 再次单击SAVE按钮然后保存此行。在我们发言时，这只是客户方面的工作。我需要让这项工作更新服务器端 - 也可以从表ROW重新编码回JSON格式 - 然后使用API更新该特定记录。
Basically the way this is working is that it's pulling json data from an api url - setting it inside of a table - on the last column of the table ROW a SAVE button is set - I click this button and it makes all the TD's of the TR editable - Clicking the SAVE button again then saves this row. This is only working client side as we speak. I need to make this work to update the server side - Probably encode back to JSON format from table ROW as well - then update that specific record using the API.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-json/2.6.0/jquery.json.min.js"></script>
<script>
//Use jQuery to edit row
$(document).ready(function(){
$('.editbtn').click(function () {
var currentTD = $(this).parents('tr').find('td');
//alert('this '+$(this).html() );
if ($(this).text().trim() == 'Edit') {
currentTD = $(this).parents('tr').find($("td").not(":nth-child(7)"));
//alert("first if "+currentTD.html());
$.each(currentTD, function () {
$(this).prop('contenteditable', true).css({
'background':'#fff',
'color':'#000'
})
});
} else {
// alert("second if "+currentTD.html());
$.each(currentTD, function () {
//alert("second if "+currentTD.html());
$(this).prop('contenteditable', false).removeAttr("style");
});
}
$(this).html($(this).html() == 'Edit' ? 'Save' : 'Edit')
if ($(this).html() == 'Save'){
// alert("third if "+currentTD.html());
$(this).prop('contenteditable',false)
}
});
});
</script>
<?php
$url = 'URL';
$data = file_get_contents($url);
$parsed = json_decode($data, true);
$eachEntry = $parsed['response']['result']['Leads']['row'];
$valuesIWant = ["First Name", "Last Name", "Street", "City", "State", "Zip Code"];
echo '<div class="uabb-table-module-content uabb-table">
<div class="uabb-table-element-box">
<div class="uabb-table-wrapper">
<table id="tableone" class="uabb-table-inner-wrap table table-striped table-dark table-bordered">
<thead class="uabb-table-header">
<tr class="table-header-tr">
<th class="table-heading-0 table-header-th" rowspan="" colspan="">
<label class="head-style-0 th-style">
<label class="head-inner-text">First Name</label>
</label>
</th>
<th class="table-heading-1 table-header-th" rowspan="" colspan="">
<label class="head-style-1 th-style">
<label class="head-inner-text">Last Name</label>
</label>
</th>
<th class="table-heading-2 table-header-th" rowspan="" colspan="">
<label class="head-style-2 th-style">
<label class="head-inner-text">Street</label>
</label>
</th>
<th class="table-heading-3 table-header-th" rowspan="" colspan="">
<label class="head-style-3 th-style">
<label class="head-inner-text">City</label>
</label>
</th>
<th class="table-heading-4 table-header-th" rowspan="" colspan="">
<label class="head-style-4 th-style">
<label class="head-inner-text">State</label>
</label>
</th>
<th class="table-heading-5 table-header-th" rowspan="" colspan="">
<label class="head-style-5 th-style">
<label class="head-inner-text">Zip Code</label>
</label>
</th>
<th class="table-heading-5 table-header-th" rowspan="" colspan="">
<label class="head-style-5 th-style">
<label class="head-inner-text"></label>
</label>
</th>
</tr>
</thead>';
foreach ($eachEntry as $entry) {
$FL = $entry['no'];
$entries = $entry['FL'];
echo '<tbody class="uabb-table-features"><tr class="tbody-row">';
foreach ($entries as $value) {
$val = $value['val'];
$content = $value['content'];
if (in_array($val, $valuesIWant)) {
//$out = $val;
$out2 = $content;
echo '<td class="table-body-td table-body-0" colspan="" rowspan=""><span class="content-text">'. $out2 .'</span></td>';
}
}
echo '<td contenteditable="false">
<button type="button"class="btn btn-primary editbtn">Edit</button><!--<button type="button" class="btn btn-danger">Delete</button>--></td></tr></tbody>';
}
echo '</table></div></div></div>';
$count = count($eachEntry);
echo '<tbody class="uabb-table-features"><tr class="tbody-row"><span>There are '. $count .' records.</span></tr></tbody>';
?>
JSON结构
JSON Structure
{
"response": {
"result": {
"Leads": {
"row": [
{
"no": "1",
"FL": [
{
"val": "LEADID",
"content": "123000000596123"
},
{
"val": "SMOWNERID",
"content": "123000000291123"
},
{
"val": "Lead Owner",
"content": "Casar"
},
{
"val": "First Name",
"content": "Bob"
},
{
"val": "Last Name",
"content": "Something"
},
{
"val": "Email",
"content": "email@email.com"
},
{
"val": "Mobile",
"content": "1113332222"
},
{
"val": "SMCREATORID",
"content": "383590700000032132"
},
{
"val": "Created By",
"content": "Casar"
},
{
"val": "Created Time",
"content": "2019-04-03 15:14:05"
},
{
"val": "Modified Time",
"content": "2019-04-03 17:13:58"
},
{
"val": "Full Name",
"content": "Bob"
},
{
"val": "Street",
"content": "123 Fake Rd"
},
{
"val": "City",
"content": "Fakecity"
},
{
"val": "State",
"content": "DC"
},
{
"val": "Zip Code",
"content": "123123"
},
{
"val": "Email Opt Out",
"content": "false"
},
{
"val": "Salutation",
"content": "Mr."
},
{
"val": "Last Activity Time",
"content": "2019-04-03 17:13:58"
},
{
"val": "Tag",
"content": "convert"
},
{
"val": "Account Name",
"content": "Chief"
},
{
"val": "Territory Manager",
"content": "Mike"
},
{
"val": "Territory Manager_ID",
"content": "312390700000021111"
},
{
"val": "Classification",
"content": "Instal"
},
{
"val": "Area",
"content": "Zone 1"
},
{
"val": "Account Number",
"content": "2342342"
}
]
}
]
}
},
"uri": "/crm/private/json/Leads/getRecords"
}
}
这是一个扩展问题来自：
This Is An Extension Question From:
PHP JSON To Array Values into HTML Table
推荐答案
$("#tableone").ediTable({
button:{
edit:{
active:true,
}
}
afterSave:function($values){
formdata=new FormData();
$.each(values,function(index,cellValue){
formdata.append(index,cellValue);
});
$.ajax({
url:"/path/serverFile[.extension]",
data:formdata,
type:"method",
success:function(resp){}
});
}
});
注意：您只需要在TD的attrdata-index中设置每个字段的名称
Note: you need just to set name of each field in attr "data-index" of your TDs
例如：
foreach ($entries as $value) {
$val = $value['val'];
$content = $value['content'];
if (in_array($val, $valuesIWant)) {
//$out = $val;
$out2 = $content;
echo '<td data-index="*NAME OF FIELD*" class="table-body-td table-body-0" colspan="" rowspan=""><span class="content-text">'. $out2 .'</span></td>';
}
}
图书馆参考： https://github.com/OxiGen1001/ediTable
这篇关于HTML表中的PHP JSON数组值将更新发布到API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
