hey,
i've created a custom search form.
at the bottom, there's a toggle switch (used with a shortcode i created). it works fine in the initial view (before i set the search parameters and pressed "submit", but once i do press submit, the results appear ok - but the toggle, which is supposed to stay closed until pressed - it open.
i found out that if i use "reload page to update results" - it's fine. BUT - when i do that, and want to reset the form, it resets badly, giving me all values for each input, instead of giving me just the available ones.
help appreciated...
thanks!
Dear Ido,
I assume you are using custom JS codes to setup the "toggle switch", and you are using AJAX search feature within the search form, it will conduct some unexpected result, you can try one of below options:
1) Disable AJAX search of the Views search form
2) Trigger your custom JS codes with Views event handler "js_event_wpv_parametric_search_results_updated", for example, this thread:
https://toolset.com/forums/topic/parametric-search-ajax-refresh-on-text-field-value-change/#post-329577
hey,
thanks.
like i mentioned myself, once ajax is turned off, it works - but then i have a problem with the reset button:
"when i do that, and want to reset the form, it resets badly, giving me all values for each input, instead of giving me just the available ones."
i'm triggering the toggle with a shortcode from a plugin i created. i actually tried using JS from a thread i found here - it was the same problem.
i had a different but similar issue in this thread:
https://toolset.com/forums/topic/never-display-no-results/page/2/
i tried adding the code (changed the id and class of course) and it didn't help either.
How do you setup the "toggle switch"? could you describe detail steps to duplicate same problem?
Since it is a custom JS codes problem, I need to test and debug it in alive website, thanks
it's a plugin which created a shortcode. but i've also tried this:
https://toolset.com/forums/topic/toggle-shortcode/
same results.
For example you are using below JS codes to setup the "toggle switch":
jQuery( "#click" ).click(function() {
jQuery( ".target" ).toggle( "slow", function() {
// Animation complete.
});
});
Then you can modify it as below:
jQuery(document).ready(function($) {
$( document ).on( 'js_event_wpv_pagination_completed', function() {
my_custom_js_func();
});
$( document ).on( 'js_event_wpv_parametric_search_results_updated', function() {
my_custom_js_func();
});
function my_custom_js_func(){
//$('input').on('change', function() {})
jQuery( "#click" ).click(function() {
jQuery( ".target" ).toggle( "slow", function() {
// Animation complete.
});
});
}
});
It is only an example, you will need to customize the JS codes according to your JS codes, if you still need assistance for it, please provide a test site with the same problem, and fill below private detail box with login details, also point out the problem page URL and view URL, I need a live website to test and debug
Thanks for the details, I can login your website, but it isn't in English, please point out the problem page URL and view URL, where and how can I see the problem, and it is weekend, you might get a delay answer.
Thanks for the details:
Since you did not describe how and where I can see the problem, I add a example in your website:
Edit the view "questions search", in section "עורך מסננים", line 2, add a toggle link and a toggle DIV with below codes:
<a href="#" class="toggle-link">Show/Hide toggle div</a>
<div class="toggle">
Here is something need to be toogled
</div>
click "עורך JS", add below JS codes:
jQuery(document).ready(function($) {
$( document ).on( 'js_event_wpv_pagination_completed', function() {
my_custom_js_func();
});
$( document ).on( 'js_event_wpv_parametric_search_results_updated', function() {
my_custom_js_func();
});
function my_custom_js_func(){
jQuery( "a.toggle-link" ).click(function() {
jQuery( "div.toggle" ).toggle( "slow", function() {
// Animation complete.
});
});
}
my_custom_js_func();
});
Above JS codes will be able to triggered after you submit the search form with AJAX feature, you can enable AJAX search in the view, and test again.
There is a misunderstanding, since you are using option "Update the View results only when clicking on the search button" in the view, after user submit the search form, the page will be refreshed, then the toggle effect will be reset. so it is expected result:
Those hidden div will be in open status.
thx man
but the toggle problem was solved when we refreshed the page instead of ajax
now the problem is that the reset button is failing after refresh
as i mentioned, it shows all options in the search form instead of just the available ones
pasting from original thread:
“i found out that if i use "reload page to update results" - it's fine. BUT - when i do that, and want to reset the form, it resets badly, giving me all values for each input, instead of giving me just the available ones.”
cheers 🙂
I assume we are talking about the button "אפס נתונים", I just tested it in your website, with below steps, please correct me if there is anything missing:
1) Open URL
hidden link
2) I see drop down menu "כמה יחידות?" display 3 options: 3, 4, 5
Choose option 3, and submit the search form
3) Click the reset button, I can see the down menu "כמה יחידות?" still display 3 options: 3, 4, 5
Where and how can see the problem:
it resets badly, giving me all values for each input, instead of giving me just the available ones.
Thanks
thx
choose 3
then the first option in each dropdown (from right to left, since it's hebrew):
481\804
בעיות מילוליות
אחוזים
then press the left button תנו לי את זה! (this is the submit button)
wait for results
then press אפס נתונים (that's the reset)
and choose 3 again
you'll see that instead of the next field showing only 3 options (like in the initial search), now it shows ALL options. same for all other dropdowns.
thx!
Thanks for the details, I tried as you mentioned above, when click the reset button, it redirect me to a strange URL:
hidden link
There is a string in the URL: "#038;", which is HTML encoded of character "&", and I see JS error:
Uncaught Error: Syntax error, unrecognized expression: .otw-sc-tabs [href=#038;wpv-wpcf-questionnaire-number=]
See screenshot reset.JPG, please confirm it is the same problem you mentioned above.
It is abnormal, in case there is any other compatibility problem in your website, please check these:
1) deactivate other plugins and switch to wordpress default theme, and test again
2) If the problem persists, please provide a database dump file(ZIP file) of your website in below private detail box, I need to duplicate same problem and debug it in my localhost, thanks
Thanks for the details, I can download the file, and trying to duplicate same problem, will feedback if there is anything found