form filter based on jQuery works for archive-ajut.php category

includes/custom-field-ajuts-filter-function-frontend.php

@@ -49,7 +49,6 @@ if( ! function_exists( 'ofisuport_ajuts_filters_form' ) ):
               if( isset($_GET[ $fieldname ]) ) {
 
                 $filteredvalues['value'] = explode(',', $_GET[ $fieldname ]);
-                //$filteredvalues['value'] = ($_GET[ $fieldname ]);
 		          };
 		          //end check for values in url
 
@@ -61,15 +60,10 @@ if( ! function_exists( 'ofisuport_ajuts_filters_form' ) ):
           <h5><?php echo $fields['label'];?></h5>
             <?php  foreach( $fields['choices'] as $choicevalue => $choicelabel ) { ?>
 
-          <div class="filter" data-filter="<?php echo $fields['name'];?>">
+            <div class="filter" data-filter="<?php echo $fields['name'];?>">
-            <input
+              <input class="ofisuport-filter" type="checkbox" name="<?php echo $fields['name'];?>" <?php if( in_array($choicevalue,$filteredvalues['value']) ) { echo 'checked';}; ?> value="<?php echo $choicevalue ?>" />
- class="ofisuport-filter"
+              <label for="<?php echo $choicevalue; ?>"><?php echo $choicelabel;?></label>
- type="checkbox"
+            </div>
- <?php if( in_array($choicevalue,$filteredvalues['value']) ) { echo 'checked';}; ?>
- value="<?php echo $choicevalue ?>"
- name="<?php echo $fields['name'];?>" />
-            <label for="<?php echo $choicevalue; ?>"><?php echo $choicelabel;?></label>
-          </div>
 
             <?php };//end foreach fields['choices'] ?>
 
@@ -85,8 +79,8 @@ if( ! function_exists( 'ofisuport_ajuts_filters_form' ) ):
         <?php }; //end if type checkbox ?>
 
       <?php }; //end foreach groupkey field ?>
-      <p><b>Results:</b> <span id="results"></span></p>
+      <?php //echo '<p><span id="filterlink"></span></p>';?>
-      <button type="submit" class="button-more">enviar</button> 
+      <p><a id="submitfilteredlink" name="submit-ajut" class="button button-more" href="">enviar</a> </p>
       </form>
 <?php //close the form and subit ?>
 
@@ -96,87 +90,77 @@ if( ! function_exists( 'ofisuport_ajuts_filters_form' ) ):
 
 <script type="text/javascript">
 
-//https://wordpress.stackexchange.com/questions/383599/form-checkbox-value-going-to-dynamic-url
-// sample form on submiit
-//
-(function($){
-
-  $('#form-ajuts').on('submit', function(e) {
-  
-    // prevent default
-    e.preventDefault();
-  
-    // set empty submission object
-    let submission = {};
-  
-    // for each of this form submit event target object entries as key/field
-    for (const [key, field] of Object.entries(e.target)) {
-  
-      // if object entry (field) has a name attribute
-      if (field.name) {
-  
-        // if field type is
-        if (field.type === 'checkbox') {
-
-         // set field name as array
-         submission[field.name] = [];
-          // if checkbox is checked
-          if (field.checked) {
-            
-            // add name/value to submission object
-            submission[field.name].push(field.value);
-
-          }
-  
-        } else if (field.value) {
-  
-          // add name/value to submission object
-          submission[field.name] = field.value;
-  
-        }
-  
-      }
-  
-    }
-  
-    // now let loop through our submission and check for arrays
-    for (const [name, value] of Object.entries(submission)) {
-  
-      // if submission value is array
-      //if (Array.isArray(value)) {
-        // let convert array to string
-        //submission[name] = value.join(',');
-  
-      //}
-  
-    }
-    
-    // convert submission object to url safe params string
-    let submission_url_params = $.param(submission);
-    
-    // if we have submission params
-    if(submission_url_params) {
-    
-      // success actions
-    
-      // create our submission action url
-          let submission_url_action = this.action + (submission_url_params ? '?' + submission_url_params : '');
-      
-      // un-comment this to actually fire the form submission
-      window.location.href = submission_url_action;
-  
-    // else no submission params
-    } else {
-    
-      // no submission data actions
-    
-    }
-  
-  });
-
-});
 
 
+
+(function($) {
+    // change
+    //$('#archive-filters').on('click', 'button', function(){
+    $('#archive-filters').on('click', 'input', function(){
+
+        // vars
+        var url = '<?php echo home_url('ajuts/'); ?>';
+            args = {};
+        var appendtoURL = '';
+        var eachfiltered = '';
+        var valueschecked = '';
+
+        // loop over filters
+        $('#archive-filters .filter').each(function(){
+           // check if is first appearance of each
+           if( eachfiltered != $(this).data('filter') ){
+             // save already calculated field=val01,val02,val03
+             if( eachfiltered != '' && valueschecked != '' ){
+               // remove last ','
+               valueschecked = valueschecked.slice(0, -1);
+               appendtoURL += eachfiltered +'=' +valueschecked +'&';
+             };
+             // start new fieldname filtered
+             eachfiltered = $(this).data('filter');
+             // reset values
+             valueschecked = '';
+             // find checked inputs 
+             $(this).find('input:checked').each(function(){
+               // if not empty save value and ,
+               if( $(this).val() != '' ){
+                valueschecked += $(this).val() + ',';
+               };
+             });
+             //alert( appendtoURL +":" +eachfiltered +"=" +valuescheked);
+           } else {
+             // we have previous values checked
+             // find checked inputs
+             //if( $(this).val() != '' ){
+               // if not empty append value and ,
+               $(this).find('input:checked').each(function(){
+                 valueschecked += $(this).val() + ',';
+               });
+             //alert( appendtoURL +":not:" +eachfiltered +"=" +valuescheked);
+             //};
+           };
+        });
+        
+        // remove last ','
+        valueschecked = valueschecked.slice(0, -1);
+        // save last cycled filtered value already calculated field=val01,val02,val03
+        appendtoURL += eachfiltered +'=' +valueschecked +'&';
+
+        // remove last &
+        appendtoURL = appendtoURL.slice(0, -1);
+        
+        // update url
+        url += '?' +appendtoURL;
+
+        // show or modify the url
+        //alert( url );
+        //$('#filterlink').text(url);
+        
+        // convert a href url to new value
+        $('#submitfilteredlink').attr('href',url);
+
+    });
+
+})(jQuery);
 </script>
 
 <?php