简体   繁体   中英

how to take a Value from a javascript variable, to be used as a php input variable via a button, without or not a submit button?

how to take a Value from a javascript variable, to be used as a php input variable via a button, not a submit button because the submit button cannot generate sequences more than once at the same time? I have tried this method but I still can't get the output ("x") from js using the button. this is my first code with javascript I tried as best I could because I tried to use break but it didn't work then i put x-- to freze it.

this javascript work like i want, but still can't get value "x" from button value

Code:

<title>Test-2019</title>
<!-- x += 1 -->
<!-- Java Script -->
<script> 
x = 0;
function f_Next()
{
    x++;
    document.getElementById("Next").value = x;
    if(x == 5) {
        x--;
    }
}
</script>
<!-- HTML -->
<form method="post" action="#">
    <input type="button" value="Soal" id="Next" onClick="f_Next()">
    <!-- 
    <input type="hidden" value="0" id="Next">
    -->
</form>
<!-- PHP -->
<?
$a = array("str1", "str2", "str3", "str4", "str5");
if (isset($_POST['soal']))
{
    $va = $_POST['soal'];
    print $a[$va];
}
?>

on delphi I always use this method and I also tried to implement it but it didn't work so I tried making it with java script.

Delphi Example Code:

//global var
const
    a : array[0..4] of string = ('str1', 'str2', 'str3',  'str4', 'str5');
 var
    g : integer;
    ...
    ...
    //on create
    g := 0;
    ...
    ...
    //on button click
    g := g + 1;
 if g = 5 then
    g = 0;
    edit1.text := IntToStr(g);

  //or like this example 2
   button1.tag := button1.tag + 1;
if button1.tag = 5 then
   button1.tag := 0;       
   edit1.text := IntToStr(button1.tag);

php code was i tried, like this

function fNext();
{
    $x = 0;
    if ($x == 5)
    {
        break;
    }
    x += 1;
}

i'm sorry if i included pascal/delphi code, cz maybe you can help me to convert it into php.

Thank you.

Not really sure what you are trying to do here, BUT if you want the value of an <input> element to get to PHP it HAS TO HAVE A name attribute!

So change your input to

<input name="Next" type="button" value="Soal" id="Next" onClick="f_Next()">`
//     ^^^^^^^^^^^  added this 

Now you need to address it properly in the $_POST array, so if we call the element Next as in name="Next" we should use $_POST['Next'] and not $_POST['soal'] as soal was the value attribute which by the way the javascript should have overwritten with 1 or 2 etc

$a = array("str1", "str2", "str3", "str4", "str5");

if (isset($_POST['Next']))
{
    $va = $_POST['Next'];
    print $a[$va];
}

I'm not 100% sure I grasped the intent of the question but I hope this might be more or less the desired outcome?

Each click of the button increments the counter x and will send this value to the PHP script. The PHP script responds with the value from the array appropriate to the value of x

The ajax callback increments the variable and does other, really interesting, things.

<?php
    $a = array("str1", "str2", "str3", "str4", "str5");
    if (isset($_POST['soal'])){
        $va = $_POST['soal'];

        $response=( array_key_exists( $va, $a ) ) ? $a[ $va ] : 'error';
        exit( $response );
    }
?>
<!DOCTYPE html>
<html>
    <head>
        <title>Test-2019</title>
        <script>

            document.addEventListener('DOMContentLoaded', ()=>{

                let x=0;

                const ajax=function(payload,callback){
                    let xhr=new XMLHttpRequest();
                        xhr.onreadystatechange=function(){
                            if( this.status==200 && this.readyState==4 )callback.call( this, this.response );
                        }
                        xhr.open('POST', location.href, true );
                        xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
                        xhr.send( payload );
                }
                const callback=function(r){
                    alert(r);
                    x++;
                    if( x==5 )x=0;
                }
                document.querySelector( 'form input[ type="button" ]' ).addEventListener('click', function(e){
                    ajax.call( this, 'soal=' + x, callback )
                });
            });

        </script>
    </head>
    <body>
        <form method='post'>
            <input type='button' value='Soal' />
        </form>
    </body>
</html>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM