multiple onclick buttons


rich

Mitglied
Hallo ihr lieben,

ich habe folgendes Problem mit einer onClick/Button Javascript funktion.

es soll über das Netzwerk ein Shelly angesprochen werden,
dieser nimmt befehle (GET) über die Adresszeile entgegen.

ich möchte über mehrere Buttons die sich bis auf die Get-parameter nicht unterscheiden diesen steuern.

um es übersichtlich und kurz zu halten habe ich nur die relevanten Codes:


Index.php
PHP:
<?php
 include "script.php";
?>

<button type="button" onclick="sendcommand()" id="url" name="url" label="power2" method="GET" value="ip=<?php echo $shelly_ip; ?>&relay=power2&com=toggle" class="mdl-button mdl-button--raised mdl-js-button mdl-js-ripple-effect mdl-button">
Relay 1
</button>

<button type="button" onclick="sendcommand()" id="url" name="url" label="power1" method="GET" value="ip=<?php echo $shelly_ip; ?>&relay=anderes1&com=toggle" class="mdl-button mdl-button--raised mdl-js-button mdl-js-ripple-effect mdl-button">
Relay 2
</button>

<center><p id="ergebnis"></p></center>

script.php
Javascript:
<?php
$shelly_ip = "http://123.456.789";
?>

<script>
function sendcommand() {
  var xhttp = new XMLHttpRequest();

   add = "scommand.php?";
   bla = document.getElementById("url").value;
   var url = add + bla;

  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {

//  alert(bla);

      document.getElementById("ergebnis").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", url ,true);
  xhttp.send();
}
</script>



scommand.php
PHP:
<?php
$ip= $_GET["ip"]; // ip holen
$relay= $_GET["relay"]; // relay holen
$command = $_GET["com"]; // command holen

// --------------------------- Variablen übergeben ?
echo $ip."<br />";
echo $relay."<br />";
echo $command."<br />";

echo "<br /><br />";
echo $ip."/cm?cmnd=".$relay."%20".$command;
echo "<br /><br />";
// --------------------------- Variablen übergeben ?


// Ip - Relay - Befehl in variable packen
$com = $ip."/cm?cmnd=".$relay."%20".$command;

switch($command)
{
 case ("toggle"): // ---------------------------------------------------------- [ Relay schalten ]
// $anwenden = file_get_contents($com);
 echo $anwenden; // echo "Ergebnis: Relay Ein/Aus";
 break;

 case ("Backlog"):
 echo $POWER2;
 break;

 default:
 echo "---";
 default:
 }

?>
ja die ID muss immer eindeutig sein, nur wie bekomme ich das in der Konstellation hin ?
ich hab mich schon dumm und dusselig gesucht vieles ausprobiert aber nix wirklich hinbekommen.

anstatt document.getElementById soll man document.getElementByClass nehmen,
allerdings versaut es mir dann den Stylesheet aber mal davon abgesehen klappte das auch nicht.

vielleicht kann mir ja jemand sagen, wie es funktioniert.
liebe grüße
 

Sempervivum

Erfahrenes Mitglied
Wenn Du das Button-Element als this an die Funktion übergibst, kannst Du problemlos auf den Wert zugreifen:
HTML:
<button type="button" onclick="sendcommand(this)" id="url" name="url" label="power2" method="GET" value="ip=<?php echo $shelly_ip; ?>&relay=power2&com=toggle" class="mdl-button mdl-button--raised mdl-js-button mdl-js-ripple-effect mdl-button">
Relay 1
</button>

<button type="button" onclick="sendcommand(this)" id="url" name="url" label="power1" method="GET" value="ip=<?php echo $shelly_ip; ?>&relay=anderes1&com=toggle" class="mdl-button mdl-button--raised mdl-js-button mdl-js-ripple-effect mdl-button">
Relay 2
</button>
Code:
function sendcommand(btn) {
   bla = btn.value;
   // in den Rest bin ich nicht eingestiegen
Dann kannst Du auch auf die mehrfachen IDs verzichten.
 

rich

Mitglied
Wenn Du das Button-Element als this an die Funktion übergibst, kannst Du problemlos auf den Wert zugreifen:
HTML:
<button type="button" onclick="sendcommand(this)" id="url" name="url" label="power2" method="GET" value="ip=<?php echo $shelly_ip; ?>&relay=power2&com=toggle" class="mdl-button mdl-button--raised mdl-js-button mdl-js-ripple-effect mdl-button">
Relay 1
</button>

<button type="button" onclick="sendcommand(this)" id="url" name="url" label="power1" method="GET" value="ip=<?php echo $shelly_ip; ?>&relay=anderes1&com=toggle" class="mdl-button mdl-button--raised mdl-js-button mdl-js-ripple-effect mdl-button">
Relay 2
</button>
Code:
function sendcommand(btn) {
   bla = btn.value;
   // in den Rest bin ich nicht eingestiegen
Dann kannst Du auch auf die mehrfachen IDs verzichten.
Perfekt !!

mit dem this hatte ich das auch probiert,
allerdings function sendcommand(btn) { & btn.value;
nicht angepasst...,

von alleine hätte ich des in 2 Monaten noch nicht gelöst ;)
wahrscheinlich zu Kompliziert gedacht und mit mehr "aufwand" gerechnet.

jedenfalls vielen dank
 

Neue Beiträge