I added two extra form elements (radio buttons) within the form of single-product/add-to-cart/variable.php. Now quantity field doesn't work: if I pick "5" for instance, click Add-to-Cart button and visit my Cart, only 1 item was added instead of 5. If I remove my extra elements, it works again. Any suggestion as to what's going on?
I added my form elements right after do_action( 'woocommerce_after_single_variation' ); :
<?php do_action( 'woocommerce_after_single_variation' ); ?>
<div class="auto_replenish_wrap">
<div class="auto_replenish_option">
<input type="radio" name="auto_replenish" value="auto_replenish_no" checked="checked">
<label for="auto_replenish_no">
Deliver one-time only
</label>
</div>
<div class="auto_replenish_option">
<input type="radio" name="auto_replenish" value="auto_replenish_yes">
<label for="auto_replenish_yes">
<div class="auto_replenish_yes_label">
Auto-replenish <a href='#'>(See details)</a>
</div>
<div class="auto_replenish_yes_label_frequency">
<span class="delivery_frequency">
Deliver every
<input type="button" class="minus" value="-">
<input type="text" size="4" class="input-text qty text" title="Qty" value="1" name="quantity" step="1" pattern="[0-9]*" id="delivery_frequency_value" min="1">
<input type="button" class="plus" value="+">
month(s)
</span>
</div>
</label>
</div>
</div>
<div class="add_to_cart_and_learn_more">
<a class="learn_more_after_add_to_cart_button" href="<?php the_permalink(); ?>">Learn More</a>
</div>
Related
Hi guys please help me out, I have this php code where I get data from the database and displays on the web and if you check the input hidden tag below I gave it a value but instead not all the values are displaying properly in it. Instead it's creating an attribute.
PHP CODE
<?php
$output = '';
$sqlNO = "SELECT * FROM pnewoffer";
$NOresult = mysqli_query($conn, $sqlNO);
if(mysqli_num_rows($NOresult) > 0) {
while($row = mysqli_fetch_array($NOresult)) {
$output .= '<div class="offer-card">
<form action="./bked/savedit.php" method="post">
<a href="#" class="offer-card-inner">
<div class="offer-img">
<img src="./image/'.$row['offerPImage'].'" alt="New Offer Image" width="200">
</div>
<div class="offer-info">
<h3 class="offer-title">'.$row['offerPName'].'</h3>
<div class="clearfix rating marT8 ">
<div class="rating-stars ">
<div class="grey-stars"></div>
<div class="filled-stars" style="width:60.0%"></div>
</div>
</div>
<h4 class="offer-product-price">N'.$row['offerPPrice'].' </h4>
</div>
</a>
<input type="hidden" name="newPPrice" value='.$row['offerPPrice'].'>
<input type="hidden" name="newPName" value='.$row['offerPName'].'>
<input type="hidden" name="newPImg" value='.$row['offerPImage'].'>
<div class="offer-bt-btn">
<div class="offer-btn">
<button type="submit" name="saveForLater" class="favorite-offer-btn">
<i class="far fa-heart"></i>
</button>
<a href="#" class="offer-product-info-btn">
<i class="fa fa-info"></i>
</a>
</div>
</div>
</form>
</div>';
}
}
echo $output;
?>
RESULT
<input type="hidden" name="newPName" value="Blue" louis="" vuitton="" women="" bag="">
<input type="hidden" name="newPName" value="Samsung" galaxy="" s9="" 6gb="" ram,="" 32gb="" rom,="" 16mpbs="">
its actually supposed to be
<input type="hidden" name="newPName" value="Samsung Galaxy S9 6gb ram, 32gb rom, 16mpbs">
<input type="hidden" name="newPName" value="Blue Louis Vuitton Women Bag">
Please, how do I go about it?
If any of the value contain ' characters, that will end the value attribute and start a new attribute. Use htmlspecialchars() to encode it and prevent this.
<input type="hidden" name="newPPrice" value='.htmlspecialchars($row['offerPPrice'], ENT_QUOTES).'>
<input type="hidden" name="newPName" value='.htmlspecialchars($row['offerPName'], ENT_QUOTES).'>
<input type="hidden" name="newPImg" value='.htmlspecialchars($row['offerPImage'], ENT_QUOTES).'>
i have a foreach row that displays the "message icon" (i dont think it has anything to do with the form since the form is outside the loop:
enter image description here
which displays a chat form that you can either type a chat or send an attachment:
enter image description here
How can i make one of them required before submission? I tried through multiple JQuery ways but because they are in a for loop and each of them do not have a special id, its not working. any help please? I just need it to show an alert
Here is my code for the form:
<form method="post"action="<?php echo base_url();?>form_support_chat" enctype="multipart/form-data" class="ticket-reply-form">
<div class="row">
<div class="col-xs-12">
<div class="chat-left">
<input type="text" name="message" placeholder="Type Message ..." class="form-control" autocomplete="off">
<input type="hidden" name="cst_id" value="<?php echo $cst_id; ?>">
<input type="hidden" name="arch_ticket" value="<?php echo $arch_ticket; ?>">
<input type="hidden" name="ticket_number" value="<?php echo $ticket_number?>">
</div>
<div class="chat-right">
<label>
<img src="<?php echo base_url();?>/assest/icon-img/paperclip.png" class="ic_img" >
<input type="file" name="file" class="form-control" style="display:none;" id="hidden_upload_file_chatting">
</label>
<button type="submit" class="btn btn-flat" name="reply" value="reply" >Reply</button>
<button type="button" class="btn btn-flat" data-dismiss="modal" style="margin-left: 10px !important;">Close</button>
<span id="_showName"></span>
</div>
</div>
</div>
</form>
Simply use html5's required value
<input name="cst_id" value="<?php echo $cst_id; ?>" required>
or
<input name="cst_id" value="<?php echo $cst_id; ?>" required="true">
update
Using jQuery, add id value to each input
$(document).ready(function() {
if( $('#input1').valid() || $('#input2').valid(); ):
console.log("Success");
endif;
});
Im trying to get a minimum form value for my Php wordpress form. I want to make that the value is always more than 6. So the visitor have to selected a value above 6 and not below 6. Hope you can help, this is my code so far.
<div class="quantity fl-wrap clearfix">
<span><i class="fa fa-clock-o"></i><?php esc_html_e( 'Maanden: ', 'citybook-add-ons' ); ?></span>
<div class="quantity-item" data-min="1">
<input type="button" value="-" class="minus">
<input type="text" name="lb_quantity" value="6" class="qty" size="4" required="required">
<input type="button" value="+" class="plus">
</div>
</div>
I am not sure what Wordpress plugin your using.
but try changing following line:
<div class="quantity-item" data-min="1">
to:
<div class="quantity-item" data-min="6">
In my WordPress website, I added a custom widget with help of this plugin: https://wordpress.org/plugins/custom-post-type-widgets/
I want to show that widget on my archive page with PHP.
I went to https://codex.wordpress.org/Function_Reference/the_widge but didn't get what I use to make that widget appear in website. I still do not understand how to use it or what name, class, etc. I should use in website to make it appear.
It's created by an option in theme so not getting how to get it's class or ID
but in Appearance->widget code is listed below.
<div class="widgets-holder-wrap closed">
<div id="sidebar-18" class="widgets-sortables"> <div class="sidebar-name">
<div class="sidebar-name-arrow"><br /></div>
<h2>Custom Post Type - course <span class="spinner"></span></h2>
</div>
<div class="sidebar-description">
<p class="description">course</p>
</div>
<div id='widget-61_custom-post-type-categories-4' class='widget'> <div class="widget-top">
<div class="widget-title-action">
<button type="button" class="widget-action hide-if-no-js" aria-expanded="false">
<span class="screen-reader-text">Edit widget: Categories (Custom Post Type)</span>
<span class="toggle-indicator" aria-hidden="true"></span>
</button>
<a class="widget-control-edit hide-if-js" href="/wp-admin/widgets.php?editwidget=custom-post-type-categories-4&sidebar=sidebar-18&key=0">
<span class="edit">Edit</span>
<span class="add">Add</span>
<span class="screen-reader-text">Categories (Custom Post Type)</span>
</a>
</div>
<div class="widget-title"><h3>Categories (Custom Post Type)<span class="in-widget-title"></span></h3></div>
</div>
<div class="widget-inside">
<form method="post"> <div class="widget-content"> <p><label for="widget-custom-post-type-categories-4-title">Title:</label>
<input class="widefat" id="widget-custom-post-type-categories-4-title" name="widget-custom-post-type-categories[4][title]" type="text" value="asdf" /></p>
<p><label for="widget-custom-post-type-categories-4-taxonomy">Taxonomy:</label><select class="widefat" id="widget-custom-post-type-categories-4-taxonomy" name="widget-custom-post-type-categories[4][taxonomy]"><option value="category">Categories category</option><option value="employees_category">Employees Categories employees_category</option><option value="faq_category">Faq Categories faq_category</option><option value="news_category">News Categories news_category</option><option value="portfolio_category">Portfolio Categories portfolio_category</option><option value="testimonial_category">Testimonial Categories testimonial_category</option><option value="photo_album_category">Photo Album Categories photo_album_category</option><option value="wp_cc_tax_country">Country wp_cc_tax_country</option><option value="course-category" selected='selected'>Course Categories course-category</option><option value="expert-field">Expert fields expert-field</option><option value="internship-category">Internship Categories internship-category</option><option value="country-cost">Countries for Cost country-cost</option><option value="application-basket">Applications Baskets application-basket</option><option value="scholarship-category">Scholarship categories scholarship-category</option><option value="entry-requirement">Entry Requirements entry-requirement</option><option value="awarding-level">Awarding levels awarding-level</option><option value="intake">Intakes intake</option><option value="study-mode">Study Modes study-mode</option><option value="status">Statuses status</option><option value="course-keyword-taxonomy">Course Keywords course-keyword-taxonomy</option></select></p>
<p><input type="checkbox" class="checkbox" id="widget-custom-post-type-categories-4-dropdown" name="widget-custom-post-type-categories[4][dropdown]" />
<label for="widget-custom-post-type-categories-4-dropdown">Display as dropdown</label><br />
<input type="checkbox" class="checkbox" id="widget-custom-post-type-categories-4-count" name="widget-custom-post-type-categories[4][count]" checked='checked' />
<label for="widget-custom-post-type-categories-4-count">Show post counts</label><br />
<input type="checkbox" class="checkbox" id="widget-custom-post-type-categories-4-hierarchical" name="widget-custom-post-type-categories[4][hierarchical]" checked='checked' />
<label for="widget-custom-post-type-categories-4-hierarchical">Show hierarchy</label></p>
</div> <input type="hidden" name="widget-id" class="widget-id" value="custom-post-type-categories-4" />
<input type="hidden" name="id_base" class="id_base" value="custom-post-type-categories" />
<input type="hidden" name="widget-width" class="widget-width" value="250" />
<input type="hidden" name="widget-height" class="widget-height" value="200" />
<input type="hidden" name="widget_number" class="widget_number" value="4" />
<input type="hidden" name="multi_number" class="multi_number" value="" />
<input type="hidden" name="add_new" class="add_new" value="" />
<div class="widget-control-actions">
<div class="alignleft">
<button type="button" class="button-link button-link-delete widget-control-remove">Delete</button> |
<button type="button" class="button-link widget-control-close">Close</button>
</div>
<div class="alignright">
<input type="submit" name="savewidget" id="widget-custom-post-type-categories-4-savewidget" class="button button-primary widget-control-save right" value="Save" /> <span class="spinner"></span>
</div>
<br class="clear" />
</div>
</form> </div>
I'm using PHP, Smarty and jQuery for my website. There is a functionality of showing and hiding an element on a form. The HTML as well as code from jQuery function is as below:
HTML Code:
<div class="c-mega-accord">
<ol class="fnAccordion">
<li>
<a class="fnTrigger" href="#">Practice Sheet Basic Details <span></span></a>
<div class="fnAccContent">
<div class="c-grad-box">
<div class="form-wrapper">
{if $error_msg}<div class="error-info">{$error_msg.error_msgs}</div>{/if}
<form name="manage_practice_sheet" id="manage_practice_sheet" action="practice_sheet.php" method="post">
<input type="hidden" name="op" id="op" value="{$op}" />
<input type="hidden" name="sheet_type" id="sheet_type" value="{$sheet_type}" />
<input type="hidden" name="form_submitted" id="form_submitted" value="yes" />
<input type="hidden" name="practice_sheet_id" id="practice_sheet_id" value="{$practice_sheet_id}" />
<input type="hidden" name="hidden_practice_sheet_category_id" id="hidden_practice_sheet_category_id" value="{$practice_sheet_category_id}" />
<input type="hidden" name="practice_sheet_id" id="practice_sheet_id" value="{$practice_sheet_id}" />
<p class="form-info fl-right">* Mandatory fields</p>
<ul>
<li>
<label>{'Category'|signal_on_error:$error_msg:'practice_sheet_category_id'}<span class="reqd">*</span></label>
<div class="form-element">
<select name="practice_sheet_category_id" id="practice_sheet_category_id" <!--onChange="get_subcategory_by_category('{$control_url}modules/category/manage_category.php', this.value, 'get_subcategory_by_category', '#practice_sheet_sub_category_id');"--> >
<option value="">Select</option>
{if $all_parent_categories}
{foreach from=$all_parent_categories item="parent_category"}
<option value="{$parent_category.category_id}" {if $data.practice_sheet_category_id==$parent_category.category_id || $practice_sheet_category_id==$parent_category.category_id} selected="selected"{/if}>{$parent_category.category_name}</option>
{/foreach}
{/if}
</select>
</div>
</li>
<li>
<label>{'Practice Sheet Name'|signal_on_error:$error_msg:'practice_sheet_name'}<span class="reqd">*</span></label>
<div class="form-element">
<input class="" type="text" name="practice_sheet_name" id="practice_sheet_name" value="{$data.practice_sheet_name}" maxlength="50">
</div>
</li>
<li>
<label>Display Date</label>
<div class="form-element">
<input type="text" class="cal fl-left" id="frmDate" name="frmDate" value="{if $data.practice_sheet_display_date !='0' && $data.practice_sheet_display_date !=''}{$data.practice_sheet_display_date}{/if}">
</div>
</li>
<li>
<label>Practice Sheet For</label>
<div class="form-element">
<input class="" type="text" name="practice_sheet_for" id="practice_sheet_for" value="{$data.practice_sheet_for}" maxlength="50">
</div>
</li>
<li>
<label></label>
<div class="form-element">
<!--<input type="submit" value="{$submit_value}" class="c-btn" id="saveAddMore" name="submit">
<input type="button" value="{$cancel_value}" class="c-gray-btn" id="done" name="done" onclick="javascript:window.location.href='{$control_url}modules/practice_sheet/practice_sheet.php?op={$query_string}'"><br/>-->
<span class="c-btn c-continus-btn"><input type="button" name="continus" id="continus" value="Continue" id="" name=""></span>
<span class="c-gray-btn c-cancel-btn"><input type="button" value="Cancel" id="" name=""></span>
</div>
</li>
</ul>
</form>
</div>
</div>
</div>
</li>
<li>
<a class="fnTrigger" href="#">Select Category <span></span></a>
<div class="fnAccContent">
<div class="c-grad-box">
</div>
</div>
</li>
</ol>
</div>
jQUery Code:
function accordion(){
var li = $(".fnAccordion > li");
li.eq(0).addClass("active");
li.children('.fnAccContent').not(':first').hide();
$(".fnAccordion .fnTrigger").click(function(e){
e.preventDefault();
var numLi = $(this).parent('li').siblings();
if(numLi.length > 0){
$(this).parent('li').siblings().removeClass("active");
var curState = $(this).parent().find(".fnAccContent").css("display");
if(curState == "none"){
$(".fnAccContent").slideUp();
$(this).parent().addClass("active");
$(this).parent().find(".fnAccContent").slideDown();
}
}else{
$(this).parent('li').toggleClass("active");
$(this).parent().find(".fnAccContent").slideToggle();
}
})
}
$(document).ready(function(){
accordion();
})
Now the functionality of hide/show is working fine when I click on following two elements:
<a class="fnTrigger" href="#">Practice Sheet Basic Details <span></span></a>
<a class="fnTrigger" href="#">Select Category <span></span></a>
Actually I want to make this functionality work on Continue button(following is the HTML code snippet for it):
<input type="button" name="continus" id="continus" value="Continue" id="" name="">
I tried to make it work on Continue button by applying the class fnTrigger but it didn't work. Can you help me in this regard? Thanks in advance.
If you want the function to be triggered when both the classes are present,
you use
$(".fnAccordion .fnTrigger").click(function(){
//Your code here
});
If you want the function to get triggered when element of either class is clicked, use a "," to separate the classes.
$(".fnAccordion, .fnTrigger").click(function(){
//Your code here
});
Your check only checks for the fnTrigger class INSIDE an element with the class fnAccordion
$(".fnAccordion .fnTrigger").click(function(e){});
Is your button inside the element with the class fnAccordion?