html形式でアイテムのリストを提出するには

元のリクエストは混乱していたようですので、私は再言葉遣いを試してみましょう。私は2つの選択肢を持つフォームを持っています。ユーザはAvailable Locationsリスト（One）からSelected Locationsリスト（Two）に移動し、他のフィールドを入力します（例として1つのテキストフィールドを含む）。どの値が最初の選択（One）にあり、どの値が2番目のリスト（2つ）にあるのかを確認できるようにするhtml形式でアイテムのリストを提出するには

値が多数あるので、値をクリックするかCtrl +彼らは実用的ではありません。

<!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="1">Loc1</option> 
      <option value="2">Loc2</option> 
      <option value="3">Loc3</option> 
     </select> 
     &nbsp; 
     &nbsp; 
     <select id="Two" name="Two" multiple="multiple"> 
     </select> 

     <br /> 
     <input type="text" name="something" /><br /> 
     <input type="hidden" name="form" value="1" /> 
     <input type="button" id="leftall" value="<<" /> 
     <input type="button" id="left" value="<" /> 
     <input type="button" id="right" value=">" /> 
     <input type="button" id="rightall" value=">>" /> 
     <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

どうして**すべてを選択しない/なし**？正確に何が問題なのですか？オプションは何ですか？ –

@DaniSpringer私は892までの場所のリストを持っています。利用可能な場所から特定の場所を選択し、選択した場所に追加することを望んでいます。私たちはユーザーを更新しています場所は1から892までの任意の場所を選択することができますが、すべてを選択するのは素晴らしいですが、多くの場合、サブセットが必要です –

検索ボックスを追加して結果を除外します。または他のフィルタ。私はその質問が何であるか理解していない。それが「私のためにこれをすることができますか？ SOはトラブルシューティングに役立ちます：[mcve] –

-1

私たちは、あなたが正確にフロントエンド（HTML + Javascriptを）に表示したいのかわからないので、この質問は、混乱していますが、バックエンド（PHP）に送信する何をすべきか、とあなたはデータベースに何を挿入/更新/削除したいのですか？

私が考える最も簡単な解決策は以下の通りです：ユーザー、場所、およびuser_locations：あなたは3つのデータベース内のテーブルを持っている必要があり

。 user_locationsには少なくとも2つの列、「user_id」と「location_id」が必要です。

HTML：隠された新しいHTML入力を追加します。

<input type="hidden" id="two_values" name="two_values" value="" />

Javascriptを：ユーザーがクリックするボタンを送信すると、第二のドロップダウンのすべての値を取り、サーバーに送信します。これと同じように：

<script> 
    $(document).ready(function() { 
     // on user clicks submit button, this code will be executed first 
     $('form').submit(function() { 
      // we'll take all values of the Two dropdown and put them in 1 string 
      var all_values = ''; 
      $("#Two option").each(function() { 
       if(all_values === '') { 
        all_values += $(this).val(); 
       } else { 
        all_values += ',' + $(this).val(); 
       } 
      }); 
      $('#two_values').val(all_values); 
     }); 
    }); 
</script>

PHP： two_valuesを取得し、配列にそれらを分割します。

if(isset($_POST['form'])) { 
    $two_values_arr = explode(',', $_POST['two_values']); 
    // ... 
}

PHPとMySQL：まず、以前のすべてのユーザーの場所を削除：次に

$q = 'DELETE FROM `locations` WHERE `user_id` = ' . $user_id; 
// run the $q ..

を、このユーザのために、それぞれの値を挿入するHTMLを表示

foreach($two_values_arr as $location_id) { 
    $q = 'INSERT INTO `user_locations` (user_id, location_id) VALUES (' . $user_id . ', ' . $location_id . ')'; 
    // run the $q .. 
}

をループを行います：ユーザーがページを閲覧するときは、すべてのユーザーの場所、ユーザーが持っている場所をt彼は2ドロップダウン、そして彼は1ドロップダウンで持っていないもの

出典

2017-09-17 06:48:53 evilReiko

html形式でアイテムのリストを提出するには

答えて

関連する問題