CODEWITHSUNDEEP
phphtmlcountlimitmulti-select
Jewel
Jewel

Reputation: 31

Limit Count of Multiselect HTML PHP

How can I limit the count of multiselect? Like I want the user to select atmost 3 elements from multiselect. If more than 3 are selected then I ll throw him an error...

Upvotes: 0

Views: 3043

Answers (5)

Griminvain
Griminvain

Reputation: 95

I know that this is an old question but if someone is trying to do the same thing now and looking for answers is best to write a current answer for this one. The best way at the moment is with AJAX (as long as I know):

HTML: form.html

    <form id="myForm" action="validate.php?q=1">
        <select name="options[]" multiple="multiple">
        <!-- options here ... -->
        </select>
        ...
    </form>

PHP: validate.php

    <?php
        switch($_REQUEST['q']){
            case 0:
                if(isset($_REQUEST['options']) && count($_REQUEST['options']) <=3){
                    echo true;
                }else{
                    echo false;
                }
            break;
            case 1:
                if(isset($_POST['options']) && !empty($_POST['options'])){
                    if(count($_POST['options']) <= 3){
                        //OK
                    }else{
                        //NOT OK
                    }
                }
            break;
        }
    ?>

JavaScript(jQuery): script.js

    var form = $("#myForm");
    var options = $("#select_menu option")
    var selected = [];

    $(options).each(function(key,option){
        if(option.selected){
            selected[key] = option;
        }
    });

    $.ajax({
        url: "validate.php",
        method: "GET",
        data: {
            options: selected,
            q: 0
        },
        success: function(Response){
            if(Response === true){
                //OK
            }else{
                //NOT OK
            }
        }
    });

Please correct me if I have error somewhere.

Upvotes: 0

Greg
Greg

Reputation: 21899

Here is a complete example, showing the HTML of a simple form and the PHP that only allows up to three options being selected - and an added bonus of client-side JavaScript to explain how the user can be informed of their error before the form is submitted.

You can use JavaScript to stop the user checking more than three options, but note that client-side validation can easily be avoided, so you will still need to use PHP to verify on the server.

HTML

<!doctype html>
<head>
    <meta charset="utf-8">
    <title>Multiselect example</title>
</head>

<p>Please make a selection below (maximum three options!)</p>

<form method="post">
    <select name="selection[]" multiple="multiple">
        <!-- Put <option> elements here -->
    </select>

    <input type="submit">
</form>

<script src="Script.js"></script>

JavaScript (in Script.js):

var formChange = function(e) {
    var i, 
        num = 0, 
        // Obtain a list of all selected options:
        nodeList = this["selection[]"];

    // Loop over all options, count how many are selected.
    for(i = 0; i < nodeList.length; i++) {
        if(nodeList[i].selected) {
            num ++;
        }
    }

    if(num > 3) {
        alert("Please do not select more than three options");
        e.preventDefault();
    }
};

// Attach the same function to the change and submit event.
// This will alert the user of more than three selections 
// as the fourth is selected, or as the form is submitted.
// ... it will also not allow the form to submit with
// more than three checked boxes.
document.forms[0].addEventListener("change", formChange);
document.forms[0].addEventListener("submit", formChange);

PHP:

if(isset($_POST["selection"])) {
    if(count($_POST["selection"]) > 3) {

         die("Error: More than three check boxes were checked.");
    }

    // $_POST["selection"] is an array of the checked values.
}

Upvotes: 3

m0ntassar
m0ntassar

Reputation: 310

Take a look at this js function, suppose your multiselect object is "muSelect"

function checkSelected() {
 var i;
  var count = 0;
  for (i=0; i<muSelect.options.length; i++) {
    if (muSelect.options[i].selected) {
      count++;
    }
     if (count > 3) {
        alert("cant select more than three options";
        // any  other additionnal processing
      }
  }
}

and then you can add this function as onClick event

Upvotes: 0

jensgram
jensgram

Reputation: 31508

If you want to do it server-side, look at the count() function. E.g.,

HTML:

<form ...>
  <select name="options[]" multiple="multiple">
    <!-- options here ... -->
  </select>
  ...
</form>

PHP:

<?php

if (isset($_POST['options']) && count($_POST['options']) <= 3) {
    // OK
} else {
    // Not OK
}

?>

Upvotes: 1

GordonM
GordonM

Reputation: 31730

A multiselect element in PHP returns an array, so it's simply a matter of comparing the count() of the returned array against the maximum value you want to allow and generating some kind of error if the count exceeds the limit (throw an exception, trigger an error, etc).

Upvotes: 1

Related Questions