6 Replies - 9214 Views - Last Post: 19 September 2012 - 08:25 PM Rate Topic: -----

#1 November-06  Icon User is offline

  • D.I.C Regular

Reputation: 46
  • View blog
  • Posts: 391
  • Joined: 04-January 11

How to Set Gridview DataSource from JavaScript

Posted 12 September 2012 - 02:35 AM

I want to bind a datasource to the gridview on client-side.

I have read similar articles on how to do this from the following sites:

http://weblogs.asp.n...ing-jquery.aspx

http://www.aspdotnet...-jquery-or.html

I tried to use the codes but no data is displayed. In the second URL, there is a code to display alert on error and that's what I get when I run my codes. I am not sure what the error is though. Does this mean document is not ready? I'm not really sure what causes the error.

The only difference I saw was the script they referenced.

The first used <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
while in the second, it's <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

I hope someone could help me.

This post has been edited by November-06: 12 September 2012 - 02:38 AM


Is This A Good Question/Topic? 0
  • +

Replies To: How to Set Gridview DataSource from JavaScript

#2 rgfirefly24  Icon User is offline

  • D.I.C Lover
  • member icon


Reputation: 262
  • View blog
  • Posts: 1,460
  • Joined: 07-April 08

Re: How to Set Gridview DataSource from JavaScript

Posted 12 September 2012 - 11:58 AM

have you tried changing the alert("Error") to alert(result) to see what is returned? that will clue you in to why it doesn't work. Beyond that we need to see some code in order to identify what you might have missed.
Was This Post Helpful? 0
  • +
  • -

#3 November-06  Icon User is offline

  • D.I.C Regular

Reputation: 46
  • View blog
  • Posts: 391
  • Joined: 04-January 11

Re: How to Set Gridview DataSource from JavaScript

Posted 12 September 2012 - 06:13 PM

I found what I missed.

My method for the WebMethod is not static.

I tried creating a simple application and it works but is there any way I can fill my gridview with javascript without having to make my method static?

The reason that I cannot declare it static is because the data that will be used as a datasource will be depending on text inside some textboxes and a viewstate. Whenever I make my method static, the textboxes and viewstate were underlined blue and I get this error:

An object reference is required for the non-static field, method, or property

What should I do about this?

This post has been edited by November-06: 12 September 2012 - 06:19 PM

Was This Post Helpful? 0
  • +
  • -

#4 November-06  Icon User is offline

  • D.I.C Regular

Reputation: 46
  • View blog
  • Posts: 391
  • Joined: 04-January 11

Re: How to Set Gridview DataSource from JavaScript

Posted 19 September 2012 - 07:42 PM

I already changed the WebMethod to static and used static variables instead of ViewState.

I got the program working but there are still some errors.

The program I am doing has a table in its main page. Depending on the cell that is clicked, a window will be displayed containing a gridview of details.

So what I did is...

On the onclick event of the tablecell, it calls a javascript which calls a WebMethod, passes parameters to the WebMethod, then retrieves an XML that will be the source of the gridview. It works for some cells but there are cells that returns the error, 'undefined'. I googled it and some said it might be a server error.

The code I have so far is...

<script type="text/javascript">
                function readCellSelection(cell,region,plant){
                    tabContainer = tabcntReport.control; 
                    var ActiveTab = tabContainer.get_activeTab();
                    
                    var shipment = new Object();
                    shipment.Cell = cell;
                    shipment.Region = region;
                    shipment.Plant = plant;
                    shipment.ActiveTabID = ActiveTab.get_id();
                    $.ajax({
                        type: "POST",
                        url: "TRCIView.aspx/RetrieveData",
                        data: "{'shipment':" + JSON.stringify(shipment) + "}",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: OnSuccess,
                        failure: function (response) {
                            alert(response.d);
                        },
                        error: function (response) {
                            alert(response.d);
                        }
                    })
                    wdwShipmentDetail.Open();
                }
            </script>



The error undefined is from the error: and not from the failure:

Error shows in a few cells only. And if I refresh the page and try it again, the error occurs on the same cells.

At first, I thought, maybe the error occurs on cells with larger data but this doesn't seem to be the case.

The first error occurred at the cell expecting 600,000 shipments.
The cell with 202,000 shipments is fine.
The cell with 157,000 shipments, which is lesser than 202,000, also has an error.
Most cells do not have this error.

This is my first time calling a WebMethod from client-side and my first time working with json so I do not have an idea of what to look for.

Any ideas of what have caused the error and what should I do about it?
Was This Post Helpful? 0
  • +
  • -

#5 November-06  Icon User is offline

  • D.I.C Regular

Reputation: 46
  • View blog
  • Posts: 391
  • Joined: 04-January 11

Re: How to Set Gridview DataSource from JavaScript

Posted 19 September 2012 - 07:49 PM

I also tried changing alert(response.d) to alert(response) and it showed '[object Object]'

I don't know what it means though.
Was This Post Helpful? 0
  • +
  • -

#6 November-06  Icon User is offline

  • D.I.C Regular

Reputation: 46
  • View blog
  • Posts: 391
  • Joined: 04-January 11

Re: How to Set Gridview DataSource from JavaScript

Posted 19 September 2012 - 08:09 PM

I googled it some more and found a way to show a more detailed error message.

So I changed my code to this:

error: function (response,status,error) {
   alert(response.responseText + '; ' + error);
}





It shows the error:

Error during serialization or deserialization using the JSON JavascriptSerializer. The length of the string exceeds the value set on the maxJsonLength property.
Was This Post Helpful? 0
  • +
  • -

#7 November-06  Icon User is offline

  • D.I.C Regular

Reputation: 46
  • View blog
  • Posts: 391
  • Joined: 04-January 11

Re: How to Set Gridview DataSource from JavaScript

Posted 19 September 2012 - 08:25 PM

I got it working with the suggestion from this site:

http://playgroundsunshine.com/?p=188
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1