2017-10-22 7 views
0

私は利用可能な製品のカテゴリリストを作成しました。私はmultiSelectドロップダウンオプションのためのブートストラップ+選択プラグインを使用しています。私が望むのは、ユーザーがフォームを送信するときに少なくとも1つのオプションを選択することです。フォームが提出されるたびに、カテゴリリストを空白にしないでください。それは私の同僚によるとPHPで行う必要がありますが、私はすでにマルチセレクションのドロップダウンのための第三者プラグインを使用しているので、jQueryやPHPは問題ありません。どんな助けもありがとう。私はこのjQueryを使用してブートストラップ+選択したプラグインを検証する方法ph

私のブートストラップコードとPHPの検証コード試してみました

..だけで動作していないしようとした私もjQueryの

<script> 
    $(document).ready(function(){ 
    $('.chosen-select').chosen({ 
     width: "100%", 
     min_selected_options:1, 
     max_selected_options:3 
    }); 
    }); 
</script> 

答えて

0
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
</head> 
<body> 
    <form action="#" method="post" id="form"> 
    <p id="message"></p> 
    <select multiple class="chosen-select" data-placeholder="Select Your Category" id="category" name="category[]"> 
     <option>Product a</option> 
     <option>Product b</option> 
     <option>Product c</option> 
     <option>Product d</option> 
     <option>Product e</option> 
     <option>Product f</option> 
     <option>Product g</option> 
    </select> 
    <button type="submit">submit</button> 
</form> 

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 

<script> 
    $('#form').on('submit', function (e) { 
     // console.log('errors'); 
     e.preventDefault(); 
     var selectData = $('#category').val(); 
     // console.log(selectData); 

     if (selectData.length< 1 || selectData.length> 3) { 
      $('#message').html('error').css({'color':'red'}); 
      return; 
     } 

     $.ajax({ 
      type: 'post', 
      url:$(location).attr('href'), 
      data: selectData, 
      success: function (data) { 
       $('#message').html('success').css({'color':'green'}); 

      } 
     }); 
    }); 
</script> 
</body> 
</html> 
+0

で試してみました

<select multiple class="chosen-select" data-placeholder="Select Your Category" name="category"> <option>Product a</option> <option>Product b</option> <option>Product c</option> <option>Product d</option> <option>Product e</option> <option>Product f</option> <option>Product g</option> <?php foreach ($catlist as $category) { if (isset($_POST["category"]) && $_POST["category"] == $category) echo "<option selected='selected' value='$category'>$category</option>"; else echo "<option value='$category'>$category</option>"; } ?> </select> //define $categorylist here $catlist = array ( "Product a", "Product b", "Product c", "Product d" "Product e" "Product f" "Product g" ); 

がこの作品ですあなたのために 。? –

+0

これはajaxによって書かれました。これは非常に簡単です 長さ<1 ||長さ> 3:エラー – mehdi

+0

ありがとうございます.. –

関連する問題