I am new to Javascript and jquery.I wish to pass multiple selected values of dropdown from one php page to function of another php page.
In my dropdown I have two buttons.'Set' and 'unset'.Set will insert values into DB and Unset Deleting from DB.
Here is my php:(php1.php)
printf( '<h1>Update Capabilities</h1>' );
printf( '<form action="%s" method="POST" id="capabilityform">', $_SERVER['PHP_SELF'] );
printf( '<span class="subHeading">Capabilities</span>' );
printf('<select name="selectedCapabilities[]" multiple>');
foreach ($capabilityList as $i)
{
printf('<option value="%s">%s</option>', $i, $i);
}
printf( '</select>' );
printf( '<input type="hidden" name="hosts" value="%s"/>', implode( ',', $hosts ) );
printf( '<input id="capabilityHosts" type="hidden" name="sethosts" value="" />' );
printf( '<input id="setCapabilitiesButton" name="setcapabilities" type="summit" value="Set Capabilities" disabled="disabled" />' );
printf( '<input id="unsetCapabilitiesButton" name="unsetcapabilities" type="submit" value="Unset Capabilities" disabled="disabled" />' );
printf( '</form>' );
Another php page has two functions for set and unset.(php2.php)
function setCap($host , $capablities)
{
//....sql query here
}
function unsetCap($host , $capablities)
{
//....sql query here
}
if we press setCapabilities button all selected values will go to setcap() and for same as unsetCapabilities.
Could you please help to pass the selected values to the above functions using JS?
First you have to add class name to select option.
printf( '<h1>Update Capabilities</h1>' );
printf( '<form action="%s" method="POST" id="capabilityform">', $_SERVER['PHP_SELF'] );
printf( '<span class="subHeading">Capabilities</span>' );
printf('<select name="selectedCapabilities[]" class="selectedCapabilities" multiple>');
foreach ($capabilityList as $i)
{
printf('<option value="%s">%s</option>', $i, $i);
}
printf( '</select>' );
printf( '<input type="hidden" name="hosts" value="%s"/>', implode( ',', $hosts ) );
printf( '<input id="capabilityHosts" type="hidden" name="sethosts" value="" />' );
printf( '<input id="setCapabilitiesButton" name="setcapabilities" type="summit" value="Set Capabilities" disabled="disabled" />' );
printf( '<input id="unsetCapabilitiesButton" name="unsetcapabilities" type="submit" value="Unset Capabilities" disabled="disabled" />' );
printf( '</form>' );
and then add this javascript code.
<script type="text/javascript">
$("select.selectedCapabilities").change(function(){
var selectedCapabilities = $(".selectedCapabilities option:selected").val();
//uncomment alert you can check if you getting right data
//alert(selectedCapabilities);
$.ajax({
url: "php2.php",
type: "post",
data: {option: $(this).find("option:selected").val()},
success: function(data){
//this one you need to show some responce from php2 file
$("#getservicesdatas").html(data);
} });
});
</script>
Related
I try to make custom calculator on product page. I made a calculator and script which calculated. But all start values is static now. This calculator should work with custom values each product.
I have a section which I added on product page like a shortcode.
function woo_calculator_content() {
// Калькулятор
echo ('
<section>
<script src="http://door.vel-wild.pro/wp-content/themes/mrDoor/raschet.js"></script>
<form action="" method="post">
<div class="vel_sum input-group">
<span>Сколько нужно м<sup>2</sup></span>
<input type="button" value="-" class="button-minus" data-field="quantity">
<input class="vel_sum_meter" id="skolkometrov" name="QTY" type="number" step="1" min="1" value="1" oncclick="multiply(this)">
<input type="button" value="+" class="button-plus" data-field="quantity">
<input name="PPRICE" value="1.67" style="display: none;">
<div> <span>Колличество упаковок <input name="TOTAL" readonly class="vel_sum_upakovka"></span>
<span><input class="vel_sum_upakovkametrov" name="TOTALMETERS" readonly>м<sup>2</sup></span></div>
</div>
</form>
</section>');
}
add_shortcode( '4cards', 'woo_calculator_content' );
But now I need get value from my custom fild and add this on input name="PPRICE" value.
Something like this
The code my custom fild is:
// Display Fields
add_action( 'woocommerce_product_options_general_product_data', __NAMESPACE__.'\woo_add_custom_general_fields' );
function woo_add_custom_general_fields() {
global $woocommerce, $post;
echo '<div class="options_group">';
// Number Field
woocommerce_wp_text_input(
array(
'id' => '_number_field',
'label' => __( 'м<sup>2</sup> в упаковке', 'woocommerce' ),
'placeholder' => '',
'description' => __( 'Enter the custom value here.', 'woocommerce' ),
'type' => 'number',
'custom_attributes' => array(
'step' => 'any',
'min' => '0'
)
)
);
?>
<?php
echo '</div>';
}
// Save Fields
add_action( 'woocommerce_process_product_meta', __NAMESPACE__.'woo_add_custom_general_fields_save' );
function woo_add_custom_general_fields_save( $post_id ){
// Number Field
$woocommerce_number_field = $_POST['_number_field'];
if( !empty( $woocommerce_number_field ) )
update_post_meta( $post_id, '_number_field', esc_attr( $woocommerce_number_field ) );
}
// Вывод описания сколько в упаковке
add_action( 'woocommerce_before_add_to_cart_form', 'production_time', 11 );
function production_time() {
global $product;
$woocommerce_number_field =$product->get_meta('_number_field');
if( has_term( ['laminat'], 'product_cat' ) ) {
echo '<div class="vel_costpack_hide"><p class="ri ri-clock">' . sprintf( __( ' Товар продается упаковками. В упаковке: %s', 'woocommerce' ), $woocommerce_number_field, __( 'м<sup>2</sup>', 'woocommerce' )) . '</p></div>';
}
}
To get a product custom field from a product Id (so the product Id is required) use Wordpress get_post_meta() with the right meta key.
Simply replace in your first function the line:
<input name="PPRICE" value="1.67" style="display: none;">
with this code line for example:
<input name="PPRICE" value="1.67 (' . get_post_meta( get_the_id(), '_number_field', true) . ' м<sup>2</sup> в упаковке)" style="display: none;">
The WooCommerce way (Since WooCommerce 3)
You can also use The WC_Data method get_meta() on the WC_Product Object instance like:
global $product;
if ( ! is_a( $product, 'WC_Product' ) ) {
$product = wc_get_product( get_the_id() );
}
$value_number_field = $product->get_meta('_number_field'); // Get custom field value
echo $value_number_field; // Display it
I'm trying to create a food delivery web page with the wordpress restropress plugin,
the page looks like this: https://restropress.magnigenie.com/demo/food-items/
And the problem I have is that in the checkout form I want to remove the city field
since being a delivery I obviously only make deliveries in my city
and I don't want my customers to go through that redundancy.
I would also like to change the postcode field from text to a drop-down.
I have tried with some action hooks setting as "unset" the field "city" but nothing.
In the html of the page I managed to make the changes directly
but when I updated the plug-in changes were lost.
Can you help me? This is the plugins code that I'm trying to modify:
<fieldset id="rpress_checkout_order_details">
<legend><?php echo apply_filters( 'rpress_checkout_order_details_text', esc_html__( 'Order Details', 'restropress' ) ); ?></legend>
<?php do_action( 'rpress_purchase_form_before_order_details' ); ?>
<?php
if( rpress_selected_service() == 'delivery' ) :
$customer = RPRESS()->session->get( 'customer' );
$customer = wp_parse_args( $customer, array( 'delivery_address' => array(
'address' => '',
'flat' => '',
'city' => '',
'postcode' => '',
) ) );
$customer['delivery_address'] = array_map( 'sanitize_text_field', $customer['delivery_address'] );
if( is_user_logged_in() ) {
$user_address = get_user_meta( get_current_user_id(), '_rpress_user_delivery_address', true );
foreach( $customer['delivery_address'] as $key => $field ) {
if ( empty( $field ) && ! empty( $user_address[ $key ] ) ) {
$customer['delivery_address'][ $key ] = $user_address[ $key ];
} else {
$customer['delivery_address'][ $key ] = '';
}
}
}
$customer['delivery_address'] = apply_filters( 'rpress_delivery_address', $customer['delivery_address'] );
?>
<p id="rpress-street-address" class="rp-col-md-6 rp-col-sm-12">
<label class="rpress-street-address" for="rpress-street-address">
<?php esc_html_e('Street Address', 'restropress') ?>
<span class="rpress-required-indicator">*</span>
</label>
<input class="rpress-input" type="text" name="rpress_street_address" id="rpress-street-address" placeholder="<?php esc_html_e('Street Address', 'restropress'); ?>" value="<?php echo $customer['delivery_address']['address']; ?>" />
</p>
<p id="rpress-apt-suite" class="rp-col-md-6 rp-col-sm-12">
<label class="rpress-apt-suite" for="rpress-apt-suite">
<?php esc_html_e('Apartment, suite, unit etc. (optional)', 'restropress'); ?>
</label>
<input class="rpress-input" type="text" name="rpress_apt_suite" id="rpress-apt-suite" placeholder="<?php esc_html_e('Apartment, suite, unit etc. (optional)', 'restropress'); ?>" value="<?php echo $customer['delivery_address']['flat']; ?>" />
</p>
<p id="rpress-city" class="rp-col-md-6 rp-col-sm-12">
<label class="rpress-city" for="rpress-city">
<?php _e('Town / City', 'restropress') ?>
<span class="rpress-required-indicator">*</span>
</label>
<input class="rpress-input" type="text" name="rpress_city" id="rpress-city" placeholder="<?php _e('Town / City', 'restropress') ?>" value="<?php echo $customer['delivery_address']['city']; ?>" />
</p>
<p id="rpress-postcode" class="rp-col-md-6 rp-col-sm-12">
<label class="rpress-postcode" for="rpress-postcode">
<?php _e('Postcode / ZIP', 'restropress') ?>
<span class="rpress-required-indicator">*</span>
</label>
<input class="rpress-input" type="text" name="rpress_postcode" id="rpress-postcode" placeholder="<?php _e('Postcode / ZIP', 'restropress') ?>" value="<?php echo $customer['delivery_address']['postcode']; ?>" />
</p>
<?php endif; ?>
<p id="rpress-order-note" class="rp-col-sm-12">
<label class="rpress-order-note" for="rpress-order-note"><?php echo sprintf( __('%s Instructions', 'restropress'), rpress_selected_service( 'label' ) ); ?></label>
<textarea name="rpress_order_note" class="rpress-input" rows="5" cols="8" placeholder="<?php echo sprintf( __('Add %s instructions (optional)', 'restropress'), strtolower( rpress_selected_service( 'label' ) ) ); ?>"></textarea>
</p>
<?php do_action( 'rpress_purchase_form_order_details' ); ?>
<?php do_action( 'rpress_purchase_form_order_details_fields' ); ?>
</fieldset>
I put this following hook in the functions.php file and it didn't work:
function wp_edit_checkout_fields($fields){
unset($fields['delivery_adress']['city']);
return $fields;
}
add_filter('rpress_purchase_form_order_details_fields', 'wp_edit_checkout_fields');
Note that, there is do_action( 'rpress_purchase_form_order_details_fields' ); in the plugin code. It is usually used with add_action, but not with add_filter.
Maybe you could take advantage of this filter call:
$customer['delivery_address'] = apply_filters( 'rpress_delivery_address', $customer['delivery_address'] );
Try something like this (put in your function.php file):
function your_custom_function($delivery_address) {
// Try to somehow process the city field here...
// First, you could output a variable
// to understand the data structure
print_r($delivery_address);
// and return the changed address
return $delivery_address;
}
add_filter( 'rpress_delivery_address', 'your_custom_function' );
Docs - https://developer.wordpress.org/reference/functions/add_filter/
I have implemented a short code to display the product search form in the page built using Visual Composer.
add_shortcode( 'sagar-custom-search', 'sagar_custom_search' );
function sagar_custom_search() {
$form = '<form role="search" method="get" id="searchform" action="' . esc_url( home_url( '/' ) ) . ' ">';
$form .= '<div>';
$form .= '<label class="screen-reader-text" for="s">' . __( 'Search for:', 'woocommerce' ) . '</label>';
$form .= '<input type="text" value="' . get_search_query() . '" name="s" id="s" placeholder="' . __( 'My Search form', 'woocommerce' ) . '" />';
$form .= '<input type="submit" id="searchsubmit" value="'. esc_attr__( 'Search', 'woocommerce' ) .'" />';
$form .= '<input type="hidden" name="post_type" value="product" />';
$form .= '</div>';
$form .= '</form>';
echo $form;
echo "sagar tamang";
}
The form can be seen using inspect but it is not being rendered. Can anybody help figure it out.
I have multiple input fields and random input names, what I want to achieve is get the data entered in the text fields but then on clicking on the submit button, the data entered will remain.
Sample code:
for($i=0;$i<$count1;$i++) {
echo '<input type="text" name="'.$random1.'" value=""/>';
}
for($j=0;$j<$count2;$j++) {
echo '<input type="text" name="'.$random2.'" value=""/>';
}
for($k=0;$k<$count3;$k++) {
echo '<input type="text" name="'.$random3.'" value=""/>';
}
echo '<input type="submit" name="submit" value="submit"/>'
The problem here is that I don't know what are the 'input names'. I want the values entered by user into this text fields remain. How would I do that? If you don't know what the 'input names' are?
Can you use hidden inputs to keep tracks of the names? Like this:
for($i=0;$i<$count1;$i++) {
$value=getValueFor("section1-$i");
echo '<input type="text" name="'.$random1.'" value="'.$value.'"/>';
echo '<input type="hidden" name="section1-'.$i.'" value="'.$random1.'"/>';
}
for($j=0;$j<$count2;$j++) {
$value=getValueFor("section2-$j");
echo '<input type="text" name="'.$random2.'" value="'.$value.'"/>';
echo '<input type="hidden" name="section2-'.$j.'" value="'.$random2.'"/>';
}
for($k=0;$k<$count3;$k++) {
$value=getValueFor("section3-$k");
echo '<input type="text" name="'.$random3.'" value="'.$value.'"/>';
echo '<input type="hidden" name="section3-'.$k.'" value="'.$random3.'"/>';
}
where getValueFor should be a function which checks what you got from GET or POST. For example:
function getValueFor($x){
$res = "";
if (isset($_REQUEST[$x])){
$name=$_REQUEST[$x];
$res = $_REQUEST[$name];
}
return res;
}
That should work :
if (isset($_POST['random'])) {
foreach ($_POST['random'] as $key => $randomName) {
${"random" . $key . "value"} = $randomName;
}
}
for($i=0;$i<$count1;$i++) {
echo '<input type="text" name="'.$random1.'" value="'.$random1value.'"/>';
echo '<input type="hidden" name="random[]" value="'.$random1.'"/>';
}
for($j=0;$j<$count2;$j++) {
echo '<input type="text" name="'.$random2.'" value="'.$random2value.'"/>';
echo '<input type="hidden" name="random[]" value="'.$random2.'"/>';
}
for($k=0;$k<$count3;$k++) {
echo '<input type="text" name="'.$random3.'" value="'·$random3value.'"/>';
echo '<input type="hidden" name="random[]" value="'.$random3.'"/>';
}
echo '<input type="submit" name="submit" value="submit"/>'`enter code here`;
}
HI i got a little Problem i have whish list script which adds artivcles from shop into a session and saves them but when i click on the which list he only adds the first item how to male it dynamic that every wish list click is for the individual item in the shop
my article structure, onclick of wlbutton1 or wlbutton2 he should add the article with id1 or 2 to the wishlist:
echo '<div class="span3 filter--'.$obj->product_prop1.'" data-price="'.substr($obj->price, 0, -3) . '" data-popularity="3" data-size="s|m|xl" data-color="pink|orange" data-brand="'.$obj->product_brand.'">';
echo '<div class="product">';
echo '<div class="product-img featured">';
echo '<form method="post" action="../cart_update.php">';
echo '<div class="picture"><img src="images/'.$obj->product_img_name.'">';
echo '<div class="img-overlay"><button class="add_to_cart btn more btn-primary">Kaufen</button>...mehr</div>';
echo '</div>';
echo '</div>';
echo '<div id="result"></div>';
echo '<div class="main-titles"><h4 class="title">'.$currency.$obj->price.'</h4>';
echo '<h5 class="no-margin isotope--title" id="product'.$obj->id.'">'.$obj->product_name.'</h5>';
echo '<p class="no-margin pacifico" style="position: absolute;right: 10px;top: 5px; text-transform: capitalize;">'.$obj->product_brand.'</p>';
echo '<p class="no-margin" style="position: absolute;right: 10px;top: 25px;"><a class="wl-button'.$obj->id.'"><i class="icon-gift"></i></a></p>';
echo '</div>';
echo '<p class="desc">'.substr($obj->product_desc, 0, 160) . '...</p>';
echo '<input type="hidden" name="product_qty" value="1" />';
echo '<input type="hidden" name="product_code" value="'.$obj->product_code.'" />';
echo '<input type="hidden" name="type" value="add" />';
echo '<input type="hidden" name="return_url" value="'.$current_url.'" />';
echo '</form>';
echo '</div>';
echo '</div>';
My Jquery Code how to make it dynamic and individual for eacht artivle?:
$(".wl-button").click(function() {
var wlproduct = $('#product').text();
var wlproducturl = $('#producturl').attr('href');
$.ajax({
type : "POST",
url : "../assets/wlscript.php",
data : { wlproduct : wlproduct, wlproducturl : wlproducturl },
success : function(data) {
$('div#result').text('You added '+wlproducturl+' '+wlproduct+'\'s to your wishlist.');
}
});
});
Here an example of how you can do to find the data you need to add your article.
First the HTML example :
<div class="products">
<form>
<p>
<!-- Fist article -->
<span>Article 1</span>
<!-- A name construct so that I can easilly find in which iteration of the loop I am -->
<input type="hidden" name="article[0].id" value="1" />
<input type="hidden" name="article[0].name" value="article1" />
<button class="addButton">Add article</button>
</p>
<p>
<!-- Second article -->
<span>Article 2</span>
<input type="hidden" name="article[1].id" value="2" />
<input type="hidden" name="article[1].name" value="article2" />
<button class="addButton">Add article</button>
</p>
<!-- … others articles -->
</form>
</div>
And the Javascript part :
$(document).ready(function(){
$(".addButton").on("click", function(event){
event.preventDefault();
var button = $(this);
var parent = button.parent(); // We need to find the container in which to seach our fields.
var idArticle = parent.find("input[name$='.id']").val(); // Find the ID
var nameArticle = parent.find("input[name$='.name']").val(); // Find ather data
alert("Add article with id = " + idArticle + " and name = " + nameArticle);
// Next step is the ajax method to call the server with the correct data.
});
});
By working like that, you can then send to your server the data you need to add an article to your wishlist.
Here the link to the JS Fiddle example.
In this example, you can see how to work around the HTML content from the button to find the inputs.
You can find more about "tree traversal" with the jQuery API.