I'm using ASP.NET 3.5 + Ajax Control Toolkit + jQuery (NO MVC yet)
I'm looking for a standard solution for showing a user control (.ascx) as a modal popup (like the Ajax Control Toolkit ModalPopupExtender implementation), where I can pass parameters to it before it opens. Then get some values on closing, and potentially handle events on the server.
I'm currently using a combination of the ModalPopupExtender and update panel to implement this each time I need it. It seems like it takes too much plumbing that has to be created each time.
Before creating my own packaged solution, I'm looking for an existing solution, or for a better pattern to implement this.
I've always set a hidden field value on clientside. My modalpopups data would have parameters that would come from that hidden field. This works great when you update the updatepanel.
function setfield(v) {
document.getElementById('<%=HiddenField2.ClientID%>').value = v;
}
But maybe this solution isn't a best-practice.
It didn't take me too much time to do this. Let me dig up my own implementation.
EDIT:
In it's simplest form, this is what I used. I could drop this into a UserControl and then drop that in any page I wished to use it.
Trying to self contain pop ups which use the AjaxToolkit ModalPopUpExtender
Not sure if this is the part you're wrestling with though.
Related
I'm not really sure where or what to search for regarding the following question:
I have a TextBox control and a Label control on my page. I have a database query ready and I would like to run it on the TextBox textchanged event in order to display a "valid" or "not valid" text in the Label.
How can I achieve this without posting back the entire page on each textchanged event? I have installed the AJAX Control Toolkit and got the samples working but I don't seem to find an extender that would fit the bill. Any tips? Much appreciated, thank you.
Firstly, move away from the AjaxControlToolkit. This is for lazy web developers who dont know what they are doing.
Secondly, check out jQuery Ajax. Learn how to use it properly in order to do what you are needing to do.
Basically what you will need to do is post via jQuery Ajax to your page/webservice in order to run the database query. You can then return your data to the page and update the UI.
http://api.jquery.com/jQuery.ajax/
I have a web page devoloped in visual studio 2008.
I have 4 dropdowns and a repeater in the page.based on the selection(search criteria) from the dropdowns the repeater value will change.
and one dropdown selection will bind values to the other dropdown also.
Since the page is causing a lot of postback we decided to implement ajax here.
I am yet to learn ajax.
Can anyone tell what is the best way to do this .which ajax control replace dropdowns?
i have already server side code written on all dropdowns.
Please give me a good solution which i can implement in less time and reuse my code.
One more update: i have a master page used in the project.
I am using update panel of ajax which does not work if i use master page.
(That means all the dropdown controls and repeater i put it in update panel.But still page postback occurs.)
In a normal page(without master page) it works? why is this happening?
Thanks
SNA
You are able to use UpdatePanel and place dropdowns inside it.
Your solution will depend on the AJAX framework you choose, but here are cascading dropdown examples in ASP.NET AJAX and jQuery
If your main reason for using AJAX is to remove the number of postbacks you are getting, then I would recommend against using Microsoft's built in solution, e.g updatepanels.
The learning curve will be higher but learn to use jQuery, maybe with a little help from jTemplate to help you build your drop downs on the page.
Using updatepanels will not reduce your postbacks as behind the scenes asp.net is doing a full page life-cycle, sending all content back to your client but only updating the update panel. jQuery will be far more efficient. (and the reason I use it!!)
Update
If you don't believe me, see... Why Update Panels are dangerous
Update #2
If you don't want to go the whole way of learning Ajax just yet (although I'd recommend it) you could always pre-load your page with all the possible drop down combinations and then swap them using javascript / javascript + jQuery.
Here is one example of how you may do it -- use jQuery for dependent drop down combos
Using this method you are more likely to be able to save the code you've already written to work out the drop down options.
I currently have a simple form that when you click the "save" button will persist it to the database.
I would like to use JQuery to do the callback for me and popup a "Save completed" div window/div of some sort.
My only problem is how do I call the btnSave_Click() event from JQuery?
If I use PageMethods the method would have to be static and therefore lose access to my textboxes and other page controls?
Thanks,
Goosey
Are you explicitly trying to avoid passing the values of the input controls? because that would be much easier.
Using a lightweight jQuery call to do the post but then expecting a full control hierarchy in the code behind to pull data out? What's the intent here? If you require that, it would probably be easier just to submit the page, and register javascript to run to pop the success message up on load.
Personally, I think the page method route and $.ajax or $.post is a much cleaner, separate way to solve the issue. That way you can just show the popup as part of the success callback.
You can use onClientClick
Have a look at the jQuery Form Plugin, it can change existing forms into Ajax forms.
You need to set __EVENTTARGET to the id of the control that you want to simulate causing the postback if you want to use the same handler. I seem to recall having to replace the underscores with dollar signs as well, but I could be wrong on that. The hidden inputs, __EVENTTARGET and __EVENTARGUMENT, are used by the framework to identify which control caused the postback. There's a nice discussion of the server side issues in this blog post, though it doesn't talk about AJAX. Google for __EVENTTARGET and postback for more info.
I have a page with a number of ListViews that I want users to be able to sort and page through. Rather than postback and rebind the entire page each time, I would like to do it via jQuery/AJAX selectively for the control in question. I am comfortable making the client-side call to a WebMethod in my page - my question is how do I get the returned data back into the ListView via jQuery?
(Note: I don't want to use an UpdatePanel!)
I'm not sure if it'll actually be achievable to update a ListView without a postback, just because of the underlying data model of the ListView control.
You're best option to having a complete AJAX solution would be to use a JavaScript templating engine. I've done a demo on my blog using jTemplates and the MS AJAX Library v4 preview - http://www.aaron-powell.com/blog.aspx?id=1209
But despite common belief you can use an UpdatePanel and have it efficient, I also looked at that here: http://www.aaron-powell.com/blog.aspx?id=1195. The biggest thing to keep in mind when using UpdatePanels is ViewState. If you don't need ViewState saved on a control make sure it's turned off. You can really reduce your post-load by doing that. Also removing whitespace will help.
OK, I am not sure if the title it completely accurate, open to suggestions!
I am in the process of creating an ASP.NET custom control, this is something that is still relatively new to me, so please bear with me.
I am thinking about the event model. Since we are not using Web Controls there are no events being fired from buttons, rather I am manually calling __doPostBack with the appropriate arguments. However this can obviously mean that there are a lot of postbacks occuring when say, selecting options (which render differently when selected).
In time, I will need to make this more Ajax-y and responsive, so I will need to change the event binding to call local Javascript.
So, I was thinking I should be able to toggle the "mode" of the control, it can either use postback and handlle itself, or you can specify the Javascript function names to call instead of the doPostBack.
What are your thoughts on this?
Am I approaching the raising of the events from the control in the wrong way? (totally open to suggestions here!)
How would you approach a similar problem?
Edit - To Clarify
I am creating a custom rendered control (i.e. inherits from WebControl).
We are not using existnig Web Controls since we want complete control over the rendered output.
AFAIK the only way to get a server side event to occur from a custom rendered control is to call doPostBack from the rendered elements (please correct if wrong!).
ASP.NET MVC is not an option.
Very odd. You're using ASP.NET server controls and custom controls, but you're not using web controls? And you're calling __doPostBack manually?
Do you like to do things the hard way?
If I was still using the server control model rather than MVC, I would slap ASP.NET Ajax controls on that sucker and call it a day. What you're doing is like putting a blower on a model T. It may be fun and interesting, but after you're done with all the hard work, what do you really have?
I have been doing some more digging on this, and came across how to inject Javascript in to the client when required. This will obviously play a huge part in making the controls more responsive and less round-trips to the server.
For example: RegisterClientScriptBlock.
Look forward to playing with this more, feel free to get invovled people!