Increment eq(i) setTimeout function jquery - javascript

I have a setTimeout function I am using in a wordpress loop, and for each post I am trying to increment eq(i). For whatever reason so, everything Ive been trying doesnt work. This is my code --
jQuery(document).ready(function() {
var i = this;
var sNum = 0;
var iNum = sNum + 1;
setTimeout(function(i) {
$('.postidf:eq(i) input').val("<?php echo $id; ?>");
}, 500);
});
I basically need it to be +1 for each post on the page --
$( '.postidf:eq(0) input' ).val( "<?php echo $id; ?>" );
$( '.postidf:eq(1) input' ).val( "<?php echo $id; ?>" );
$( '.postidf:eq(2) input' ).val( "<?php echo $id; ?>" );
$( '.postidf:eq(3) input' ).val( "<?php echo $id; ?>" );
etc..

use String concatenation to treat the i as a variable.
$('.postidf:eq(' + i + ') input').val("<?php echo $id; ?>");
or
$('.postidf').eq(i).find("input").val("<?php echo $id; ?>");

If you are in WordPress loop then
<?php
$i = 0;
foreach($all_results as $data) { ?>
$('.postidf:eq(<?php echo $i; ?>) input' ).val( "<?php echo $id; ?>");
<?php $i++; ?>
<?php } ?>
Here $all_results means your all posts in array which you fetch by WP_Query and increment $i by defining it $i = 0.

Related

Avoid loading a script in Woocommerce thank you page

IN Woocommerce, I use Header & Footer plugin to add on body tag a tracking affiliate code for the whole site.
The code is:
<script async src="//go.linkwi.se/delivery/js/tl.js"></script>
<script>
window.lw=window.lw||function(){(lw.q=lw.q||[]).push(arguments)};lw.l=+new Date;
lw("setProgram", "12838");
lw("setDecimal", ".");
</script>
My affiliate partner ask me the code be disabled from woocommerce thank you page (according the image - Line935 to 940).
woocommerce thank you page source code:
I think I need to add_filter action or something to disable it.
Any help will be useful for this.
UPDATE: If I remove the code from Header & Footer plugin is disabled from the whole site.
Instead of using a plugin, use the following to avoid your script to be loaded on thankyou page.
You have 2 choices:
1) On Footer (the best choice, I think):
add_action( 'wp_footer' , 'linkwi_delivery_script' );
function linkwi_delivery_script(){
// Not on thankyou page
if( is_wc_endpoint_url('order-received') ) return;
?>
<script async src="//go.linkwi.se/delivery/js/tl.js"></script>
<script>
window.lw=window.lw||function(){(lw.q=lw.q||[]).push(arguments)};lw.l=+new Date;
lw("setProgram", "12838");
lw("setDecimal", ".");
</script>
<?php
}
2) On Header:
add_action( 'wp_head' , 'linkwi_delivery_script' );
function linkwi_delivery_script(){
// Not on thankyou page
if( is_wc_endpoint_url('order-received') ) return;
?>
<script async src="//go.linkwi.se/delivery/js/tl.js"></script>
<script>
window.lw=window.lw||function(){(lw.q=lw.q||[]).push(arguments)};lw.l=+new Date;
lw("setProgram", "12838");
lw("setDecimal", ".");
</script>
<?php
}
Code goes in function.php file of your active child theme (or active theme). It should works.
So finaly my code in child function.php it look like this.
// Utility function that contain Linkwise Affiliate script
function linkwise_affiliate_scripts( $order_id ){
## --- YOUR SETTINGS START BELOW --- ##
$program_id = '12838'; // <== Your program number
$decimal_sep = '.'; // Decimal separator
$currency = '978'; // For "EUR" => See: https://en.wikipedia.org/wiki/ISO_4217
## --- END SETTINGS --- ##
$order = wc_get_order( $order_id );
$order_status = $order->get_status();
$items_string = array();
$count = 0;
?>
<script async src="//go.linkwi.se/delivery/js/tlwt.js"></script>
<script>
window.lw=window.lw||function(){(lw.q=lw.q||[]).push(arguments)};
lw .l=+new Date;
lw("setProgram", "<?php echo $program_id; ?>");
lw("setDecimal", "<?php echo $decimal_sep; ?>");
</script>
<script>
lw("setCurrency", "<?php echo $currency; ?>"); // Set your currency
<?php
foreach( $order->get_items() as $item ):
$count++;
$item_id = $item->get_id(); // The item ID
// Get an instance of the WC_Product object
$product = $item->get_product();
$product_id = $item->get_product_id(); // Product ID
$price_excl_vat = wc_get_price_excluding_tax( $product ); // Unit price excluding VAT
$item_qty = $item->get_quantity(); // Item quantity
$payout = '1'; // (???)
// The string for the <noscript> at the bottom
$items_string[] = "itemid[$count]=$item_id&itemprice[$count]=$price_excl_vat&itemquantity[$count]=$item_qty&a
mp;itempayout[$count]=$payout";
?>
lw("addItem", {
id: "<?php echo $item_id; // Or can be the product ID (may be) ?>"
,price: "<?php echo $price_excl_vat; ?>"
,quantity: "<?php echo $item_qty; ?>"
,payout: "<?php echo $payout; ?>"
});
<?php
endforeach;
// Set the array of items strings in a unique string
$items_string = implode( '&', $items_string );
?>
// Other items types
<?php
$coupon_discounts = $coupon_discounts_tax = 0;
foreach( $order->get_items('coupon') as $item_coupon ){
$coupon_discounts += $item_coupon->get_discount();
$coupon_discounts_tax += $item_coupon->get_discount_tax();
}
?>
lw("setCoupon", "<?php echo $coupon_discounts; ?>");
lw("thankyou", {
orderid: "<?php echo $order_id; ?>"
,status: "<?php echo $order_status; ?>"
});
</script>
<noscript>
<img
src="//go.linkwi.se/delivery/acl.php?program=<?php echo $program_id; ?>&decimal=<?php echo $decimal_sep; ?>&<?php echo $items_string; ?>&coupon_price=<?php echo $coupon_discounts; ?>&status=<?php echo $order_status; ?>&orderid=<?php echo $order_id; ?>" style="width:0px;height:0px;"/>
</noscript>
<?php echo 'test';
}
add_filter( 'wp_footer', 'wc_linkwise_affiliate_order_received_integration' );
function wc_linkwise_affiliate_order_received_integration() {
if ( ! is_wc_endpoint_url( 'order-received' ) )
return; // Exit
global $wp;
$order_id = absint( $wp->query_vars['order-received'] );
if ( empty($order_id) || $order_id == 0 )
return; // Exit
linkwise_affiliate_scripts( $order_id ); // Run the Linkwise Affiliate
}
add_action( 'wp_footer' , 'linkwi_delivery_script' );
function linkwi_delivery_script(){
// Not on thankyou page
if( is_wc_endpoint_url('order-received') ) return;
?>
<script async src="//go.linkwi.se/delivery/js/tl.js"></script>
<script>
window.lw=window.lw||function(){(lw.q=lw.q||[]).push(arguments)};lw.l=+new Date;
lw("setProgram", "12838");
lw("setDecimal", ".");
</script>
<?php
}

the event of onchange at select control at php, trigger issue

I used this select which show counteries
<section class="shipping-calculator-form-shortcode" >
<p class="form-row form-row-wide" id="calc_shipping_country_field">
<label >Shipping options to</label>
<select onchange="myFunctionShipping(this)" name="calc_shipping_country" id="calc_shipping_country" class="ss-woo-shipping-calculator" rel="ss-woo-shipping-calculator">
<option value="1"><?php _e( 'Select a country…', '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>
<span id="ss-woo-shipping-calculator-loading" style="display:none"><img src='<?php echo plugins_url( '/default.gif', __FILE__ ) ?>' /></span>
</p>
<?php wp_nonce_field( 'woocommerce-cart' ); ?>
<div id="ss-woo-shipping-result">
</div>
</section>
then by javascript code to retrieve the shipping options for it
<script type="text/javascript">
var $s = jQuery.noConflict();
function myFunctionShipping(item) {
$s(document).ready(function($) {
$("select").change(function(){
var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
var country = item.value;
$("#ss-woo-shipping-calculator-loading").show();
var data = {'action': 'ss_woo_shipping_calculator','country': country};
$.post("<?php echo get_home_url(); ?>", data, function(response) {
$("#ss-woo-shipping-calculator-loading").hide();
response = JSON.parse(response);
if(response.result == 1){
$("#ss-woo-shipping-result").html(response.message);
}else{
$("#ss-woo-shipping-result").html("");
}
return false;
});
return false;});
});
}
the problem that:- it trigger if also any other select control changed
also it is only trigger after changing the selection twice (after page loading)
It "says" that action apply to any select $("select").change(). You can change to limit action only to select with chosen id like
$("#calc_shipping_country").change(function()
or you can choose to use select class name.
EDIT.
My mistake, I didnt figure out that the action is called by function and not select action. Try to remove completely the $("select").change(function() wrap and make look something like this
<script type="text/javascript">
var $s = jQuery.noConflict();
function myFunctionShipping(item) {
$s(document).ready(function($) {
var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
var country = item.value;
$("#ss-woo-shipping-calculator-loading").show();
var data = {'action': 'ss_woo_shipping_calculator','country': country};
$.post("<?php echo get_home_url(); ?>", data, function(response) {
$("#ss-woo-shipping-calculator-loading").hide();
response = JSON.parse(response);
if(response.result == 1){
$("#ss-woo-shipping-result").html(response.message);
}else{
$("#ss-woo-shipping-result").html("");
}
return false;
});
return false;
});
}
</script>

Custom taxonomies Dropdown without a Submit Button using JavaScript

I Developing one project and I stuck in small thing which is very small for PHP Expert :D Which i'm not
I'm Trying to make Dropdown list of Custom taxonomies which work on select go to that Custom taxonomies page.
But After lot of search I found Solution But not doing action to go to the selected Custom taxonomies
First I found
<?php wp_dropdown_categories( 'taxonomy=my_custom_taxonomy' ); ?>
Second I found
function fjarrett_custom_taxonomy_dropdown( $taxonomy ) {
$terms = get_terms( $taxonomy );
if ( $terms ) {
printf( '<select name="%s" class="postform">', esc_attr( $taxonomy ) );
foreach ( $terms as $term ) {
printf( '<option value="%s">%s</option>', esc_attr( $term->slug ), esc_html( $term->name ) );
}
print( '</select>' );
}
}
Which I can use when I insert in any page code billow
<?php fjarrett_custom_taxonomy_dropdown( 'my_custom_taxonomy' ); ?>
Credit
https://frankiejarrett.com/2011/09/create-a-dropdown-of-custom-taxonomies-in-wordpress-the-easy-way/
BUT I DON'T KNOW NOW HOW I GONNA MAKE IT WORKING
Hope you can help me to find solution that from above any one solution can I able to make select and go thing.
Thanks in advance
POSSIBLE ANSWER - 1
I Found Possible Answer
<form id="category-select" class="category-select" action="<?php echo esc_url( home_url( '/' ) ); ?>" method="get">
<?php
$args = array(
'show_option_none' => __( 'Select category' ),
'show_count' => 1,
'orderby' => 'name',
'name' => 'cat',
'echo' => 0,
'taxonomy' => 'MyCustomTaxonomys',
'value_field' => 'slug'
);
?>
<?php $select = wp_dropdown_categories( $args ); ?>
<?php $replace = "<select$1 onchange='return this.form.submit()'>"; ?>
<?php $select = preg_replace( '#<select([^>]*)>#', $replace, $select ); ?>
<?php echo $select; ?>
<noscript>
<input type="submit" value="View" />
</noscript>
</form>
It Give me URL
www.website.com/?cat=xxx where xxx is my custom taxonomy
But I Want URL
www.website.com/cat/xxx where xxx is my custom taxonomy
Is it possible?
You
could use something like this :
<?php
function fjarrett_custom_taxonomy_dropdown( $taxonomy ) {
$terms = get_terms( $taxonomy );
if ( $terms ) {
printf( '<select name="%s" class="postform">', esc_attr( $taxonomy ) );
foreach ( $terms as $term ) {
printf( '<option value="%s" data-location="%s">%s</option>', esc_attr( $term->slug ), get_term_link(term_id), esc_html( $term->name ) );
}
print( '</select>' );
}
}
?>
Then use your javascript code to redirect depending on the value of the attribute data-location
I did it this way like you say with PHP with wordpres:
<?php function click_taxonomy_dropdown($taxonomy, $title) { ?>
<select name="<?php echo $taxonomy;?>" id="<?php echo $taxonomy;?>">
<option value="-1"><?php echo $title;?></option>
<?php
$terms = get_terms($taxonomy);
foreach ($terms as $term) {
$link = get_term_link( $term, $taxonomy );
if($term->parent == 0){
printf( '<option class="level-1" value="'.$link.'">%s</option>', $term->name );
}
}
echo '</select>';
?>
<?php } ?>
And then with JS:
var dropdown1=document.getElementById("yourtaxonomy");
function onCatChange1(){
if(dropdown1.options[dropdown1.selectedIndex].value>"")
location.href=dropdown1.options[dropdown1.selectedIndex].value
}
The JS just get the ID of your select and then go to value when options are selected
AT End I Found One Alternate Working Solution Writing here so it will help someone needful
<?php
$categories = get_categories('taxonomy=xxxx');
$select = "<select name='' id='cat' class='postform'>n";
$select.= "<option value='-1'>Select category</option>n";
foreach($categories as $category){
if($category->count > 0){
$select.= "<option value='".$category->slug."'>".$category->name."
</option>";
}
}
$select.= "</select>";
echo $select;
?>
<script type="text/javascript">
<!--
var dropdown = document.getElementById("cat");
function onCatChange() {
if (dropdown.options[dropdown.selectedIndex].value != -1) {
location.href = "<?php echo home_url();?>/yyyy/" + dropdown.options[dropdown.selectedIndex].value + "/";
}
}
dropdown.onchange = onCatChange;
-->
</script>
JUST SET Proper XXXX and YYYY Value and solve.
Credit: John B. Hartley
http://www.johnbhartley.com/2012/custom-taxonomy-category-dropdown/
Again Thank you all for your efforts

Checkbox - Compare Values From Selection

How to compare values and show the output after making the selection on checkbox? I am using jQuery to do it. After selection had been made, it will not show the output. It will just show for first click only. Then, if we click again, the output will not be changed. Below is my code written so far,
jQuery
$("input:checkbox").on('click', function() {
var $box = $(this),
$price = $( "input[name='price_range']:checked").val(),
$nama_pemohon = "<?php echo $nama_pemohon; ?>",
$submited_id = <?php echo $submited_id; ?>,
$jawatan_pemohon = "<?php echo $jawatan_pemohon; ?>",
$jabatan_pemohon = "<?php echo $jabatan_pemohon; ?>",
$submited_by = <?php echo $submited_by; ?>,
$nama = "<?php echo $nama; ?>",
$jawatan = "<?php echo $jawatan; ?>",
$jabatan = "<?php echo $jabatan; ?>";
if($price == "< RM 10,000"){
$("#submited_by option").val($submited_by).text($nama);
$("#jawatan_pemohon").text($jawatan);
$("#jabatan_pemohon").text($jabatan);
} else {
$("#submited_by option").val($submited_id).text($nama_pemohon);
$("#jawatan_pemohon").text($jawatan_pemohon);
$("#jabatan_pemohon").text($jabatan_pemohon);
}
});
HTML
<input type="checkbox" name="price_range" value="< RM 10,000" class="checker"> < RM 10,000.00
<input type="checkbox" name="price_range" value="< RM 200,000" class="checker"> < RM 200,000.00
<select name="submited_by" id="submited_by">
<option value="<?php echo $submited_by; ?>"><?php echo $nama;?></option>
</select>
As you can see in this fiddle, you get change on every click on first checkbox, but only first time on second checkbox.
This is because of your logic in:
if($price == "< RM 10,000"){
$("#submited_by option").val($submited_by).text($nama);
$("#jawatan_pemohon").text($jawatan);
$("#jabatan_pemohon").text($jabatan);
} else {
$("#submited_by option").val($submited_id).text($nama_pemohon);
$("#jawatan_pemohon").text($jawatan_pemohon);
$("#jabatan_pemohon").text($jabatan_pemohon);
}
Example a:
click on first checkbox -> option changes to "nama", because it comes into if.
click on any checkbox -> option changes to "pemohon", because it comes into else.
Example b:
click on second checkbox -> option changes to "pemohon", because it comes into else.
click on second checkbox again -> option doesn't change, because it comes into else again.
I think that you should create a "global" variable outside of your jQuery function.
var clicked = false;
$("input:checkbox").on('click', function() {
if(!clicked) {
var $box = $(this),
$price = $( "input[name='price_range']:checked").val(),
$nama_pemohon = "<?php echo $nama_pemohon; ?>",
$submited_id = <?php echo $submited_id; ?>,
$jawatan_pemohon = "<?php echo $jawatan_pemohon; ?>",
$jabatan_pemohon = "<?php echo $jabatan_pemohon; ?>",
$submited_by = <?php echo $submited_by; ?>,
$nama = "<?php echo $nama; ?>",
$jawatan = "<?php echo $jawatan; ?>",
$jabatan = "<?php echo $jabatan; ?>";
if($price == "< RM 10,000"){
$("#submited_by option").val($submited_by).text($nama);
$("#jawatan_pemohon").text($jawatan);
$("#jabatan_pemohon").text($jabatan);
} else {
$("#submited_by option").val($submited_id).text($nama_pemohon);
$("#jawatan_pemohon").text($jawatan_pemohon);
$("#jabatan_pemohon").text($jabatan_pemohon);
}
clicked = true;
}
});

Javascript/jQuery Loop

I have a bit of jQuery that animates in some text then animates it out. The parameters of the animation are passed via PHP. I need the animation to loop but only after the animation is complete, but can't quite work it out.
<?php if ($text1_1 != "") { ?>
setTimeout(one_1,0); // From 0 to duration
setTimeout(one_2,<?php echo $duration * 2 ?>);
// From duration x2 to duration x3
<?php } ?>
<?php if ($text2_1 != "") { ?>
setTimeout(two_1,<?php echo $duration * 3 ?>); // From duration x3 to duration x4
setTimeout(two_2,<?php echo $duration * 5 ?>); // From duration x5 to duration x6
<?php } ?>
<?php if ($text1_1 != "") { ?>
function one_1() {
$('.text-1_1').animate({ <?php echo $animate1_1 ?>: '<?php echo $text1_1_end ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_2').animate({ <?php echo $animate1_2 ?>: '<?php echo $text1_2_end ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_3').animate({ <?php echo $animate1_3 ?>: '<?php echo $text1_3_end ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_4').animate({ <?php echo $animate1_4 ?>: '<?php echo $text1_4_end ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_5').animate({ <?php echo $animate1_5 ?>: '<?php echo $text1_5_end ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
}
function one_2() {
$('.text-1_1').animate({ <?php echo $animate1_1 ?>: '<?php echo $text1_1_start ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_2').animate({ <?php echo $animate1_2 ?>: '<?php echo $text1_2_start ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_3').animate({ <?php echo $animate1_3 ?>: '<?php echo $text1_3_start ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_4').animate({ <?php echo $animate1_4 ?>: '<?php echo $text1_4_start ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
$('.text-1_5').animate({ <?php echo $animate1_5 ?>: '<?php echo $text1_5_start ?>' }, <?php echo $duration ?>, 'easeInOutCubic');
}
<?php } ?>
How would you get function one_1() & function one_2() to loop after they've finished animating. There is also the possibility that there will be more similar functions.
Very sorry if this is a bit vague! having a bit of trouble explaining it.
Thanks for looking!
You can use the animate finish callback as described here:
http://api.jquery.com/animate/
$(element).animate( { animation params }, duration, function(){
// this is the animation finish callback
});
My suggestion is to use a recursive function, put the animation inside and call it recursively when the animation is finished
You could use something like this as a template. If the durations within each group are not the same, will require considerably more logic to set up and you would likely be best to provide all the animation data as an array, not echo to each animation
function one_1() {
/* use complete callback of one animation to call next function*/
$('.text-1_5').animate({ /* anim*/}, /*duration*/, /* easing*/, function(){
/* this animation is complete, call next function */
two_1();
});
/* other animations for this group*/
}
Maybe the solution is to replace setTimeout with
setInterval(two_1,<?php echo $duration; ?>);
setInterval(two_2,<?php echo $duration; ?>);
There is now need for doing $duration * 3 because your animations will start all in the same time

Categories