How to use jquery form plugin with asp.net?

Question

in asp.net 2.0 (not mvc), the form action is for itself. How can I use the forms plugin to send information to the server? I need to send data from the form (say, name, email address, comment) and display the result on the client side. Any ideas?

Thanks Dave

Answer 1

ms ajax? if i use update panel i don't need jquery. I want to use only jquery and form plugin (plus validation plugin). no microsoft ajax for me, thanks! just look at the traffic they produce in firebug to see why.

Answer 2

It depends on how much asp.net you want to use when submitting the form. I use the forms plugin in the same way, but you need to think about a more classic web model.

There is a “submit” in the forms plugin that does not contain any viewing information. That is, if you try to get such a value

sName = txtName.text

The text for txtName will be empty. But if you use your request object, you can drop the value if you know that this UniqueID control

sName = Request.Form (txtName.UniqueID)

Then what I would do is use the plugin extension of the form: callback to start an ajax call that will cancel your results. You can use ms ajax WebMethods for this, and you can call web methods directly from jquery without the need for ms script manager. In this case, WebMethod returns the html that I want to display on the page.

$(form).ajaxSubmit(function(){ success:function(ret){ $.ajax({ type: "POST", contentType: "application/json; charset=utf-8", dataType: "json", data: "{}", url: "SomePage.aspx/SomeWebMethod", success: function(msg){ $('#somediv').html(msg); } } }); 

More info on ms ajax call with jquery here

Answer 3

Due to the fact that viewstate is closely related to the form in ASP.NET, if you have not configured the service to accept the request, I’m not sure that this will be possible. If you do not want to use viewstate, you can simply use the regular HTML form on the aspx page and submit it to a service that returns the expected results.

When you submit an asp.net form for postback, it submits everything back through the page life cycle, I don't think there really is anything to the ajax jQuery request. You can set up WebMethod on a page that essentially provides a service, and you can get a jQuery request to talk to it, but I didn't think it would work.

However, you can do ASP.NET AJAX with MS libraries without using UpdatePanels, see this article for a good description of how you can work with WebMethods and ajax javascript libraries

Answer 4

I am currently using a combination of asp.net and jquery and a way to solve page lifecycle issues, and it just doesn't use the autopostback and asp.net buttons to submit the form.

I use either ajax calls attached to simple html buttons, or when I really want to send the whole page, I use the javascript __doPostBack function (eventTarget, eventArgument).

These articles have been helpful to me:

• Understanding JavaScript __doPostBack
• Call __doPostBack in javascript

Answer 5

Today I ran into this problem and eventually decided to use it with the following combination of hacks:

Suppose you have a search page and a results page, and you have a form on the search page that you want to publish on the results page, and load using ajax using the jquery forms plugin. You need to do the following:

• Create the Search.aspx page and the Results.aspx page

• ASP.NET web pages have one form on the page with the aspnetForm id and id, but the action will always be configured to send to itself, so the first thing you need to do when you load the Search.aspx page is to change the aspnetForm action as Results.aspx in the following way:

  $ ('# aspnetForm'). attr ('action', 'Results.aspx');

• Then you need to deal with viewstate so that when you submit POST from Search.aspx to Results.aspx you will not get invalid view errors. To do this, simply remove the viewstate variable from the page as follows:

  $ ('#__ VIEWSTATE') remove () ;.

• then you should be able to configure #aspnetForm to use the jquery forms plugin as follows:

  $ ('# aspnetForm') ajaxForm ().

This allows you to publish Results.aspx in a web form. This is only the beginning when you go in the right direction, but basically it comes down to the need to change the action that needs to be written in aspnet form, and then delete the viewstate.

Answer 6

VS08 doesn't seem to work for you, but others might be interested: The other day, I went to the MSDN Roadshow, which seemed to make it very easy. Scott Gu's blog has the following: http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs-2008.aspx

Answer 7

This does not work, because ASP.NET forces you to put everything within the server form while you use server control (the way it handles the postback). The main problem you are faced with is that HTML does not allow a nested form in any way, so you cannot even use jQuery to find a form element (this is my experience with FF3)

A good answer (but hard to achieve) is to throw away WebForm and use MVC.

A compromise solution - I myself made a small plugin that converts a div into ajax submit with a div being abused using the = "post" method and action = "url", and then use the jQuery Form Plugin to serialize using the plugin template. It does not download files (since this requires an IFrame, I think it is still possible, but take a little more hack). The code is in my client project, so I still do not have permission to publish it as a plugin. However, I think this is not too difficult to do if you know the theory :)

Indeed, next time try to answer a good answer (get rid of WebForm). Not only will its jQuery Form hurt you, the more pain you must take if you decide to make jQuery + Web Form, if this is not my requirement for the client, I would never go that route.