Trouble binding to repeater through ajax call - asp.net

I have a user control that contains a repeater, which in turn is nested in a default.aspx. When a user clicks a specific link on the page, the ajax post function is called which posts data to a method on default.aspx. All good so far! This method then calls a method within the user control, passing in the data, which in turn is used to requery, and rebind the repeater.
For some reason, the page bails when I try to do this last part?
If this seems converluted, it's because it doesn't seem possible in jquery to directly access user control methods.
Many thanks.

Rebinding a repeater control, which is an ASP.NET server control, is done on the server side, not the client side. If you want some grid behavior with ajax I suggest you look at a javascript based grid like for example jqGrid.

Related

Javascript within a user control in an UpdatePanel not running

I have a webform which contains some LinkButtons.
When each LinkButton is clicked I want to load a different UserControl.
I also want to do it with Ajax.
I tried it in two ways as described here and here
[Both approaches use an UpdatePanel, the first adds the user control and changes its Visible attribute, the second uses LoadControl function]
Both works (upvoted them!) but I still have a problem-
I can't run javascripts within the user controls...
It doesn't recognize any function
When the user controls were added not dynamically it all went well
The only workaround I found was to move the javascript from the user control to the page but that's not nice...
Also tried this with no luck
Any help will be appriciated
For asynchronous requests use ScriptManager.RegisterStartupScript method

How can I update a DataSource in runtime?

I have a dropdown list which retrieves data from a datasource. I must to update the dropdown when I add new data to the database through another page. I've not found documentation for this kind of updating, that would be like the requery method on DAO databases for VB6.
it really depends on how you have designed your page, you could refresh the page with a refresh button or with the refresh of the browser or even via JavaScript which reloads your page every x minutes, then you will query again everything because the page will have a full life cycle again.
if you want to do more sophisticated things you can of course use Ajax ( PageMethods or UpdatePanel approaches ) to have a partial render.
Using the databind method for the dropdown will force the update of the control. But the combo will be updated only when the page is reloaded. Maybe the best way should be using Ajax...

ASP.Net Web Form + Ajax Data lost on post back. Possible cause ? Ajax or changing visible property

I have two Repeater controls, each hosted in a user control. Both user controls are contained in the same aspx page. Only one User Control is visible at any one time. The repeaters are comprised of checkboxes, and text boxes for user input.
The aspx page is configured with an Ajax ScriptManager; and contains several Ajax UpdatePanels. These UpdatePanels result in partial page post backs when text is changed in a textbox control in controls on the aspx page (this is not the behaviour for the Repeaters in the User Controls). Through use of several AsyncPostBackTriggers, various controls contained in the other UpdatePanels on the page have their content refreshed in response to the partial page post backs they are configured be notified about.
Depending on a radio button group selection, I set the visible property to true or false – as appropriate for the User control containing a repeater control. The Repeater control is then populated with data using databinding. All of this works.
However, when the Submit button is clicked, the Repeater control contains no data.
Given that I am not dynamically adding the Controls containing the Repeater controls (but using Visible true / false). I would have thought that the State of the fields and the data in the visible control would be preserved during the post back.
The User Controls are contained within the UpdatePanel that contains the Submit Button.
I have explicitly Enabled View state without any effect.
Am I correct in assuming that I should not have to do any explicit handling of data changes the user makes (via client side script and manipulation of an Data Structure Representing the Repeater Data); and the View State should maintain the data I need to access on the server when submitted?
I do not believe that it is the User Control visible state changes that are causing the issue because when the page is initially loaded on of the User controls is populated with dummy rows (so it displays).
I am suspicious that because the visible state of the controls is changed during partial page post back, that the Page View State ends up with no knowledge of the User Control and therefore cannot track its data (or changes).
I have investigated a lot of similar sounding posts but so far do not feel that I have come across a solid explanation that can help me understand and fix the issue.
Hopefully someone can help.
I must be the only person who was unaware of the finer points of DataBind() method; be it called on a specific control being bound to data; or on the page itself. I hope the below helps others who find themselves in a position where data binding appears to be inexplicably lost'.
My problem was that my page was pretty complex. It has several User Controls on it. The problem was that in these User Controls, I was calling Page.DataBind() in the Page_Load event handler to 're-bind' the page data on PostBacks. This resulted in the Repeater control located on another User Control, to lose its data binding.
Removing the Page.DataBind method call from each of the User Controls on the Page_Load event handler method resolved the problem. It had nothing to do with Update panels / refreshes etc.

jQuery/AJAX redirect?

Ok, this is a bit different scenario. I guess I would have to think about doing it this way sort of with MVC anyway if we were actually using MVC...but we're not at the moment.
So I've got and .aspx page. In that .aspx page is a user control (.ascx). And in that user control is a custom control (.cs).
The custom control has a repeater in it. So I'm showing a list of items on that .aspx through the .ascx's custom control. For each item in the repeater is a button. It's just a hyperlink, just a regular on my page
When you click that button, it redirects to whatever page you're on. Since the custom control never knows what your parent .aspx page is, I'm doing a redirect to the self .aspx by doing a Response.Redirect(Request.Path). So that way it always redirects to whatever .aspx is using that user control and custom control.
So after it redirects to self, I check the querystring in the page_load of whatever .aspx is using it. If the value is true, then I handle it however the .aspx wants to. In this case when it's true, I call a method in the code behind of my .aspx that handles the action for the button. For example lets say that button was "Add to Shopping Cart", the .aspx handles that action and calls a AddToCart method in the .aspx.cs.
I'm not using an ASP.NET control for the actual hyperlink and button because I just don't need it and in my particular case I'm using a user control and a custom server control. For this instance, I had some issue where I didn't wnat to use an ASP.NET control...I forget why but the point is, no this is what it is.
So with that, I'm trying to figure out how I can apply some AJAX here call to call that method instead. I still need to somehow redirect again back to the same page like I'm doing...I'm doing the redirect in that method after all the logic at the end. I am redirecting again back to the same page, because I need my Page_Load methods in my .aspx and also in an .ascx to still fire off after that method is completed.
So I am not sure where to start on this. Let me go through this once again:
Custom control has a repeater in it and in the repeater, each item has a standard HTML hyperlink (non ASP.NET control) which wraps a standard image tag (image is a button)
User control contains the custom control
The .aspx page contains the user control
User clicks the button and hyperlink redirects them to the parent .aspx page that is using this custom control...so it calls Response.Redirect(Request.Path)
In the code-behind of this .aspx, in my page_load I check a querystring flag to see if I performed that action..meaning user clicked that button. For example one of the querystring params is "AddItem" and another querystring param is "itemID". If movedItem is true, then I fire off a method called MoveItem(int itemID)
Method MoveItem is called
Method MoveItem redirects again back to this same .aspx using Response.Redirect(Request.Path).. this is so that the page load is hit again as well as my .ascx page load is hit. Because in both those page loads, I rebind a repeater so I can show the latest state of the lists. I call a method in my .aspx page_load which rebinds a grid and then page_load in my .ascx also calls another method which rebinds some other list
You can use $.get() to pass the variables to a server-side method that performs any server-side functions you need. You don't need to run page_load or have a code behind.
If you only need to update the HTML in the client's browser then you can use jQuery to add/remove them from the lists in the HTML. You can use the html() function in jQuery to append the item to the list.
You should look at DataTables.net as you can build a client side, editable grid that will perform Ajax updates as well. You would be able to keep your repeater control, but eliminate all the back and forth to the server and the deciphering of clicks and coordinating between Page_Load and etc. Here is a good post from Dave Ward(Encosia) that covers jQuery, Page_Methods and repeater controls.
If you want to preserve your work so far, why not try Ajax Update Panels around the region that you do not want to visible "refresh"?
Remember that the first A of AJAX is asynchronous. You'll want to avoid having your button reload the page, of course. Something like:
Figure out the data you need to send to your "add to shopping cart" handler page -- part number (SKU, etc.), colors, sizes, quantity, etc.
Ensure this data is on every applicable page, in an identical fashion: perhaps one or more hidden input elements, or even from the page URL.
Replace the custom control hyperlink/button href with a [client side] onclick handler instead, which will get the data from step 2 and send it via $.ajax() (or $.post or $.get), specifying the response handlers. You probably want to disable the button or give other visual feedback to avoid duplicate clicks.
In the response handlers, update the shopping cart section of the page with the number of items or indicate success or failure.

ASP.NET Dynamic Page Controls: Is it possible to bind events AFTER Page.Load?

I have a site that I am currently working on in ASP.NET 2.0 using the usual WebForm stuff and ASP.NET AJAX 1.0. Is it possible to bind an event to a dynamically created control after the Page.Load event?
I have a table <td> element that I am dynamically creating similarly to this code:
' Create Link Button
lnk.ID = String.Format("lnkDetails_{0}", dr("Id"))
lnk.Text = dr("Name").ToString()
lnk.CommandArgument = dr("Id").ToString()
AddHandler lnk.Click, AddressOf DetailsLink_Click
cName.Controls.Add(lnk)
This this code is looped over for each row in a database (and of course more cells are added to the table, including an ImageButton with an event. The events work flawlessly when I execute this code during events leading up to and including Page.Load. I need to be able to fill this table with current data, which is updated during a btnClick Event elsewhere on the page, which occurs after this Page_Load event, so I am populating with old data. If I change this code to Page.LoadComplete, events stop working.
This data is a summary display of various components of an application, things like somebody's name, which when updated on a 'detail' form, updates the database by partial postback (a requirement), then it needs to show the update in this 'summary' section after an update. Currently it takes 2 postbacks to actually see the change in the 'summary' section, so effectively the summary is 1 step behind the changes (clear as mud?)
What would be the best way for me to populate this table with current data (which is available during/after Page.LoadComplete), but still have an event fire when a link is clicked (the event causes an UpdatePanel to display the 'detail' form).
I also have jQuery at my disposal and the usual ASP.NET AJAX methods, also javascript is a requirement for the website, so I do not need to degrade for unsupported browsers.
This is my first ASP.NET web application and need some help figuring out the best way to make this happen (I'm well versed in PHP, Django and the usual ways to do web forms - things like having multiple forms on one page o_O).
Update:
There really isn't a good way to bind control events to controls after Page_Load. The overall architecture of the pages is there is one ASP.NET form encompassing the entire page, there is only 1 aspx page. I am using master pages (however it doesn't have any obvious implications to my issue).
The page is split into a left and right 'pane', the left is a summary of all the data (in an update panel), the right 'pane' has 6 'tabs' implemented each as their own user control, each with several form fields and an update button all in it's own UpdatePanel.
An update on any of these tabs only refreshes the summary panel (UpdatePanel.update()) and its own panel. The 'refreshing' and event binding of dynamic controls of the summary from the db happens during Page_Load and the Update Button event updates db data. (The control event happens after Page_Load). I want to avoid doing a double post to get the summary to update, any thoughts are helpful.
You need to postback the whole page after your data changes in the 'btnClick Event elsewhere on the page'. It sounds like you have an UpdatePanel and it sounds like this is catching the postback of your btnClick event handler. Put the btnClick outside the UpdatePanel or change its triggers so that your btnClick forces a postback/refresh of your data. Or, redesign your table so it's AJAXly-refreshed when you click on btnClick, it's hard to get you more details without knowing more about the structure of your page and controls.
Good luck!
You can bind to an event whenever you want. It's just a simple event after all. But not all places might be suitable because you have to take into account when the event fires. And in most cases this happens between Page_Load and Page_PreRender. That includes the click event on a LinkButton. In general, I would recommend to add your dynamically created controls in the Page_Init stage.
You have to add the controls before Page.Load in order to maintain ViewState between postbacks, so use the OnInit event handler for that.
But once they're added, you should be able to bind event handlers (such as OnClick) at any point during or after the Page.Load... for example in your grid's ItemDataBound (or something like) or in the Page.PreRender.

Resources