How to make jQuery UI to work in DotnetNuke 6+

EDIT: Here is the edited control file (control.ascx):

    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="Sale.ascx.cs" Inherits="Enmasse.Modules.Demo_Enmasse.Sale" %>

    <script type="text/javascript">
        $(document).ready(function () {
            $("#<%=txtuser.ClientID%>").autocomplete('<%=ResolveUrl("Search_Username.ashx")%>');
        function AnotherJSFunction{
...
}
        });      
    </script>

    <asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex=0>
    <asp:View ID="main" runat="server">
    <div class=item>
    <asp:TextBox ID="txtuser" runat="server" ></asp:TextBox><br />
    ...

Here is the edited code behind file (control.ascx.cs):

protected void Page_Load(object sender, System.EventArgs e)
       {
            DotNetNuke.Framework.jQuery.RequestUIRegistration();
       }

This is the web handler just in case (ashx):

<%@ WebHandler Language="C#" Class="Search_Username" %>

using System;
using System.Web;
using System.Data.SqlClient;
using System.Configuration;
using System.Text;

public class Search_Username : IHttpHandler {

    public void ProcessRequest (HttpContext context) {
        string prefixText = context.Request.QueryString["q"];
        using (SqlConnection conn = new SqlConnection())
        {
            conn.ConnectionString = ConfigurationManager.ConnectionStrings["SiteSqlServer"].ConnectionString;
            using (SqlCommand cmd = new SqlCommand())
            {
                cmd.CommandText = "select Username from Users where Username like @SearchText + '%' and IsSuperUser <> 1";
                cmd.Parameters.AddWithValue("@SearchText", prefixText);
                cmd.Connection = conn;
                StringBuilder sb = new StringBuilder();
                conn.Open();
                using (SqlDataReader sdr = cmd.ExecuteReader())
                {
                    while (sdr.Read())
                    {
                        sb.Append(sdr["Username"]).Append(Environment.NewLine);
                    }
                }
                conn.Close();
                context.Response.Write(sb.ToString());
            }
        }
    }
    public bool IsReusable {
        get {
            return false;
        }
    }
}

I have tested the web handler Search_Username.ashx and it works fine, but I'm not sure that the link to the file is correct. The jQuery autocomplete still doesn't work and there is no error either. I have no clue where to fix, although I have review some question on here. Can someone help me?

Answers


Since you're in DNN 6, jQuery UI is included in the framework. Remove the JavaScript includes from your markup, and add DotNetNuke.Framework.jQuery.RequestUIRegistration in the Page_Load.

From there, I would view source on the page and check that your URLs are correct. Typically, I would use ResolveUrl, rather than ModulePath to get the path to a resource (e.g. <%=ResolveUrl("Search_Username.ashx")%>).

Otherwise it looks pretty reasonable. You might look at the "Remove with caching" example from jqueryui.com, and add some logging into the source method it provides, so you can see if you're actually wired-up, making calls, and getting responses.


*Since you're in DNN 6, jQuery UI is included in the framework. Remove the JavaScript includes from your markup, and add DotNetNuke.Framework.jQuery.RequestUIRegistration in the Page_Load.


Need Your Help

Output of spliting array does not come as expected

java arrays

Given an array of ints as input, return true if it is possible to split the array into two so that the sum of the numbers on the left is equal to the sum of the numbers on the right.

Framework to draw Edges and Nodes using GWT

java gwt graph nodes edges

I am searching for framework to draw Edges and Nodes. I want to create a visual graph and It should be draggable.