Run a script by clicking a button?

[Bikkebakke]

So, I'm building a browser-game and I got a battle system that runs a while loop when you click a button, but instead of running the while loop I'd want the button to run the script only once when clicked on so that I could add more types of "attacks" as buttons to choose from, but I'm not really sure how to do that.

 

Right now I'm using an Ajax script to bring the attack script from a file called attack.php to a div when you click the button, I tried to make the button run an if else script when clicked but the problem is it loads the $-variables again so the 'monster' reloads too (reloads max hp etc.).

 

Heres the ajax script:

function doAttack() {  // This function does the AJAX request
  http.open("GET", "attack.php", true);
  http.onreadystatechange = getHttpRes;
  http.send(null);
}
function getHttpRes() {
  if (http.readyState == 4) { 
    res = http.responseText;  // These following lines get the response and update the page
    document.getElementById('div1').innerHTML = res;	
  }
}

 

And heres the button:

<input type="button" value="Attack!" name="btn" onClick="doAttack();" >
<br /><br />
<div id="div1"></div>

 

I tried everything I could think of but I'm not that experienced in Ajax nor PHP.

Any help is appreciated!

[jl5501]

so your attack.php is having all of it's output placed in the div with id= div1.

 

You will need to be more selective with what that script outputs and then have the output going to different divs

 

One thing I have used is getting the php script to write javascript statements, then then using eval() in the callback function

 

I can show you examples if you like

 

[Bikkebakke]

Please, show me examples if you can, and please explain whats happening in them too since I prolly won't understand as I'm not familiar with javascript. 

[jl5501]

ok, here is a snippet from the middle of a php file that is called by ajax.

 

echo 'document.getElementById("Account_Number").maxLength='.$u->acclen.'; ';
echo 'document.getElementById("account_1").maxLength='.$u->acclen.';';
if($u->rctext)
{
        echo 'document.getElementById("rateclass").style.display=""; ';
        echo 'document.getElementById("rcerror").innerHTML=\''.$u->rctext.'\'; ';
}
else
{
        echo 'document.getElementById("rateclass").style.display="none"; ';
        echo 'document.getElementById("rcerror").innerHTML=""; ';
}
echo 'document.getElementById("acctno").innerHTML="'.$u->acctext.' '.$u->acctext_ext.'"; ';
echo 'document.getElementById("racct").value="Missing '.$u->acctext.'"; ';
echo 'document.getElementById("lu2").innerHTML="'.$u->utility.'"; ';
if($u->srtext)
{
//      echo 'document.getElementById("servicereference").innerHTML="'.addslashes($u->srtext).'";' ;
        echo 'document.getElementById("serviceref").style.display="";' ;
        echo 'document.getElementById("srerror2").innerHTML="<input type=\"hidden\" name=\"r_servicereference\" value=\"Missing Account Number\" />"; ';
        echo 'document.getElementById("bacctno").innerHTML="Account Number (11 digits)"; ';
        echo 'acc2_text = "Account Number"; ';
        echo 'document.getElementById("additional").innerHTML="Additional '.$acctext_nocolon.'s and Account Numbers: "; ';
}
else
{
//      echo 'document.getElementById("servicereference").innerHTML=""; ';
        echo 'document.getElementById("serviceref").style.display="none"; ';
        echo 'document.getElementById("srerror2").innerHTML=""; ';
        echo 'document.getElementById("additional").innerHTML="Additional '.$acctext_nocolon.'s: "; ';
}

 

as you can see it is echoing reasonably straightforward javascript assigns.

 

the callback function simply does this

newtext = http.responseText.replace( new RegExp( "\\n", "g" ), "" );
        //      alert(newtext);
                eval(newtext);

[Bikkebakke]

Okay so thanks for the examples, but I don't really understand it other than seeing the functions so could you point out how I could take advantage of this in the script I'm trying to code?  :-\

 

Could I like...instead of having the attack.php file use the document.getElementById (or something) to pull the php code that I need to run from the same file?

And can I use the eval() to display the "Player attacks/Monster attacks"-text as a new text instead of overwriting the previous text? Sorry if this seems confusing but I AM confused 

 

(Also, anyone know if/how you can make database fields show negative values as 0 (zero)? // Make the minimum value zero so that the values would never go negative?)

[Bikkebakke]

Oh, wait thats not it 

Anyways, maybe you can clear out how can I use these? o_o

[jl5501]

ok

The thing is, it is relatively easy to have a server-side script output some data, and have javscript put it all inside an html element when it returns. This is what your code already does.

 

What mine does, is essentially the same thing, except I am breaking down the output of the server side script to be placed in different portions of the page.

 

I find the easiest way to do that, is to place the script output into javascript syntax, and then all I need to do is to pass the whole lot back and have javascript execute it.

 

There are other ways of doing this, but this works for me.

 

Now if there was a lot of data, or a lot of javascript code to execute,  then the relative slowness of eval() would be a problem. But for a collection of data updates for various parts of the page, this works satisfactorily