Query database with Ajax and classic ASP

I'm trying to modify a script from w3scools to use a combination of asp and ajax to query a database and return results.

Here is the code:

<html>
<head>
<script type="text/javascript">
function showCustomer(str)
{
    var xmlhttp;    
    if (str=="")
    {
        document.getElementById("txtHint").innerHTML="";
        return;
    }
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","getcustomer.asp?q="+str,true);
    xmlhttp.send();
}
</script>
</head>
<body>

<form action=""> 
    <select name="customers" onchange="showCustomer(this.value)">
        <option value="">Select a customer:</option>
        <option value="ALFKI">Alfreds Futterkiste</option>
    </select>
</form>
<br />

<div id="txtHint">Customer info will be listed here...</div>

</body>
</html>

I would like to replace the select field with 2 input fields.

Can someone please tell me how to amend the javascript so that both the input values are passed with the querystring and what needs to be changed on the form to call the function.

Thanks

Answers


It depends exactly how you want the page to operate. Can you be a bit more specific?

When you say 'input values' do you mean a text box?

I'm assuming in the following example that you'll have two fields and a button for submitting:

<form action=""> 
    <label for="MyTextBox1>Enter some text:</label>
    <input type="text" id="MyTextBox1" />

    <label for="MyTextBox1>Enter some text:</label>
    <input type="text" id="MyTextBox2" />

    <input type="button" onclick="showCustomer();" />
</form>

The definition of your JavaScript function will change from

function showCustomer(str)

to

function showCustomer()

And you'll need to remove any associated str code.

To pick up these values use document.getElementById:

var val1 = document.getElementById("MyTextBox1").value);
var val2 = document.getElementById("MyTextBox1").value);
xmlhttp.open("GET","getcustomer.asp?q="+ val1 +"&r=" + val2 ,true);

This is very rough and ready, but a good starting point.


Need Your Help

How to set a pixel in a SDL_surface?

c++ c graphics sdl

I need to use the following function from this page. The SDL_Surface structure is defined as

SQLDataSource Paramter not working

sql asp.net sqldatasource

I have the following SQLDataSource:

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.