$.ajax not calling webservice

$.ajax not calling webservice

Hi All, hope someone can help.

I'm trying to call a WebMethod in a webservice via jQuery AJAX but it never seems to fire success or failure. I want to build an HTML table and display results based on what's been typed into the textbox onkeyup.

ASPX:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="FilteredGrid.aspx.cs" Inherits="CH_Bargains.FilteredGrid" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
   <script type="text/javascript">
       function filtergrid() {
           $.ajax({
               type: "POST",
               url: "FilteredGrid.asmx/filterGrid",
               data: "{query: " + $('#filterText').val() + " }",
               contentType: "application/json; charset=utf-8",
               //data: { "query": $('#filterText').val() },
               dataType: "json",
               success: function(msg) {
                   //$('#grdOffers').html(data);
                   alert(msg);
               },
               failure: function() {
                    alert("Fail!");
               }
           });
       };
       
       function BuildTable(msg) {
           var table = '<table><thead><tr><th>Depair</th><th>Destair</th><th>Resort</th><th>Price</th><th>Link</th></thead><tbody>';
            for (var offer in msg) {
                var row = '<tr>';
                row += '<td>' + msg[offer].Depair + '</td>';
                row += '<td>' + msg[offer].Destair + '</td>';
                row += '<td>' + msg[offer].resort + '</td>';
                row += '<td>' + msg[offer].Price + '</td>';
                row += '<td>' + msg[offer].Link + '</td>';
                row += '</tr>';
                table += row;
            }
            table += '</tbody></table>';
            $('#Container').html(table);
        }
   </script>
</head>
<body>
    <form id="form1" runat="server">
    
    <div>
    
        <input id="filterText" type="text" onkeyup="filtergrid();"/>
        
        <div id="container"></div>
        <asp:GridView ID="grdOffers" runat="server" AutoGenerateColumns="true" AlternatingRowStyle-BackColor="Gainsboro">
            </asp:GridView>
        
    </div>
    </form>
</body>
</html>

ASMX (FilteredGrid.asmx)

using System;
using System.Collections.Generic;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Services;

namespace CH_Bargains
{
    /// <summary>
    /// Summary description for FilteredGrid1
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]
    // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
    [System.Web.Script.Services.ScriptService]
    public class FilteredGrid1 : System.Web.Services.WebService
    {
        [WebMethod]
        protected DataTable filterGrid(string query)
        {
            string cs = ConfigurationManager.ConnectionStrings["Co-opHolidays"].ConnectionString;
            SqlConnection conn = new SqlConnection(cs);

            // SQL Command
            SqlCommand command = new SqlCommand("select top 20 depair, destair, resort, link, price from HolidayOffers where resort LIKE '" + query + "%'", conn);
            // Specify Command Type
            //command.CommandType = CommandType.StoredProcedure;
            command.CommandType = CommandType.Text;

            //Setup and assign parameters if needed
            try
            {
                conn.Open();
                SqlDataAdapter da = new SqlDataAdapter(command);
                DataTable dt = new DataTable();
                da.Fill(dt);
                conn.Close();
                conn.Dispose();
                return dt;
            }

            catch (Exception ex)
            {
                // handle exception
                return new DataTable();
            }
        }
    }
}

I've put a breakpoint in VS2008 on the $.ajax and it does hit but does nothing afterwards.
Any ideas where I'm going wrong?

Thanks in advance,
Brett