• Basically I am using woocommerce-shipping-calculator and in that when we add an address the form works great but once we submit the response I don’t know how the form’s DOM element just disappear. I guess that will be replaced with the response but if a customer wants to change that how would that be practical.
    Below I am providing the code snippet :

    // taking data
    $(document).find('[name="calc_address_code"]').val(selectedOption['AddressName']);
    			$(document).find('[name="shipping_address_1"]').val(selectedOption['Street']);
    			$(document).find('[name="shipping_address_2"]').val(selectedOption['Block']);
    			$(document).find('#calc_shipping_country').val(selectedOption['Country']);
    			$(document).find('#calc_shipping_state').val(selectedOption['State']);
    			$(document).find('#calc_shipping_city').val(selectedOption['City']);
    			$(document).find('#calc_shipping_postcode').val(selectedOption['ZipCode']);
    			$(document).find('#calc_person_name').val(selectedOption1['Name']);
    			$(document).find('#calc_person_email').val(selectedOption1['Email']);
    
    //
    checking for the value and triggering the action : 
    			if (modal.find('#select-address').length) {
    				console.log("Before accessing 'selectAccount':", document.getElementById('selectAccount'));
    				$(document).find('[name="calc_shipping"]').trigger('click');
    				console.log("After triggering calc_shipping:", document.getElementById('selectAccount'));
    			}
    
    //action :
    <form class="woocommerce-shipping-calculator" action="<?php echo esc_url(wc_get_cart_url()); ?>" method="post">
    
    	<?php printf('<a href="#" class="shipping-calculator-button">%s</a>', esc_html(!empty($button_text) ? $button_text : __('Calculate shipping', 'woocommerce'))); ?>
    	<a href="javascript:void(0);" id="ButtonToSelectAddress" class="select-account button" onclick="openModal()">Select Address</a>
    	<div id="addNotification"></div>
    
    
    	<section class="shipping-calculator-form" style="display:none;">
    
    		<?php if (apply_filters('woocommerce_shipping_calculator_enable_country', true)) : ?>
    			<p class="form-row form-row-wide" id="calc_shipping_country_field">
    				<select name="calc_shipping_country" id="calc_shipping_country" class="country_to_state country_select" rel="calc_shipping_state">
    					<option value="default"><?php esc_html_e('Select a country / region&hellip;', 'woocommerce'); ?></option>
    					<?php
    					foreach (WC()->countries->get_shipping_countries() as $key => $value) {
    						echo '<option value="' . esc_attr($key) . '"' . selected(WC()->customer->get_shipping_country(), esc_attr($key), false) . '>' . esc_html($value) . '</option>';
    					}
    					?>
    				</select>
    			</p>
    		<?php endif; ?>
    
    		<?php if (apply_filters('woocommerce_shipping_calculator_enable_state', true)) : ?>
    			<p class="form-row form-row-wide" id="calc_shipping_state_field">
    				<?php
    				$current_cc = WC()->customer->get_shipping_country();
    				$current_r  = WC()->customer->get_shipping_state();
    				$states     = WC()->countries->get_states($current_cc);
    
    				if (is_array($states) && empty($states)) {
    				?>
    					<input type="hidden" name="calc_shipping_state" id="calc_shipping_state" placeholder="<?php esc_attr_e('State / County', 'woocommerce'); ?>" />
    				<?php
    				} elseif (is_array($states)) {
    				?>
    					<span>
    						<select name="calc_shipping_state" class="state_select" id="calc_shipping_state" data-placeholder="<?php esc_attr_e('State / County', 'woocommerce'); ?>">
    							<option value=""><?php esc_html_e('Select an option&hellip;', 'woocommerce'); ?></option>
    							<?php
    							foreach ($states as $ckey => $cvalue) {
    								echo '<option value="' . esc_attr($ckey) . '" ' . selected($current_r, $ckey, false) . '>' . esc_html($cvalue) . '</option>';
    							}
    							?>
    						</select>
    					</span>
    				<?php
    				} else {
    				?>
    					<input type="text" class="input-text" value="<?php echo esc_attr($current_r); ?>" placeholder="<?php esc_attr_e('State / County', 'woocommerce'); ?>" name="calc_shipping_state" id="calc_shipping_state" />
    				<?php
    				}
    				?>
    			</p>
    		<?php endif; ?>
    
    		<?php if (apply_filters('woocommerce_shipping_calculator_enable_city', true)) : ?>
    			<p class="form-row form-row-wide" id="calc_shipping_city_field">
    				<input type="text" class="input-text" value="<?php echo esc_attr(WC()->customer->get_shipping_city()); ?>" placeholder="<?php esc_attr_e('City', 'woocommerce'); ?>" name="calc_shipping_city" id="calc_shipping_city" />
    			</p>
    		<?php endif; ?>
    
    		<?php if (apply_filters('woocommerce_shipping_calculator_enable_postcode', true)) : ?>
    			<p class="form-row form-row-wide" id="calc_shipping_postcode_field">
    				<input type="text" class="input-text" value="<?php echo esc_attr(WC()->customer->get_shipping_postcode()); ?>" placeholder="<?php esc_attr_e('Postcode / ZIP', 'woocommerce'); ?>" name="calc_shipping_postcode" id="calc_shipping_postcode" />
    			</p>
    		<?php endif; ?>
    		<?php $calc_card_details = WC()->session->get('calc_card_details');
    		$calc_address_code = WC()->session->get('calc_address_code');
    		$custom_address_details = WC()->session->get('custom_address_details'); ?>
    		<input type="hidden" name="calc_card_code" value="<?php echo $calc_card_details['code']; ?>" />
    		<input type="hidden" name="calc_address_code" value="<?php echo $calc_address_code; ?>" />
    		<input type="hidden" name="billing_address_1" value="<?php echo $custom_address_details['street']; ?>" />
    		<input type="hidden" name="shipping_address_1" value="<?php echo $custom_address_details['street']; ?>" />
    		<input type="hidden" name="billing_address_2" value="<?php echo $custom_address_details['building']; ?>" />
    		<input type="hidden" name="shipping_address_2" value="<?php echo $custom_address_details['building']; ?>" />
    		<input type="hidden" name="custom_shipping_block" value="<?php echo $custom_address_details['block']; ?>" />
    		<input type="hidden" name="custom_shipping_regular" value="<?php echo $custom_address_details['regular']; ?>" />
    		<input type="hidden" name="new-custom" value="<?php echo $custom_address_details['new']; ?>" />
    		<input type="hidden" name="calc_card_name" value="<?php echo $calc_card_details['name']; ?>" />
    		<p><button type="submit" name="calc_shipping" value="1" class="button" onclick="Submit()"><?php esc_html_e('Update', 'woocommerce'); ?></button></p>
    		<?php wp_nonce_field('woocommerce-shipping-calculator', 'woocommerce-shipping-calculator-nonce'); ?>
    	</section>
    </form>

    Any help will be very helpful.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author rajeshsingh520

    (@rajeshsingh520)

    sorry did not understand your issue, when our form is submitted the response that we get do not replaces the form in the DOM it only shows the shipping method at the top of the form

    send your product page link and what address to be inserted in the form to see the issue

    Thread Starter megha5sharma

    (@megha5sharma)

    Hello @rajeshsingh520,
    Thank you for replying. Let me try to explain my issue again clearly with images:

    1. https://drive.google.com/file/d/1fnXrFL40udfP1SzSJhmyb0ug7YPPj1Pm/view?usp=sharing
      Here you can see that in beginning I am getting the option to select the address and name from the list, once I select the address and name and click on select button I am getting the shipping methods list available through an API which we created in backend.
    2. https://drive.google.com/file/d/1TE5B7WpHOlLJeF2KmfaWey-Iw2AJVFgz/view?usp=sharing
      Here you can see that I am getting the shipping list after this when I try to click on the select address button again for updating my address I am unable to do that as I checked that the form is now not in DOM.

    So now my question is why this is happening. I have provided the code in my previous asked question.
    I am very new to WordPress so not have much idea, can you also explain me the “woocommerce-shipping-calculator” hook and like from where I can get more in-depth knowledge about this
    Any help will be appreciated.

    Thank you

    • This reply was modified 4 months, 2 weeks ago by megha5sharma.
    Plugin Author rajeshsingh520

    (@rajeshsingh520)

    the 2 screenshot that you have send are not part of our plugin they are the part of the cart page not controlled by our plugin

    Thread Starter megha5sharma

    (@megha5sharma)

    I am very new to WordPress so not have much idea, can you also explain me the “woocommerce-shipping-calculator” hook and like from where I can get more in-depth knowledge about this.
    So like from where I can see about the cart page?

    Plugin Author rajeshsingh520

    (@rajeshsingh520)

    WooCommerce has a function woocommerce_shipping_calculator() that outputs the calculator in your case this calculator is modified by some plugin as in normal calculator it only has this fields (Country, State, City and Post code field) but in your case it has some different field so some other plugin is modifying your shipping calculator function output

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.