识别从 WordPress 中动态创建的表单中选择的项目 / PHP

Question

经过一些研究对代码有了更好的理解后，我现在提出一个进一步的问题。

我有一个动态生成的表单，代码如下：

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;

}

代码从 table 中获取数据并显示订单列表以及与每个订单关联的数据。然后代码调用 ShowModal 函数，该函数还为每一行发送用户和数据，并在此处突出显示一个编辑按钮：

$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">&times;</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。

但是，我添加到表单中以显示 orderid 的代码无法正常工作。我只是从其中一个复制并粘贴并修改了它。不显示输入框的标签。

如何正确显示OrderID的值？如果我能让它工作，我可以将它传递给更新 table.

的函数

Answer 1

由于输入错误导致代码错误。

$fiedls['orderid'] = $block->orderid;

应该是

$fields['orderid'] = $block->orderid;

识别从 WordPress 中动态创建的表单中选择的项目 / PHP

Identifying which item was selected from a dynamically created form in WordPress / PHP

php

forms

wordpress

showmodaldialog