I am currently setting up a WordPress website and everything is going fine except for one issue I simply can't figure out.
So basically I have a booking form on my website that allows people to select a couple values (number of bedrooms and bathrooms) and then when they click the button those values are amended to the booking-page URL and loaded.
The problem I'm running into is that the code is being amended to the end of my current (home) page and thus not having any effect/ just reloading the page.
After hours of looking around/ troubleshooting, and guessing I believe the code of interest is as follows from the theme I have installed. Would it be an issue of permalink (20) not existing and thus just returning the current page? If so that's odd since this theme is supposed to be ready to go right from install.
That same button further down my page directs to myhomepage/ ?post_type=acf-field&p=20 instead of the booking page.
Literally any help whatsoever with this would be greatly appreciated. It's fun looking around and learning a lot, but I really need my website to work as soon as possible. Thank you again.
The code I THINK might be part of the problem:
<form action="<?php echo get_permalink( 20 ); ?>" method="get">
<select name="service_id" data-custom-class="select-bedrooms">
<option value="" disabled selected><?php _e( 'Bedrooms', 'themestreet' ); ?></option>
<?php if ( have_rows( 'bedroom_list','option' ) ) : $i = 1; ?>
<?php while ( have_rows( 'bedroom_list','option' ) ) : the_row();
// vars
$value = get_sub_field( 'value' );
$title = get_sub_field( 'title' );
?><option value="<?php echo $value; ?>"><?php echo $title; ?></option>
<?php $i++; ?>
<?php endwhile; ?>
<?php else: ?>
<option value="" disabled selected><?php _e( 'Bedrooms', 'themestreet' ); ?></option>
<option value="1"><?php _e('One Bedroom','themestreet'); ?></option>
<option value="2"><?php _e('Two Bedrooms','themestreet'); ?></option>
<option value="3"><?php _e('Three Bedrooms','themestreet'); ?></option>
<option value="4"><?php _e('Four Bedrooms','themestreet'); ?></option>
<option value="5"><?php _e('Five Bedrooms','themestreet'); ?></option>
<option value="6"><?php _e('Six Bedrooms','themestreet'); ?></option>
<?php endif; ?>
</select>
<select name="pricing_param_quantity" data-custom-class="select-bathrooms">
<option value="" disabled selected><?php _e( 'Bathrooms', 'themestreet' ); ?></option>
<?php if ( have_rows( 'bathroom_list','option' ) ) : $i = 1; ?>
<?php while ( have_rows( 'bathroom_list','option' ) ) : the_row();
// vars
$value = get_sub_field( 'value' );
$title = get_sub_field( 'title' );
?><option value="<?php echo $value; ?>"><?php echo $title; ?></option>
<?php $i++; ?>
<?php endwhile; ?>
<?php else: ?>
<option value="" disabled selected><?php _e( 'Bathrooms', 'themestreet' ); ?></option>
<option value="1"><?php _e('1 Bathroom','themestreet'); ?></option>
<option value="2"><?php _e('2 Bathrooms','themestreet'); ?></option>
<option value="3"><?php _e('3 Bathrooms','themestreet'); ?></option>
<option value="4"><?php _e('4 Bathrooms','themestreet'); ?></option>
<option value="5"><?php _e('5 Bathrooms','themestreet'); ?></option>
<option value="6"><?php _e('6 Bathrooms','themestreet'); ?></option>
<?php endif; ?>
</select>
<button class="btn btn--primary"><?php _e( 'BOOK A CLEANING NOW', 'themestreet' ); ?></button>
</form>
I am currently setting up a WordPress website and everything is going fine except for one issue I simply can't figure out.
So basically I have a booking form on my website that allows people to select a couple values (number of bedrooms and bathrooms) and then when they click the button those values are amended to the booking-page URL and loaded.
The problem I'm running into is that the code is being amended to the end of my current (home) page and thus not having any effect/ just reloading the page.
After hours of looking around/ troubleshooting, and guessing I believe the code of interest is as follows from the theme I have installed. Would it be an issue of permalink (20) not existing and thus just returning the current page? If so that's odd since this theme is supposed to be ready to go right from install.
That same button further down my page directs to myhomepage/ ?post_type=acf-field&p=20 instead of the booking page.
Literally any help whatsoever with this would be greatly appreciated. It's fun looking around and learning a lot, but I really need my website to work as soon as possible. Thank you again.
The code I THINK might be part of the problem:
<form action="<?php echo get_permalink( 20 ); ?>" method="get">
<select name="service_id" data-custom-class="select-bedrooms">
<option value="" disabled selected><?php _e( 'Bedrooms', 'themestreet' ); ?></option>
<?php if ( have_rows( 'bedroom_list','option' ) ) : $i = 1; ?>
<?php while ( have_rows( 'bedroom_list','option' ) ) : the_row();
// vars
$value = get_sub_field( 'value' );
$title = get_sub_field( 'title' );
?><option value="<?php echo $value; ?>"><?php echo $title; ?></option>
<?php $i++; ?>
<?php endwhile; ?>
<?php else: ?>
<option value="" disabled selected><?php _e( 'Bedrooms', 'themestreet' ); ?></option>
<option value="1"><?php _e('One Bedroom','themestreet'); ?></option>
<option value="2"><?php _e('Two Bedrooms','themestreet'); ?></option>
<option value="3"><?php _e('Three Bedrooms','themestreet'); ?></option>
<option value="4"><?php _e('Four Bedrooms','themestreet'); ?></option>
<option value="5"><?php _e('Five Bedrooms','themestreet'); ?></option>
<option value="6"><?php _e('Six Bedrooms','themestreet'); ?></option>
<?php endif; ?>
</select>
<select name="pricing_param_quantity" data-custom-class="select-bathrooms">
<option value="" disabled selected><?php _e( 'Bathrooms', 'themestreet' ); ?></option>
<?php if ( have_rows( 'bathroom_list','option' ) ) : $i = 1; ?>
<?php while ( have_rows( 'bathroom_list','option' ) ) : the_row();
// vars
$value = get_sub_field( 'value' );
$title = get_sub_field( 'title' );
?><option value="<?php echo $value; ?>"><?php echo $title; ?></option>
<?php $i++; ?>
<?php endwhile; ?>
<?php else: ?>
<option value="" disabled selected><?php _e( 'Bathrooms', 'themestreet' ); ?></option>
<option value="1"><?php _e('1 Bathroom','themestreet'); ?></option>
<option value="2"><?php _e('2 Bathrooms','themestreet'); ?></option>
<option value="3"><?php _e('3 Bathrooms','themestreet'); ?></option>
<option value="4"><?php _e('4 Bathrooms','themestreet'); ?></option>
<option value="5"><?php _e('5 Bathrooms','themestreet'); ?></option>
<option value="6"><?php _e('6 Bathrooms','themestreet'); ?></option>
<?php endif; ?>
</select>
<button class="btn btn--primary"><?php _e( 'BOOK A CLEANING NOW', 'themestreet' ); ?></button>
</form>
Would it be an issue of permalink (20) not existing and thus just returning the current page?
Yes, it seems that is happened now. Try to change the id fo that permalink to your booking page id.
get_permalink( BOOKING_PAGE_ID )
I would approach it this way:
Alternately, you could use a 'form plugin' (there's lots of them) and create the form via that plugin. Although that depends on what you want to happen with the form submittal - most form plugins create a contact-page type of form.
The advantage of this process is that the template will display what you want on the page that uses that template. You can decide what the template displays.
Lots of help in the googles and the WP Codex on how to create a Child Theme, and a Template.
The advantage of the Child Theme is that any changes you make to anything will not be overwritten with a main theme update. The advantage to a template is that you can make the page do what you want.
method="get"
will add all your form values as query strings. – Brian Fegter Commented Feb 4, 2019 at 1:05