[arandlett]

How could I update this code so that the url variable could be dynamic. Where I would call the preSearch(); function and open a different url with variables instead having to replicate the function for different situations.

Code:

var xmlhttp = false;
        
// If the user is using Mozilla/Firefox/Safari/etc
if (window.XMLHttpRequest) {
        //Intiate the object
        xmlhttp = new XMLHttpRequest();
        //Set the mime type
        //xmlhttp.overrideMimeType('text/xml');
} else if (window.ActiveXObject) {
        //Intiate the object
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}


function preSearch() {
    //Put the form data into a variable
	
	//var theQuery = -1;
	//var theQuery_a = -1;
	//var theQuery_b = -1;
	
	var theQuery = document.getElementById('query').value;
	var theQuery_a = document.getElementById('query2').value;
	var theQuery_b = document.getElementById('query3').value;
	
	if(theQuery !=="") {
	
    //If the form data is *not* blank, query the DB and return the results
	
        //Change the content of the "result" DIV to "Searching..."
        //This gives our user confidence that the script is working if it takes a moment for the result to be returned. However the user will likely never see this...
		document.getElementById('result').innerHTML = "Searching...";
		
        //This sets a variable with the URL (and query strings) to our PHP script
		var url = 'test_v3.php?type=' + theQuery + '&description=' + theQuery_a + '&owner=' + theQuery_b + '&Submit=Submit';
		
        //Open the URL above "asynchronously" (that's what the "true" is for) using the GET method
		xmlhttp.open('GET', url, true);
        //Check that the PHP script has finished sending us the result
		xmlhttp.onreadystatechange = function() {
			if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                //Replace the content of the "result" DIV with the result returned by the PHP script
				document.getElementById('result').innerHTML = xmlhttp.responseText + ' ';
			} else {
                //If the PHP script fails to send a response, or sends back an error, display a simple user-friendly notification
				document.getElementById('result').innerHTML = 'Searching...';
			}
		};
		xmlhttp.send(null);  
	} 
	}

[Nico]

You can define there variables outside the preSearch() function:

Code:

var theQuery = document.getElementById('query').value;
var theQuery_a = document.getElementById('query2').value;
var theQuery_b = document.getElementById('query3').value;

And add these as arguments in the function instead.

Code:

preSearch(theQuery, theQuery_a, theQuery_b)
{
// function rest...
{

Now you could use the same function like this

Code:

var theQuery = document.getElementById('query').value;
var theQuery_a = document.getElementById('query2').value;
var theQuery_b = document.getElementById('query3').value;

preSearch(theQuery, theQuery_a, theQuery_b);

Since you're defining the variables before calling the function, are you able to change them.


If you want to change the whole URL and not only these vars, then could you do this

Code:

preSearch(url)
{
// function rest...
{

Add only the url arg to the function, and use it like this

Code:

var theUrl = 'script.php?get=whatever&and=soon';

preSearch(theUrl);

You would have to remove this line from the function though

Code:

var url = 'test_v3.php?type=' + theQuery + '&description=' + theQuery_a + '&owner=' + theQuery_b + '&Submit=Submit';

[arandlett]

Will those three variables be able to caputre the values when the form is submittedi if i place them outside the funtion? Or do i need to create another function that when the form is submitted will capture the variables then send the url through the preSearch(url); function?

Code:

  searchB() {

var theQuery = document.getElementById('query').value;
var theQuery_a = document.getElementById('query2').value;
var theQuery_b = document.getElementById('query3').value;

var urlVar = 'test_v3.php?type=' + theQuery + '&description=' + theQuery_a + '&owner=' + theQuery_b + '&Submit=Submit';

preSearch(urlVar);

[TwoD]

Note that defining (and setting the values of) the variables outside the function like that will probably return an error because the page won't have finished loading when the script is executed. Either that or the "theQuery.." variables will all be empty since document.getElementById("") won't return a list of elements if it can't find them.

You would only need to do

Code:

var theQuery,theQuery_a,theQuery_b;

outside the function to make those variables global. Keep the rest of the code in the function but remove the var before the "theQuery.." variables or they will still be declared as private to that function.

That way, you can change any part of the query string any time by simply doing

Code:

theQuary="something new"

and the complete url string will be recreated inside the function each time it runs.