将选择框值存储到数组中

Question

i have two select boxes and a link.i select one value from the first select box and another from the second select box and click on the link.the values have to get stored in an array each time without the previous value getting replaced.how can i do this without using multiple select box?

<select name="sq" id="sq" >
<option value=""></option>
</select>

<select name="as" id="as" >
<option value=""></option>
</select>

sorry forgot to mention..its in codeigniter

Answer 1

You can use change event to store the selected values.

Html

<select name="sq" id="sq" >
   <option value="1">1</option>
   <option value="2">2</option>
</select>

Javascript

arrSelected = []
$("#sq").change(function(){
     arrSelected.push($(this).val());
});

Answer 2

With the added info from the comments, here is my suggestion:

HTML:

<div class="selectLine">
<select name="sq[]" >
<option value=""></option>
</select>

<select name="as[]" >
<option value=""></option>
</select></div>
<a id="addOption">

JavaScript:

$('#addOption').click(function(){
    $('.selectLine').last().after($('.selectLine').outerHtml());
    $('.selectLine').last().prev().hide();
});

PHP receiving the post:

foreach($_POST['sq'] as $key=>$name){
    //Make sure you stay consistent with the keys to make sure the 2 values were entered at the same time.
    echo '<p>'.$name.' is a '.$_POST['as'][$key].'</p>';
}

Adding [] to the end of the name of inputs will place them in arrays. But you need more than one if you want more than one value...

You can remove $('.selectLine').last().prev().hide(); to keep the lines displayed to the user so he can change the values if you want.

Answer 3

If you wish to have persistence in your website, then I would recommend looking into PHP Cookies .

In your case, you want to store an array, persistently, so you have a few options.

Either implement a HTML Hidden Element or you can use Serialization to store the array inside a cookie.

Answer 4

This would send the data with AJAX without page refresh:

Use for the link <a href="#" id="submitlink">Submit data</a>

Then add the following jQuery script: (you need to include jQuery library first)

$('#submitlink').click(function(event) {
    event.preventDefault(); // Stops default link behaviour on click         
    $.ajax({ 
      url: "yourphp.php", // where to send
      data: 'sq=' + $('#sq').val() + '&as=' + $('#as').val(), // select values
      type: "POST",
      success: function(data){
           // If you want to confirm
           alert('Added');
      }
   });
});

Then in your php script store the $_POST data in either a database or session...

Session example, storing:

<?php
   session_start();
   if (!isset($_SESSION['sq']) $_SESSION['sq'] = array();
   $_SESSION['sq'][] = $_POST['sq'];

   if (!isset($_SESSION['as']) $_SESSION['as'] = array();
   $_SESSION['as'][] = $_POST['as'];

  ?>

To retrieve the results you could use:

<?php
   session_start();
   if (isset($_SESSION['sq']) print_r($_SESSION['sq']);
   if (isset($_SESSION['as']) print_r($_SESSION['as']);
?>

But of course this could be elaborated.