Solved

How to handle JQuery Ajax Results

Posted on 2009-05-08
4
874 Views
Last Modified: 2012-05-06
Hi to all,

I am trying to use the JQuery Plugin found here:
http://www.fairwaytech.com/Technology/FlexBoxDemo.aspx

I am new to JavaScript so I am not sure how to handle the data returned by my Ajax request. The code below is what I think it should be, but the response is not populating the auto complete drop down. That is the only part that I am not sure of and I am pretty sure that is the part that is wrong, but again... I am new to this so I can't be sure where I am going wrong.

Any Help would be appretiated.

Thanks
Members.aspx.vb Page:
 
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim AllMembers As DataTable = LoadMembers()
Dim WholeAddress As String = Nothing
For Each member In AllMembers.Rows
Dim MemberName As String = member("Member Name").ToString()
Response.Write("Name:" & MemberName & Environment.NewLine)
Next
End Sub
 
JavaScript:
$().ready(function() {
        // Give each example an anchor tag
        var count = 1;
        $.each($('.demo'), function() {
            var $example = $(this);
            $example.before('<a name="demo' + count++ + '" />');
        });
 
        // Set up our example table of contents
        count = 1; // reset our counter
        var $toc = $('#toc');
        $.each($('.example > td'), function() {
            var $td = $(this);
            var anchor = $(document.createElement('a')).attr('href', '#demo' + count++);
 
            $(document.createElement('li'))
                .html($td.html())
                .wrapInner(anchor)
                .appendTo($toc);
 
            // Create link back to top (floated right)
            $(document.createElement('div'))
                .html('<a href="#toc">Top</a>')
                .css('float', 'right')
                .appendTo($td);
        });
        $('#ffb2').flexbox('Members.aspx');
        })
 
HTML:
<form id="form1" runat="server">
<div style="height:18px"></div>
<div id="ffb2"></div>
</form>

Open in new window

0
Comment
Question by:ALawrence007
  • 2
  • 2
4 Comments
 
LVL 7

Accepted Solution

by:
ycTIN earned 500 total points
ID: 24342037
i suggest you try Example 1 first

save following content and named json.txt
 {"results":[  
    {"id":"1","name":"Ant"},  
    {"id":"2","name":"Bear"},  
    {"id":"3","name":"Cat"},  
    {"id":"4","name":"Dog"},  
    {"id":"5","name":"Elephant"},  
    {"id":"6","name":"Fox"},  
    {"id":"7","name":"Guinea Pig"},  
    {"id":"8","name":"Horse"},  
    {"id":"9","name":"Iguana"},  
    {"id":"10","name":"Jaguar"}  
]}  

call
$('#ffb1').flexbox('json.txt');  
0
 
LVL 7

Assisted Solution

by:ycTIN
ycTIN earned 500 total points
ID: 24342047
if example 1 is work,  this mean client side code is no problem
then you can try example 2
$('#ffb2').flexbox('Members.aspx');

server page Members.aspx should be return JSON text format data

How to convet data to JSON format :
http://stackoverflow.com/questions/579053/how-can-i-encode-an-array-in-vb-net-to-json
0
 

Author Comment

by:ALawrence007
ID: 24343739
ycTIN,
I tried what you said: Sample one first and that also did not work. Maybe it is something I am doing. I looked at the other post and that also did not work.
Any help further would be appreciated.
Thanks
0
 

Author Closing Comment

by:ALawrence007
ID: 31579670
Simple Result in the end: My result did not start with:
{"results":[  ...... And end with : ]}
Thanks ycTIN
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Requirements JQuery 1.6+ HTML CSS Introduction This article was inspired by an EE question (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28372511.html) on how to make a page show some balloons animate up a page…
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

821 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question