PHP/jQuery - 使用GET onChange提交表單複選框值

我試圖使用GET方法從表單中提交複選框值（類別名稱）。我使用自定義PHP函數爲每個類別名稱生成一個鍵（整數）。我page.php文件用於我的網址PHP/jQuery - 使用GET onChange提交表單複選框值

在我page.php：

<form method="GET" action="" id="sidebar-filter-form"> 
    <ul class="sidebar-filter-options-list"> 
     <?php foreach($category_list as $key => $row): ?> 
      <li><input type="checkbox" name="category[]" value="<?php category_key($row->category_name, "k");?>"> <?php echo $row->category_name;?></li> 
     <?php endforeach; ?> 
    </ul> 
</form>

在custom.js：

$(function(){ 
    $('#sidebar-filter-form').on('change', function() { 
     this.form.submit(); 
    }); 
});

我試圖以檢索種類鍵使用排序我的產品上page.php：

$category_keys = isset($_GET['category']) ? $_GET['category'] : null;

我想知道爲什麼我的窗體不重裝我的網頁和改變我的URL來檢索我的鑰匙像www.mywebsite.com/shop?category[]=43&category[]=6&category[]=22（有可能%5B和%5D對Unicode [和]）

來源

2017-03-21 LaGuille

你確定'change'事件觸發嗎？你確定'this.form'選擇了表單嗎？ –

我敢推薦你用另一種方式做得更好。爲什麼不爲所有的複選框使用類，並用jQuery做一個「each」，它返回一個包含所選輸入的數組？ –

@ Roamer-1888，我最終希望在刷新頁面之前添加某種延遲（1-2秒），以便用戶在提交表單之前選擇多個複選框值。我想盡量避免提交按鈕。 'this.form'可以成功觸發更改提示信息，所以我相信它確實會選擇表單。 – LaGuille

-1

另一種解決方案將做出每個複選框。試試這個：

<html> 
<head> 
    <title></title> 
</head> 
<body> 

    <? 
    $items = array(
     array('id' => 20, 'name' => 'Tomato'), 
     array('id' => 32, 'name' => 'Milk'), 
     array('id' => 34, 'name' => 'Sugar') 
    ); 
    ?> 
    <ul>  
<? foreach ($items as $comboItem) : ?> 
     <li><input data-id="<?=$comboItem['id']?>" type="checkbox" class="pick-me"/><?=$comboItem['name']?></li> 
<? endforeach; ?> 
    </ul> 
    <br> 
    <button class="get-all">Get all items selected</button> 
    <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script> 
    <script type="text/javascript"> 
     (function() { 
      $('body').on('click','.get-all', function() { 
       var items = []; 
       $('.pick-me').each(function() { 
        if ($(this).is(':checked')) { 
         items.push($(this).attr('data-id')); 
        } 
       }); 
       console.log(items); 
      }); 
     })(); 
    </script> 
</body> 
</html>

來源

2017-03-21 02:36:14

PHP/jQuery - 使用GET onChange提交表單複選框值

回答

相關問題