ASP.NET WebForms with Angular Postback

Question

im trying to use Angular framework in existing ASP.NET WebForms application and problem i ran into is this:

Client side code:

<select id="fooSelect" class="span8" runat="server" clientidmode="Static">
 <option ng-repeat="foo in foos" value="{{foo.Id}}">{{foo.Title}}</option>
</select>

When form gets submited (whole page postback), value of fooSelect.Value is "{{foo.Id}}"

How to get value of selected option on server side?

IUnknown · Accepted Answer · 2013-10-21 11:07:13Z

6

You can't use angular for server select tag. Actually, selected option value computed on server on postback. So as you have value="{{partner.Id}}" in markup, you getting exactly this value. In my opinion you can use plain select element without runat="server" attribute and bind selected id to hidden field, accessible on server-side:

<select ng-model="partner" ng-options="p.Title for p in partners" >
    <option value="">--Select partner--</option>
</select>
<br />
<input type="hidden" id="selectedPartnerId" runat="server" ng-value="partner.Id" />

answered Oct 21, 2013 at 11:07

IUnknown

22.5k4 gold badges41 silver badges71 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

aron Over a year ago

This is not most elegant solution but it works, i will wait to see if there is some better solution, if not, will mark your answer as correct. Thank you

pyccki Over a year ago

@Yuriy, I use the same technique if i need to Inject/Modify new values in Select element using Js/jQuery. on change i use Hidd input with runat=server, so i can read values on server side.

Chandermani · Accepted Answer · 2013-10-21 10:24:04Z

1

ASP.Net is not a good candidate for integration with AngularJS (and maybe other SPA). The abstraction against which ASP.Net is build makes it nearly impossible to leverage any capability of Angular such as routing or data binding.

ASP.Net dynamically generates content, which you don't have much control over. It would generate contains (like span), dynamic client ids an all to keep the data in sync and detect changes on the server.

I seriously doubt, if one can achieve data-binding in AngularJS for content generated with ASP.Net. The best that can work would be input type binding with ng-model and getting that data on the server with postback.

I highly recommend you to switch to ASP.Net MVC

answered Oct 21, 2013 at 10:24

Chandermani

42.7k12 gold badges88 silver badges89 bronze badges

4 Comments

aron Over a year ago

Im sorry but this is not valid answer to my question, i really cant switch to MVC and i dont want to use Angular routing. I need solution to this particular problem

Lereveme Over a year ago

I'd say this is a valid comment to make on the issue. They do not integrate will because of some of the items noted by @Chandermani. However in ASP.NET you can override how controls are rendered to the page but that option is difficult and often does more harm then good.

Adrian Hedley Over a year ago

You can use ASP.NET web API to interface with Angular. Data is returned in JSON format by default from ASP.NET Web API and can be consumed from angular or jquery on the front end.

E Brown Over a year ago

I think this answer should clarify that it is ASP.Net WebForms that is not a good candidate for integration with Angular JS. ASP.Net is a broad technology, including, among other things, ASP.NET MVC, which does play nicely with Angular.

Collectives™ on Stack Overflow

ASP.NET WebForms with Angular Postback

2 Answers 2

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related