隠しフィールドで区切られたパイプとして選択値のリストを取得して送信する

私は2つの選択リストを持つWebフォームを持っています。ユーザーは、1つの選択ボックスから別の選択ボックスに移動します。「2」という名前の選択ボックス内のすべての値のリストを取得し、「TwoArray」という非表示フィールドに入力してフォームを送信します。私はこれを行うには.mapを使うことができると思ったが、私はそれを理解することができなかった。注： "選択されている"かどうかにかかわらず、Select with name Twoにすべての値の区切りリストが必要です。助けてください！この例では隠しフィールドでの出力は、オプションの値を取得する子供たちをループに$.each()を使用し、その後のストレージのための配列を使用してみてください「103109」隠しフィールドで区切られたパイプとして選択値のリストを取得して送信する

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Test for P1727410</title> 
    <script src="/ref-files/js/jquery-3.2.1.min.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      function moveItems(origin, dest) { 
       $(origin).find(':selected').appendTo(dest); 
      } 

      function moveAllItems(origin, dest) { 
       $(origin).children().appendTo(dest); 
      } 

      $('#left').click(function() { 
       moveItems('#Two', '#One'); 
      }); 

      $('#right').on('click', function() { 
       moveItems('#One', '#Two'); 
      }); 

      $('#leftall').on('click', function() { 
       moveAllItems('#Two', '#One'); 
      }); 

      $('#rightall').on('click', function() { 
       moveAllItems('#One', '#Two'); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <h2>Test for P1727410</h2> 
    Available Locations | Selected Locations 
    <form method="POST" action="#"> 
     <select id="One" name="One" multiple="multiple"> 
      <option value="100">Loc1</option> 
      <option value="101">Loc2</option> 
      <option value="102">Loc3</option> 
     </select> 
     &nbsp; 
     &nbsp; 
     <select id="Two" name="Two" multiple="multiple"> 
      <option value="103">Loc4</option> 
      <option value="109">Loc10</option> 
     </select> 

     <br /> 
     <input type="text" name="something" /><br /> 
     <input type="hidden" name="form" value="1" /> 
     <input type="hidden" name="TwoArray" value="" /> 
     <input type="button" id="leftall" value="<<" /> 
     <input type="button" id="left" value="<" /> 
     <input type="button" id="right" value=">" /> 
     <input type="button" id="rightall" value=">>" /> 
     <input type="button" id="update" value="Save" /> 
     <br /> 
     <input type="Submit" name="Submit" value="Submit" /> 
    </form> 
    <p> 
    <?php 
     if(isset($_POST['form'])) { 
      echo "<pre>"; 
      print_r($_POST); 
      echo "</pre>"; 
     } 
    ?> 
    </p> 
</body> 
</html>

出典

2017-09-17 Aaron O

でなければなりません。私はすべてのあなたの他のリスナーの下には、JavaScriptの一番下に、この機能を置く：

https://jsfiddle.net/kc66x5sr/

：

// Listen for an input click (you can listen for whatever) 
$('input').on('click',function(e) { 
    // Set an array 
    var getAllVals = []; 
    // Loop through this select's options (children) 
    $.each($('#Two').children(),function(k,v) { 
     // Store the "value" attribute values 
     getAllVals.push($(v).attr('value')); 
    }); 
    // Place the imploded array into the field 
    $('input[name=TwoArray]').val(getAllVals.join(',')); 
});

を

ここので、あなたはそれを変える見ることができますtextとして入力してjsFiddleのデモです

出典

2017-09-17 06:17:09 Rasclatt

隠しフィールドで区切られたパイプとして選択値のリストを取得して送信する

答えて

関連する問題