Button update automatically once clicked

[dialgarocksful]

Hi, I forgot how this works. I don't plan in using a submit button and rather use auto-update in radio buttons. I currently have this set of codes:

 

UPDATE 1: I managed to switch from radioButton to Buttons, and changed PHP codes to JavaScript. Problem is, it still cant update once I pressed a button. Do I need to use AJAX?

 

Here's the snippets:

<script type="text/javascript" src="script.js"></script>
<h4>Store Preference</h4>

<form action="" method="POST">	
  <button type="button" class="btn btn-default btn-md" value="1" id="button" name="store1">Store1</button>
  <button type="button" class="btn btn-success btn-md" value="2" id="button" name="store2">Store2</button>
</form>

<script type="text/javascript">
  if (value == 1)
  {
    coolerName = "Corsair H100i v2";
    coolerPrice = 5440;
  }
  if (value == 2)
  {
    coolerName = "Corsair H100i v2";
    coolerPrice = 5450;
  }
  document.write("<td>" + coolerName + "</td>");
  document.write('<td id="alignRight">');
  if (coolerPrice > 0)
  {
    document.write(coolerPrice.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,'));
  }
  else
  {
    document.write(coolerPrice.toFixed(0).replace(/(\d)(?=(\d{3})+\.)/g, '$1,'));
  }
  document.write('</td>');
</script>

var value = 1;
var button = document.getElementById("button");

button.onClick = function()
{
	if (content.name == "store1")
		value = 1;
	if (content.name == "store2")
		value = 2;
}

 

[MrDrWho13]

Someone correct me if I'm wrong (I only learned this a few days ago).

To do auto-updating on a page, you need to have the code in JavaScript because PHP is server side and therefore will only take effect on page load.

You need a JavaScript function to do whatever live calculations and then on each input on the form you need the onclick parameter to execute that JavaScript function. You may also want the onblur parameter to execute the function.

I hope this makes sense, I'll explain something in more detail if you don't understand.

[Guest]

submit form with an onchange might also work and be a bit moar easy on the system/browser.

[dialgarocksful]

26 minutes ago, Dutch-stoner said:

submit form with an onchange might also work and be a bit moar easy on the system/browser.

how can i approach it? do i use var on jscript or can i still use $value on php?

[vorticalbox]

1 hour ago, dialgarocksful said:

how can i approach it? do i use var on jscript or can i still use $value on php?

Can you explain more what you're trying to do? so far 

$text = "One";

You get text to One but nothing with it?

[dialgarocksful]

1 minute ago, vorticalbox said:

Can you explain more what you're trying to do? so far 

$text = "One";

You get text to One but nothing with it?

I'm stuck at that point. I got used in using a submit button (via isset[submit]). Can't seem to echo Two since it's default value is set at 1

[vorticalbox]

$text = '';

if($_POST['store'] == 1){
	$text = "One";
}else if( $_POST['store'] == 2){
	$text = "two";
}

echo $text;

You get the data from $_POST and the inputs name, in this case store. Then check.

[dialgarocksful]

54 minutes ago, vorticalbox said:

$text = '';

if($_POST['store'] == 1){
	$text = "One";
}else if( $_POST['store'] == 2){
	$text = "two";
}

echo $text;

You get the data from $_POST and the inputs name, in this case store. Then check.

Here's what happened:

 

<form action="" method="POST" id="forms">		
  <label class="radio-inline">
    <input type="radio" name="store" onclick="onClick1" value="1" checked>One
  </label>
  <label class="radio-inline">
    <input type="radio" name="store" onclick="onClick1" value="2">Two
  </label>
</form>

<?php
	if ($_POST['store'] == 1)
		$value = 1;
	else if ($_POST['store'] == 2)
		$value = 2;
?>

if-else statements are line 36 and 38. it gave me then this

 

Notice: Undefined index: store in <filename> on line 36

Notice: Undefined index: store in <filename> on line 38

[vorticalbox]

13 minutes ago, dialgarocksful said:

Here's what happened:

 

<form action="" method="POST" id="forms">		
  <label class="radio-inline">
    <input type="radio" name="store" onclick="onClick1" value="1" checked>One
  </label>
  <label class="radio-inline">
    <input type="radio" name="store" onclick="onClick1" value="2">Two
  </label>
</form>

<?php
	if ($_POST['store'] == 1)
		$value = 1;
	else if ($_POST['store'] == 2)
		$value = 2;
?>

if-else statements are line 36 and 38. it gave me then this

 

Notice: Undefined index: store in <filename> on line 36

Notice: Undefined index: store in <filename> on line 38

So what are you going to do with the post data? If it is to change something on the website don't use php use JavaScript. 

 

That means the data isn't being passed correctly check or action is pointing to the right file. 

[dialgarocksful]

26 minutes ago, vorticalbox said:

So what are you going to do with the post data? If it is to change something on the website don't use php use JavaScript. 

 

That means the data isn't being passed correctly check or action is pointing to the right file. 

it will be echoing different values, here's my snippet:

 

<?php
  if ($value == 1)
  {
  $cpuName = "AMD Ryzen 7 1800X";
  $cpuPrice = 27000;
  }

  if ($value == 2)
  {
  $cpuName = "AMD Ryzen 7 1800X";
  $cpuPrice = 27000;
  }

  echo "<td>$cpuName</td>";
  echo '<td id="alignRight">';
  if ($cpuPrice > 0)
  echo number_format($cpuPrice, 2);
  else
  echo number_format($cpuPrice, 0);
  echo '</td>';
?>	

 

[dialgarocksful]

need to bump. changed php to jscript

[vorticalbox]

53 minutes ago, dialgarocksful said:

need to bump. changed php to jscript

are you hand coding all the data? How many are we talking?

 

either way i would use JavaScript for this, make a array/dictionary in json then load depending on what is picked. 

[dialgarocksful]

6 minutes ago, vorticalbox said:

are you hand coding all the data? How many are we talking?

 

either way i would use JavaScript for this, make a array/dictionary in json then load depending on what is picked. 

yes, I'm hand-coding all. Let's say around 10 items per category. I'm thinking of having an sql database and just call it whenever, but I'd like to hear how json works

[vorticalbox]

3 hours ago, dialgarocksful said:

yes, I'm hand-coding all. Let's say around 10 items per category. I'm thinking of having an sql database and just call it whenever, but I'd like to hear how json works

Something like this, https://jsfiddle.net/085jxjk7/1/

 

You could change the var at the top to an ajex call to get json from PHP.

[dialgarocksful]

3 hours ago, vorticalbox said:

Something like this, https://jsfiddle.net/085jxjk7/1/

 

You could change the var at the top to an ajex call to get json from PHP.

where can i find a copy of the ajax call from jsfiddle (sorry, first time using ajax and js here)

[vorticalbox]

26 minutes ago, dialgarocksful said:

where can i find a copy of the ajax call from jsfiddle (sorry, first time using ajax and js here)

there wasn't any in that example, you would have to create some sort of API with php to return database query as JSON, however you can use that code to hand code it if you wish.

[dialgarocksful]

2 minutes ago, vorticalbox said:

there wasn't any in that example, you would have to create some sort of API with php to return database query as JSON, however you can use that code to hand code it if you wish.

i see. i tried it on JSFiddle, it works. But once I tried it on my own page, it doesnt. Think there's still something missing:

 

https://jsfiddle.net/owytgLrs/

[vorticalbox]

4 hours ago, dialgarocksful said:

i see. i tried it on JSFiddle, it works. But once I tried it on my own page, it doesnt. Think there's still something missing:

 

https://jsfiddle.net/owytgLrs/

works fine here.