Bind data to the grid at the client side using AJAX call to web service

With the Current AJAX Tool kit is there a way to databound the grid at the client side.

 Basically I want to make a WCF web service all and get the JSON message and populate the grid at the cient side. I am using Visual studio 2005 with .NET frame work 3.0. Please point out if tehre are any examples. I truly appreciate any help regarding this. Thanks

10/17/2007 1:51:50 PM 17816 articles. 1 followers. Follow

3 Replies

Similar Articles

[PageSpeed] 58
Get it on Google Play
Get it on Apple App Store

I hope this article will help you.

Marking a Reply as 'Answered', not only GAIN us some POINTS, but it also HELP others to find RIGHT solution.
10/18/2007 10:40:06 AM

Thanks for the reply. This article is to populate the fields in the moder popup using AJAX and Javascrip. But not populating the grid itself using AJAX, webservice and Javascript.

 This sample poulates the grid on serverside in a normal way.

I am looking for a sample that can poulate the grid in cleint side.

10/19/2007 12:47:07 PM

Hi Nagu,

I think ameenkpn has provided the solution.  First , you call WebService to get a Jason object which contains all the elements of the GridView(Table).  Then, you generate the TableRows based on the Jason object. Here is the generated HTML.

<table cellspacing="0" rules="all" border="1" id="GridView1" style="border-collapse:collapse;">
   <th scope="col">EmployeeID</th><th scope="col">LastName</th><th scope="col">FirstName</th><th scope="col">Title</th><th scope="col">&nbsp;</th><th scope="col">&nbsp;</th>
   <td>1</td><td>Davolio</td><td>Nancy</td><td>Sales Representative</td><td>
                        <input name="GridView1$ctl02$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl02$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl02_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$0')" mce_href="javascript:__doPostBack('GridView1','Edit$0')">Edit</a></td>
   <td>2</td><td>Fuller</td><td>Andrew</td><td>Vice President, Sales</td><td>
                        <input name="GridView1$ctl03$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl03$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl03_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$1')" mce_href="javascript:__doPostBack('GridView1','Edit$1')">Edit</a></td>
   <td>3</td><td>Leverling</td><td>Janet</td><td>Sales Representative</td><td>
                        <input name="GridView1$ctl04$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl04$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl04_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$2')" mce_href="javascript:__doPostBack('GridView1','Edit$2')">Edit</a></td>
   <td>4</td><td>Peacock</td><td>Margaret</td><td>Sales Representative</td><td>
                        <input name="GridView1$ctl05$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl05$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl05_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$3')" mce_href="javascript:__doPostBack('GridView1','Edit$3')">Edit</a></td>
   <td>5</td><td>Buchanan</td><td>Steven</td><td>Sales Manager</td><td>
                        <input name="GridView1$ctl06$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl06$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl06_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$4')" mce_href="javascript:__doPostBack('GridView1','Edit$4')">Edit</a></td>
   <td>6</td><td>Suyama</td><td>Michael</td><td>Sales Representative</td><td>
                        <input name="GridView1$ctl07$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl07$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl07_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$5')" mce_href="javascript:__doPostBack('GridView1','Edit$5')">Edit</a></td>
   <td>7</td><td>King</td><td>Robert</td><td>Sales Representative</td><td>
                        <input name="GridView1$ctl08$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl08$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl08_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$6')" mce_href="javascript:__doPostBack('GridView1','Edit$6')">Edit</a></td>
   <td>8</td><td>Callahan</td><td>Laura</td><td>Inside Sales Coordinator</td><td>
                        <input name="GridView1$ctl09$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl09$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl09_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$7')" mce_href="javascript:__doPostBack('GridView1','Edit$7')">Edit</a></td>
   <td>9</td><td>Dodsworth</td><td>Anne</td><td>Sales Representative</td><td>
                        <input name="GridView1$ctl10$TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'GridView1$ctl10$TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="GridView1_ctl10_TextBox1" />
                    </td><td><a href="javascript:__doPostBack('GridView1','Edit$8')" mce_href="javascript:__doPostBack('GridView1','Edit$8')">Edit</a></td>

So you can use Javascript to generated the TableRow and TableCell.   Here is the sample to show how to create TableCell. 

                var oCell1_1 = oRow1.insertCell(0);
                oCell1_1.innerHTML = '<a onclick="setValue(\''+ptPrefix+'a\')">'+ ptPrefix +'a</a>';
                var oCell1_2 = oRow1.insertCell(1);
                oCell1_2.innerHTML = '<a onclick="setValue(\''+ptPrefix+'b\')">'+ ptPrefix +'b</a>'; 
                var oCell1_3 = oRow1.insertCell(2);
                oCell1_3.innerHTML = '<a onclick="setValue(\''+ptPrefix+'c\')">'+ ptPrefix +'c</a>';

I hope this help.

Best regards,



Jonathan Shen
Microsoft Online Community Support
Please remember to mark the replies as answers if they help and unmark them if they provide no help.
10/22/2007 1:21:24 PM

Similar Artilces:

Cannot call a web service from java script using ajax in .net 3.5 web applications
As like 2005 .net websites i tried to consume a web service from client side java script  using Ajax script manager in  .net 3.5 (2008) version web application it was not working, Event it works with 3.5 web sites, What i have to do to solve the issue. Thanks in advance Hi, can you create the least amount of code to reproduce it and post it? This gives us the ability to check out your code and better guide you. Also please check out this article: Create a Simple WCF Web Service and Use In JavaScript With Visual Studio 2008 and .Net 3.5.  Grz, Kris.Read my blog. Handy Fire...

'web service call failed: 500' using ajax hovermenu and web service
Hi there, I'm using a hovermenuextender attached to a templatefield of a gridview, and everything seemed to work fine.. however I've moved on to add dynamic attributes to the hovermenu. Now I get the error "web service call failed: 500" in place of the output I want (on the hovermenu's panel). When accessing the web service I created (directly through the browser) everything works fine.. here's my hovermenuextender dynamic attributes DynamicContextKey='<%=eval("refnumber") %>' DynamicServiceMethod="GetS...

How to call a .net web service from another .net web service?
Hi all,I have developed two asp .net web services using visual studio .net 2003.I wish to call one web service from another web service.I tried adding a web reference of the web service in another web service and was able to do so.but i m not able to access the web methods provided by the web servicecould you please suggest a way to go about itExpecting quick replyThanxCharmy try to make sure that you reference it in the web reference and call it properly this is sample  [WebMethod()] public double CalcDistance(int x1, int y1, int x2, int y2) { Calculator.Service1 calc = new...

web service call failed: 500 using ajax hovermenu and web service with ascx file
I am using a hovermenu extender on an image button. The hovemenu extender calls a web service and returns back information that I write to the panel that displays. A portion of the code is below. This works when the Page is an aspx page but when I move it to an ascx page I get web service call failed. I do have the ascx page in a folder called controls/pages off of the root but both the default.aspx page and the bedinfo.asmx page are on the root. I don't think I have a path problem. I can include more complete code, there are actually 50 images with 50 hovermenu extenders and one p...

Ajax calls web service. Web service returns string nodes and 1 node of binary data...How?
I've been all over the place looking for some helpful clues with ASP.Net 3.5 and handling binary data returned to a client.  Initially it was a standard PDF this point, I'd be happy to see that Ajax ASP.Net sending back an image or sound file embedded as binary data within the XML/SOAP data sent back to the user.  Below is one of several variations that I've tried.  Any suggestions? 1.  User clicks a button on the web page.  The button calls a JScript which calls the web service. 2.  The web service sends back an XML/SOAP respon...

How to use JSON as the preferred data format for invoking Web Services from the client side.
in JavaScript use call like function OnPageLoad() {  NameSpaceName.ClassName.FunctionName(......Arguments......, FunctionNameAfterReturnToBeExecuted); } on Service [WebMethod(EnableSession = true)] public string FunctionName(..arguments..) { Bind Json string with JsonObjectCollection and JsonArrayCollection and return the object as String(); }   on JS function FunctionNameAfterReturnToBeExecuted(result) { if(result != null) {   var JsonObject = eval('('+ result +')');   for(var i = 0; i < JsonObject.JSONArrayName.length; i++) &nb...

Problem calling Web Service using the DynamicPopulate Extender
Hi, I'm quite new to ASP.Net AJAX so please forgive my ignorance.  I have downloaded and installed the RC1 version and am following through some of the tutorial videos.  I am having a problem with the Dynamic Populate Extender example.  I have created some asp controls with onclick events calling a javascript function.  From there I am attempting to use a dynamic populate extender control to call a web service - it's a function declared on that ASPX page as the tutorial explains in necessary and decorated with the System.Web.Services.WebMEthod AND System.Web.Script.Serv...

Troubleshoot Web Service; Ajax AutoComplete events do not appear to not fire; Ajax web service appears to not work. .NET
Folks, I had the situation that Ajax AutoComplete events in the web service did not fire after I copied a project out of a folder, renamed it and moved it to a server. The fix was hard to find but easy to solve. I had some web service modules in an ASMX file that provided AutoComplete entries -- i.e., after the user keys in 2 or 3 characters, the list of possible entries with those leading characters is displayed for the user to select. To solve the problem, look at the web service's directive, not the code-behind or the ASMX designer.  Do a right-mouse-click...

Should I use 'using' for every web service call on my client app?
Is the following code of any benefit, when calling a web service OR can it actually add to the overhead: using (localhost.Service sv =  new localhost.Service()) {  //Call the web method  }sun21170...

Consuming Web service from .net 3.5 web application using ajax
Hi , Before in .net 2005 ,I use to consume the  web service from client side via Ajax and java script. that's just adding web service inside the script manger services.But  it was not possible with .net 2008 version WEB APPLICATION   , Even it works well with .net 2008 web sites. Please help me to solve the issue. I have no idea what you mean. Please post the code that "does not work". NC...   I have the same problem.  I have a .NET 3.5 Web Application not Web Site.  I fully qualify the web service with the namespace i,e,  &n...

Microsoft AJAX Application Works On LocalHost But Not Web Host
I recently made some changes to a example site: The site functions correctly on my computer but when I upload it to a remotee server it does not.  I have tested it in both medium and full trust and it still does not work on a remote host. The URL of the page that I want to become the primary page is here:  The code for the web service calls and bridge is almost entirely based on the example here:  It works on my personal computer fi...

Can i setup endpoints in my web config so i can call my wfc ajax web service from both the client and the server?
I am having trouble setting up a webHTTPbinding endpoint and a wsHTTPbinding endpoint on the same site so i can call my web services from the client or server.  Seems to work fine i chose one or the other, has anyone else tried to do this?  Thanks for any help. Wayne...

send data from web service to local computer, using web services.
hii have a web application, on web server , and a database on my local computer in my office.i want to send data from my web pages to my local database.i think one way is using web services.i used that, but it has permission errors.that web service have this error :  Server Error in '/in' Application. Compilation Error Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately. Compiler Error Message: BC30180: Keyword does not name a type.Source Err...

Secure Ajax Client Web Service Calls??
Does anyone know if it is possible to write secure ajax web service calls from JavaScript?  I have an application that in the main uses UpdatePanels to present pay check data for multiple employees.  However i want to use JavaScript to get additional text from the database only when they hover over specific links on the page.  I could preload the text with the rest of the data via the update panels but I'd prefer to get it only of the intentionally hover over the link. I have the code working but I can not work out how to secure the call to the webb service to get the text.&n...

Web resources about - Bind data to the grid at the client side using AJAX call to web service -

Public Broadcasting Service - Wikipedia, the free encyclopedia
... such as PBS NewsHour , Masterpiece , and Frontline . Since the mid-2000s, Roper polls commissioned by PBS have consistently placed the service ...

APS Commissioner John Lloyd hits back at Andrew Podger claim that public service is 'cowering and weak' ...
APS commissioner John Lloyd hits back at claim that the public service has become 'weak' and 'lacking self-confidence'.

The Beatles music reportedly coming to one streaming service on Christmas Eve
When Apple Music launched back in June, it was noted that the music subscription service didn’t offer up the entire iTunes catalog with a few ...

Growth in Service PMI Shrinks Sharply
On Friday, the PMI Flash Services reading registered growth that fell sharply, not only well below the Econoday Consensus estimate of 56.1, but ...

This anecdote about the Washington Post shows Jeff Bezos' scary obsession with customer service
Amazon CEO Jeff Bezos is notorious for always putting the customers first. It's why he makes himself easily accessible by making his email address, ...

NYPD detective among 6 U.S. service members killed in Afghanistan
Detective Joseph Lemm was one of six U.S. service members killed in a suicide attack on a patrol near Bagram Air Base, the NYPD says

2015’s top e-learning and web services offers at Cult of Mac Deals
‘Tis the season to take advantage of soon-to-end deals, and boy have we got some good ones. These are the top five deals of the year on comprehensive ...

The Beatles may hit streaming music services by Christmas
The Beatles haven't exactly been in a rush to embrace the online music world there's iTunes, Rock Band and that's about it. However, they might ...

IBM to Couple AT&T's Managed App, Hosting Services With Its Cloud
IBM takes on AT&T managed application and hosting services; Google leans on Microsoft for its Angular 2 launch; Microsoft offers a mea culpa ...

OracleVoice: Don't Make These 5 Mistakes When Buying Cloud Services
When you buy cloud services, heed these five best practices in order to avoid pitfalls.

Resources last updated: 12/22/2015 9:12:21 AM