时间戳

首页 > 解决方案 > 表单提交后回显选择选项数据属性值

php - 表单提交后回显选择选项数据属性值

问题描述

我有一个带有选择标签的表单，我需要为用户在点击 H6 标签所在的提交按钮后选择的多个选项打印数据课程属性

<h5>Course Selection</h5>

<?php if ($data_submitted != null) : ?>
   <h6><?php  foreach ($_POST['job_applied'] as $selectedOption) echo $selectedOption."\n"; ?></h6>
<?php else : ?>
   <select name="job_applied" id="multi_limit" multiple="multiple" class="multiselect form-control">
       <option value="10" data-course="Infromation Technology Course Credit">Infromation Technology Course Credit(10)</option>
       <option value="20" data-course="Main Stream Technologies Credit" >Main Stream Technologies Credit(20)</option>
       <option value="30" data-course="Mechanical Engineering Course" >Mechanical Engineering Course Credit(30)</option>
       <option value="40" data-course="General Mechanics Course Credit" >General Mechanics Course Credit(40)</option>
       <option value="50" data-course="Engineering Pro" >Engineering Pro Credit(50)</option>
       <option value="60" data-course="Master Engineering" >Master Engineering Credit(60)</option>
   </select>
<?php endif; ?>

标签： phphtml

解决方案

有多种方法可以做到这一点，我个人会在服务器端保留一个包含此信息的数组，但是，我不会向您展示，我正在展示一种获取他data-course属性内容的方法.

所以这是这个方法...

问题是，当您发布表单时，只会发布nameand it's value/s。没有发布其他属性的选项。

您必须使用 javascript 拦截表单的提交，并自己发布数据，下面的示例假设您使用的是 jQuery。

<script>
$(document).ready( function(){

  $('form').on('submit', function (e){
    e.preventDefault(); // Stop posting to the server
    var selectedOptions = $('select[name="job_applied"] option:selected'); // Get all the selected options

    // Loop through them
    $.each(selectedOptions, function(i,o){
      // and append a hidden input with a job_applied_meta[data-course][****] name attribute
      // NOTE: The **** above is the value from the selected option.
      $('form').append('<input type="hidden" name="job_applied_meta[data-course]['+$(this).attr('value')+']" value="'+$(this).attr('data-course')+'">')
    })

    // Now post the form
    $('form').submit();
  });

});
</script>

上面现在将向服务器提交 data-course 属性，但它将包含在$_POST['job_applied_meta'].

$_POST['job_applied_meta']['data-course']将是一个数组，如下所示：

array(
   '10' => 'Infromation Technology Course Credit',
   '40' => 'General Mechanics Course Credit'
);

然后您可以像这样访问它：

<?php 
    foreach ($_POST['job_applied'] as $selectedOption) {
       echo $_POST['job_applied_meta']['data-course'][ $selectedOption ]; 
    }
?>

推荐阅读