Jump to content

[SOLVED] checking values in jQuery / Javascript array


PWaddict
 Share

Recommended Posts

I'm currently using this on my php template which outputs this: <script type="text/javascript">var coupons = ['CODE1','CODE2',];</script>

<script type="text/javascript">var coupons = <?php $coupons = $pages->find("template=paddiscount, title!='', pad_percentage!=''");
echo "[";
foreach($coupons as $coupon) {
  echo "'" . $coupon->title . "',";
}
echo "];";
?></script>

and the related code on my main.js is this:

var discount = $form.find('input[name=pad_discount_code]').val();

if (discount != '' && $.inArray(discount, coupons) == -1) {
  alert('Discount code not found');
} 

The above is working properly but now on the php template I need to add in the array also a timestamp value ($coupon->pad_valid_until) and on main.js I need to also check if there is timestamp associated with the coupon entered and if that timestamp is less than today then alert('Discount code expired');

I don't have much experience with this stuff and I don't know how to proceed. Can you please help me?

Link to comment
Share on other sites

  • PWaddict changed the title to NEED HELP for checking values in jQuery / Javascript array

Ok I found how to do it:

On php template:

<script type="text/javascript">var coupons = <?php $coupons = $pages->find("template=paddiscount, title!='', pad_percentage!=''");
echo "{";
foreach($coupons as $coupon) {
  if ($coupon->pad_valid_until) {
    echo " '" . $coupon->title . "' : " . "'" . date("Y-m-d", $coupon->pad_valid_until) . "'" . ",";
  } else {
    echo " '" . $coupon->title . "' : " . "'" . "" . "'" . ",";
  }
}
echo "};";
?></script>

Outputs something like this: <script type="text/javascript">var coupons = { 'CODE1' : '', 'CODE2' : '2018-09-30',};</script>

And the related code on main.js:

var discount = $form.find('input[name=pad_discount_code]').val();

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1;
var yyyy = today.getFullYear();

if (dd < 10) {
  dd = '0' + dd;
}

if (mm < 10) {
  mm = '0' + mm;
}

today = yyyy + '-' + mm + '-' + dd;

if (discount != '' && (!coupons.hasOwnProperty(discount))) {
  
  alert('Discount code not found');

} else if (discount != '' && coupons[discount] != '' && coupons[discount] <= today) {
  
  alert('Discount code expired');
  
}

 

  • Like 3
Link to comment
Share on other sites

  • PWaddict changed the title to [SOLVED] checking values in jQuery / Javascript array

What @AndZyk said.

Below is one way to do it. Before that though, logic whether something exists should really be done server-side. Yes, you can also do client-side checks the way you are doing it (just for UX) as long as you also validate things server-side. Otherwise, if you only do it client-side, it is easy to change the 'valid until date' of the coupon in the markup and send that to the server which would honour the coupon and you'd incur a loss in your takings :-). I hope you are also checking server-side.

OK, here's the code. It makes things cleaner, more readable and is less prone to mistakes since PHP handles the JSON string.

<?php

	// initialise variables
	$couponsArray = array();
	$couponsJSON = '';

	// fetch coupons
	$coupons = $pages->find("template=paddiscount, title!='', pad_percentage!=''");

	// we found coupons
	if($coupons->count) {
		// loop through coupons and add values to coupons array
		foreach($coupons as $coupon) {	
			// if coupon valid until, get human readable valid until date, else empty
			$couponValidUntil = $coupon->pad_valid_until ? date("Y-m-d", $coupon->pad_valid_until) : '';
			$couponsArray[$coupon->title] = $couponValidUntil;
		}
		// generate JSON string of coupons for JavaScript
		$couponsJSON = json_encode($couponsArray);
	}

?>
<!-- html here -->
<script type="text/javascript">var coupons = <?php echo $couponsJSON ?></script>

Then in your JavaScript do your checks, if var coupons is not empty, etc.

Hope this helps :-).

  • Like 4
Link to comment
Share on other sites

17 minutes ago, PWaddict said:

@kongondo I will try it with your code. Thanks. Isn't the server-side checking done by Padloper? If you go to PadOrderProcess.php on the line 95 there is a piece of code for checking the checkout form for invalid and expired coupons.

Ah. I thought you were doing your own implementation.

Link to comment
Share on other sites

@kongondo The coupons are actually exposed in my checkout page source. So I created a new hidden page with a different template and added there only your code to avoid exposing them but now I'm not sure how to proceed.

<?php namespace ProcessWire;

$couponsArray = array();
$couponsJSON = '';

$coupons = $pages->find("template=paddiscount, title!='', pad_percentage!=''");

if($coupons->count) {

  foreach($coupons as $coupon) {
    $couponValidUntil = $coupon->pad_valid_until ? date("Y-m-d", $coupon->pad_valid_until) : '';
    $couponsArray[$coupon->title] = $couponValidUntil;
  }

  $couponsJSON = json_encode($couponsArray);
} ?>
<?php if($coupons->count) { ?>
<script type="text/javascript">var coupons = <?= $couponsJSON ?>;</script>
<?php } else { ?>
<script type="text/javascript">var coupons = '';</script>
<?php } ?>

On checkout page I'm getting the error: "coupons is not defined" on console which is obvious cause this is a different page.

Link to comment
Share on other sites

I think I figured it out. I had to set the template with the hidden coupons page to json header and then modify the js code like this:

$.get('../my-hidden-coupons-page/', function (data) {
  
  var coupons = data;
  
  if (discount != '' && (!coupons.hasOwnProperty(discount))) {
    
    alert('Discount not found');
  
  } else if (discount != '' && coupons[discount] != '' && coupons[discount] <= today) {
    
    alert('Discount expired');
    
  }
});

 

Link to comment
Share on other sites

and here is the final code for the php template for the hidden page that will get all the available coupons ONLY via ajax:

<?php namespace ProcessWire;

$couponsArray = array();
$couponsJSON = '';

$coupons = $pages->find("template=paddiscount, title!='', pad_percentage!=''");

if($coupons->count) {

  foreach($coupons as $coupon) {
    $couponValidUntil = $coupon->pad_valid_until ? date("Y-m-d", $coupon->pad_valid_until) : '';
    $couponsArray[$coupon->title] = $couponValidUntil;
  }

  header('Content-Type: application/json');
  $couponsJSON = json_encode($couponsArray);
}

if($config->ajax) {
  echo $couponsJSON;
} ?>

If I did something wrong please let me know.

  • Like 2
Link to comment
Share on other sites

13 minutes ago, kongondo said:

I was replying as your reply came in :-). Yes, that is the issue. Is there any reason your discount page titles would be empty? I mean, would the selector still work without adding the title!=''?

I had it there since the beginning where I was actually only validating the title (see first post). So removing title!='' and adding include=all does the job.

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...