更改另一个选择时更改选择值

Question

我得到了 3 个数组，我从中创建了 2 个选择框和一个复选框。我想要做的是，当我更改 CMS 时，复选框值需要像数组中一样更改。

如果我在选择框中选择 Joomla，那么我想要使用 $aOnderdelen 制作的复选框，然后在数组 $aOnderdelen 中我有一个包含 Contact-form Foto-gallery 和 Carousel 的数组，这 3 个有一个具有不同值的每个 CMS 的名称的数组，这是当您选择其中一个和 CMS 时复选框需要获取的值。

示例：我选择 Joomla 并选择一个 Contact-formulier，而不是 contact-formulier checkbox 得到 3 作为值。

$aCMS = array('SilverbeeCMS','Joomla','WP','Drupal','Scott');

$prijsPerUur=1;
$basisPrijs=
array(
    array('titel' => 'Kopie', 'uur' => '8'),
    array('titel' => 'Maatwerk', 'uur' => '10'),
    array('titel' => 'Aangekocht', 'uur' => '12'),
    array('titel' => 'Custom', 'uur' => '14')
     );

$aOnderdelen = array
(
    'Contact-formulier' => array 
        (
            'SilverbeeCMS'=>3,
            'WP'=>2,
            'Joomla'=>3,
            'Drupal'=>4,
            'Scott'=> 5
        ),
    'Foto-gallery' => array
        (
            'SilverbeeCMS'=>1,
            'WP' => 3,
            'Joomla'=> 4,
            'Drupal'=> 5,
            'Scott'=> 6
        ),
    'Carousel' => array
        (
            'SilverbeeCMS'=>1,
            'WP' => 4,
            'Joomla'=> 5,
            'Drupal'=> 6,
            'Scott'=> 7
        )
);

    ?>

这是选择和复选框所在的 HTML 表单

<form action="" method="post">
   <select id="cms" class="form-control" name="cms">
      <?php foreach($aCMS as $key => $value): ?>
      <option value="<?php echo strtolower($aCMS[$key]); ?>"> 
      <?php echo $aCMS[$key]; ?>
      </option>
      <?php endforeach; ?>                          
   </select>    

  <label><?php echo $template.$verplicht; ?></label>

  <select id="templates" class="form-control" name="templates">
      <?php foreach($basisPrijs as $key => $value): ?>
      <option value="<?php echo $basisPrijs[$key]["uur"]; ?>">
      <?php echo $basisPrijs[$key]["titel"]; ?>
      </option>
      <?php endforeach; ?>                          
  </select>    

  <?php echo $oTitel; ?>
  <div class="checkbox col-xs-12">
     <div class="row">
        <?php foreach($aCMS as $cmsKey => $cmsValue) ?>            
        <?php foreach($aOnderdelen as $key => $value):
            foreach($value as $key1 => $value1)
              {};
              $i++;
              echo "<div class='checkbox'>
        <label><input class='check".$i."' type='checkbox' value='".strtolower($key)."'  name='".$key."'>".$key."</label></div>"
                    ;endforeach;?> 

      </div>
   </div>
</form>

Answer 1

您必须使用 jquery 和 AJAX 来动态更改内容

简单的例子

 $(document).ready(function() {
    $('#selector').change(function() {
        //do here things required about changing
        //You can also change DOM elements according to needs
        //and have Ajax requests
    })
 });

Answer 2

我找到了方法

switch($("option:selected").val()) 
                 {
                 case "silverbeecms":
                         $(".check1").val(<?php echo $aOnderdelen["Contact-formulier"]["SilverbeeCMS"] ?>)
                         $(".check2").val(<?php echo $aOnderdelen["Foto-gallery"]["SilverbeeCMS"] ?>)
                         $(".check3").val(<?php echo $aOnderdelen["Carousel"]["SilverbeeCMS"] ?>)
                         break;

                case "joomla":
                         $(".check1").val(<?php echo $aOnderdelen["Contact-formulier"]["Joomla"] ?>)
                         $(".check2").val(<?php echo $aOnderdelen["Foto-gallery"]["Joomla"] ?>)
                         $(".check3").val(<?php echo $aOnderdelen["Carousel"]["Joomla"] ?>)
                         break;

                case "wp":
                         $(".check1").val(<?php echo $aOnderdelen["Contact-formulier"]["WP"] ?>)
                         $(".check2").val(<?php echo $aOnderdelen["Foto-gallery"]["WP"] ?>)
                         $(".check3").val(<?php echo $aOnderdelen["Carousel"]["WP"] ?>)
                         break;

                case "drupal":
                         $(".check1").val(<?php echo $aOnderdelen["Contact-formulier"]["Drupal"] ?>)
                         $(".check2").val(<?php echo $aOnderdelen["Foto-gallery"]["Drupal"] ?>)
                         $(".check3").val(<?php echo $aOnderdelen["Carousel"]["Drupal"] ?>)
                         break;

                case "scott":
                         $(".check1").val(<?php echo $aOnderdelen["Contact-formulier"]["Scott"] ?>)
                         $(".check2").val(<?php echo $aOnderdelen["Foto-gallery"]["Scott"] ?>)
                         $(".check3").val(<?php echo $aOnderdelen["Carousel"]["Scott"] ?>)
                         break;
                 }

Answer 3

新答案更灵活 首先循环遍历 PHP 数组。

 <?PHP
    foreach($aCMS as $cmsKey => $cmsValue)
 ?>
 <?php
    foreach($aOnderdelen as $key => $value)
      :
       foreach($value as $key1 => $value1){};
  ?>

比使用数据属性来获取价格。

<input class="<?php echo strtolower($key);?>" type="checkbox" value="<?php echo strtolower($key)?>" name="<?php echo $key;?>" data-silverbeecms="<?php echo $value['SilverbeeCMS']; ?>" data-wp="<?php echo $value['WP'];?>" data-joomla="<?php echo $value['Joomla'];?>" data-drupal="<?php echo $value['Drupal'];?>" data-scott="<?php echo $value['Scott'];?>">

在数据中获得价格后，您可以从 JQUERY 调用此数据并进行匹配。

urenOnderdelen = 0;  
    $("#sCms, #templates, .contact-formulier, .foto-gallery, .carousel").change(function() 
        {
            urenOnderdelen = 0;   
            urenTemplate = $("#templates").val();
            $(".contact-formulier, .foto-gallery, .carousel").each(function()
            {
                if(this.checked) 
                {
                    urenOnderdelen+=parseInt($(this).data($("option:selected").val())); 
                }  
            });  
            $("#output, #output1, #gVoor").hide().fadeIn(300);
            urenTemplate = $("#templates").val();  
            urenTemplate = parseInt(urenTemplate); 
            urenOnderdelen = parseInt(urenOnderdelen);
            totaal = urenOnderdelen + urenTemplate;
            $("#output").text(euroTeken + totaal*prijs);
        });