Fancytree not loading with ajax request

Question

I'm having a problem with fancytree. I have an aspx page, with a webmethod on the codebehind.

I was trying to initialize the tree with an ajax call, but for some reason it looks the ajax call isn't getting there. This is my javascript code to initialize the tree:

<script type="text/javascript">
    $(function () {
        var DT = $.ui.fancytree;
        var tree = "";
        $.ui.fancytree.debug("Using fancytree " + $.ui.fancytree.version);

        /* Load tree from Ajax JSON
        */
        $("#tree2").fancytree({
            source: {
                url: "tree.aspx/getTreeData"
            }
        });

    });
</script>

and this is my codebehind webmethod:

namespace TreeGen
{
public partial class tree : System.Web.UI.Page
{

    [WebMethod]
    [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json, XmlSerializeString = false)]
    public static List<Curso> getTreeData()
    {
        JavaScriptSerializer TheSerializer = new JavaScriptSerializer();

        CourseSerializer course = new CourseSerializer();
        course.children = new List<Curso>()
        {
            new Curso(){
                key = "1",
                title = "aaaa",
            }
        };
        List<CourseSerializer> courses = new List<CourseSerializer>() { course };
        string TheJson = TheSerializer.Serialize(course.children);
        Console.WriteLine(TheJson);

        return course.children;
    }
}
}

What am i doing wrong? I tried to make a ajax request to the webmethod and i am able to retrieve the json string. But when i use the fancytree i can't populate the tree!

Thanks in advance! Regards!

score 5 · Answer 1 · answered Jun 25 '14 at 13:25

For anyone interested... The ajax requests made by fancytree are all "GET" requests by default. I added the ajax options as shown below, and the issue is now solved.

$('#tree2').fancytree({
    ajax: { type: "POST", contentType: "application/json" },
    source: {
        url: "/tree.aspx/getTreeData"
    }
});

Regards!

Fancytree not loading with ajax request

1 Answers1