经过一些研究后对代码有了更好的理解之后,我现在要问另一个问题。
我有一个动态生成的表格,代码如下所示:
function prepareBlocksHtml_()
{
$class = new Graffitiwall();
$data = $class->getBlocks();
/* Get the current orderID */
$orderid = get_last_order_id();
echo "The Latest Order ID is ";
echo $orderid;
$html = '<table width="100%" border="0">
<thead>
<tr>
<th>Block</th>
<th>OrderID</th>
<th>Status</th>
<th>Image</th>
<th>Destination</th>
<th>Expiry</th>
<th>Options</th>
</tr>
</thead>';
$count = 1;
if(count($data) == 0)
{
return "<div class='alert alert-warning' >Your blocks are not active yet, or you have not purchased any blocks yet.</div>";
}
foreach($data as $block)
{
if($block->status == 0)
{
$block->status = "Pending Approval";
}
else
{
$block->status = "Active";
}
$fields = array();
$fiedls['orderid'] = $block->orderid;
$fields['destination'] = $block->destination;
$fields['tagline'] = $block->tagline;
$fields['image'] = $block->image;
$fields['id'] = $block->id;
$fields = json_encode($fields);
$settings = $block->permissions;
$html .= '<tr id=block_"'.$block->id.'">';
/* add order ID PC 14-8-2018 */
$html .= '<td>'.$count.'</td>';
$html .= '<td>'.$block->orderid.'</td>';
$html .= '<td>'.$block->status.'</td>';
$html .= '<td><img style="max-width: 61px" class="img-responsive " src="'.$block->image.'" </td>';
$html .= '<td>'.$block->destination.'</td>';
$html .= '<td>'.$block->expiry.'</td>';
$html .= '<td><button class="edit" onclick="showModal(\''.$block->userid.'\',\''.base64_encode($settings).'\',\''.base64_encode($fields).'\')">Edit</button></td>';
$html .= '</tr>';
$count ++;
}
$html .='</table>';
return $html;
}
该代码从一个表中获取数据,并显示订单列表以及与每个订单相关的数据。然后代码调用ShowModal函数,该函数还为每一行发送用户和数据,并在此处突出显示一个EDIT按钮:
$html .= '<td><button class="edit" onclick="showModal(\''.$block->userid.'\',\''.base64_encode($settings).'\',\''.base64_encode($fields).'\')">Edit</button></td>';
这将在我的main.js文件中调用一个名为showModal的函数,如下所示
function showModal(user,settings,data)
{
jQuery("#uploadBox, #selectBox, #labelurl, #url").hide();
jQuery("#editListing").modal();
settings = JSON.parse(atob(settings));
data = JSON.parse(atob(data));
if(typeof(settings.custom_logo) !== 'undefined' && settings.custom_logo === true)
{
jQuery("#uploadBox").show();
}
if(typeof(settings.badge) !== 'undefined' && settings.badge === true)
{
jQuery("#selectBox").show();
}
if(typeof(settings.link) !== 'undefined' && settings.link === true)
{
jQuery("#labelurl, #url").show();
}
// this is where data is passed to the showModal
// add in orderid mapping to ordid
jQuery("#ordid").val(data.orderid);
jQuery("#url").val(data.destination);
jQuery("#tooltip").val(data.tagline);
jQuery("#rid").val(data.id);
jQuery("#blockImage").attr('src',data.image);
jQuery('#editListing').modal('show');
}
然后调用显示表单的代码:
<div id="editListing" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Edit Block</h4>
</div>
<div class="modal-body">
<form id="editingForm" enctype="multipart/form-data">
<!-- Added label for Order ID -->
<label id="labelorderid" class="" style="display: none">Order ID</label>
<input id="ordid" name="ordid" style="display: none;" class="form-control" placeholder="Order ID" />
<label id="labelurl" class="" style="display: none">Destination Url with http://</label>
<input id="url" name="url" style="display: none;" class="form-control" placeholder="Destination URL with http://" />
<label class="">Strapline</label>
<input id="tooltip" name="tooltip" class="form-control" placeholder="Strapline" />
<label class="">Images</label>
<div id="uploadBox" class="row" style="display: none;">
<div class="col-lg-2">
<img id="blockImage" src="" class="img-responsive zoom" />
</div>
<div class="col-lg-10">
<input id="imageFile" name="imageFile" type="file" class="">
</div>
</div>
<!-- Changed the value of selection - starting at 0 instead of 1 -->
<div id="selectBox" class="row" style="display: none">
<p>Stickers are currently free to change</p>
<select id="stickers">
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/001.jpg' value='0'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/002.jpg' value='1'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/003.jpg' value='2'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/004.jpg' value='3'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/005.jpg' value='4'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/006.jpg' value='5'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/007.jpg' value='6'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/008.jpg' value='7'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/009.jpg' value='8'>
<option data-img-src='/wp-content/plugins/graff/public/images/stickers/010.jpg' value='9'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/011.jpg' value='10'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/012.jpg' value='11'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/013.jpg' value='12'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/014.jpg' value='13'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/015.jpg' value='14'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/016.jpg' value='15'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/017.jpg' value='16'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/018.jpg' value='17'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/019.jpg' value='18'>
<option data-img-src=../wp-content/plugins/graff/public/images/stickers/020.jpg' value='19'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/021.jpg' value='20'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/022.jpg' value='21'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/023.jpg' value='22'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/024.jpg' value='23'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/025.jpg' value='24'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/026.jpg' value='25'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/027.jpg' value='26'>
<option data-img-src='../wp-content/plugins/graff/public/images/stickers/028.jpg' value='27'>
</select>
</div>
<input id="rid" name="rid" type="hidden">
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="saveBlockData()">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
我注意到ShowModal函数是如何将参数传递给表单生成代码的,所以我加入了OrderID。
但是我添加到表单中以显示订单ID的代码不起作用。我只是从其他一个复制并粘贴并对其进行了修改。它不显示输入框的标签。
如何正确显示OrderID的值?如果可以,我可以将其传递给更新表的函数。
答案 0 :(得分:0)
由于输入错误导致代码错误。
$ fiedls ['orderid'] = $ block-> orderid;
应该是
$ fields ['orderid'] = $ block-> orderid;