• Resolved broder

    (@broder)


    I would like to close the popup/modal if pi-address-form-success is added to the form. Any ideas?

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author PI Web Solution

    (@rajeshsingh520)

    Hi,

    Add the below code in your theme functions.php file with this it will auto close the popup on successfull insertion of the address

    
    
    function pisol_custom_20210815() {
    
    	$js = '
    	jQuery(document).ready(function($){
    	$(document).ajaxComplete(function (event, jqxhr, settings) {
            if (settings.data && settings.data.includes("action=pisol_save_address_form")) {
               if(jqxhr.responseJSON){
    				if(jqxhr.responseJSON.success){
    					setTimeout(function () {
    						jQuery.magnificPopup.close()
    					}, 1000);
    				}
    		   }
            }
    	});
    	});';
    	wp_add_inline_script('jquery', $js, 'after');
    }
    add_action( 'wp_print_scripts', 'pisol_custom_20210815', 100 );
    
    
    Thread Starter broder

    (@broder)

    Wow thank you so much. And what if I use the shortcode inside my own modal like so:

    
    <button id="location_btn">Open Modal</button>
    <div id="location_modal" class="modal">
    <div class="location_modal-content">
    <div class="modal-header-2">
    <span class="modal-title-2">Locatie</span>
    <span class="close-2">×</span>
    </div>
    [pi_address_form]
    </div>
    </div>
    

    I understand if this is too much to ask

    Plugin Author PI Web Solution

    (@rajeshsingh520)

    In that case you can add some extra JS code to hide the Html on sucess event(right now we are closing the popup you can hide html)

    see the below new code this will hide the <div id=”location_modal” class=”modal”>
    (make sure to remove the old code and then add this new one in this only different is
    jQuery(“#location_modal”).fadeOut(); )

    
    
    function pisol_custom_20210815() {
    
    	$js = '
    	jQuery(document).ready(function($){
    	$(document).ajaxComplete(function (event, jqxhr, settings) {
            if (settings.data && settings.data.includes("action=pisol_save_address_form")) {
               if(jqxhr.responseJSON){
    				if(jqxhr.responseJSON.success){
    					setTimeout(function () {
    						jQuery.magnificPopup.close()
    					}, 1000);
    					jQuery("#location_modal").fadeOut();
    				}
    		   }
            }
    	});
    	});';
    	wp_add_inline_script('jquery', $js, 'after');
    }
    add_action( 'wp_print_scripts', 'pisol_custom_20210815', 100 );
    
    
    Thread Starter broder

    (@broder)

    Works perfectly thank you! One tiny last thing: I would like to use the user’s input zipcode as the text for the modal button. Preferbly with AJAX, but that is probably not possible. So can I use

    
    if(jqxhr.responseJSON.success){ 
    location.reload();
    

    To reload the page after succes, and update the users zip code?

    Plugin Author PI Web Solution

    (@rajeshsingh520)

    yes you can do that

    Thread Starter broder

    (@broder)

    Thank you!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Close on data success’ is closed to new replies.