Advertisements

Archive

Archive for the ‘AngularJs’ Category

AngularJS With Asp.net Web API: $http post returning XMLHttpRequest cannot load: Response for preflight has invalid HTTP status code 405

November 7, 2017 Leave a comment

When trying to POST json to Asp.net web api server using $http its returning the following error

Response for preflight has invalid HTTP status code 405

OR

MVC web api: No ‘Access-Control-Allow-Origin’ header is present on the requested resource

Following is the solution for above problem

Cors

I installed Cors in my project using nu-get command line

Install-Package Microsoft.AspNet.WebApi.Cors

and added the following code in WebApiConfig.cs file from App_Start folder.

var enableCorsAttribute = new EnableCorsAttribute("*",
                          "Origin, Content-Type, Accept",
                          "GET, PUT, POST, DELETE, OPTIONS");
config.EnableCors(enableCorsAttribute);

and removed the following from the web config

<remove name="X-Powered-By" />
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Accept, Content-Type, Origin" />
<add name="Access-Control-Allow-Methods" value="GET, PUT, POST, DELETE, OPTIONS" />
Advertisements

Create duplicate row in AngularJS


Hello Friends here I am explaining an example of how to add duplicate row in AngularJS

Please check below link for complete example

https://jsfiddle.net/rahulgbhatia/06nda8jo/

Hope it helps !

 

 

Disable click outside of bootstrap model area to close modal


Problem :You can close the modal by clicking on the background. Is there anyway to disable this feature? On specific modals only?

Solution :

There is option called backdrop. Passing this option with value 'static' will prevent closing the modal.
Also can pass {keyboard: false} to prevent closing the modal by pressing Esc.

[1] If you opening the modal by js use:
$
('#myModal').modal({backdrop: 'static', keyboard: false})

[2] If you are using data attributes, use:
<button data-target="#myModal" data-toggle="modal" data-backdrop="static" data-keyboard="false">
    Launch demo modal
</button>`

 

 

AngularJS: Get selected Text and Value of HTML Select DropDownList using ng-change


The below HTML Markup consists of an HTML DIV to which ng-app and ng-controller AngularJS directives have been assigned.

The HTML DIV consists of an HTML Select DropDownList which will be populated from JSON array using ng-options directive.

The HTML Select DropDownList has been assigned ng-change directive. When an option is selected in HTML Select DropDownList then the GetValue function of the Controller gets called.
Inside the function, first the selected Value is fetched from the ng-model attribute and the selected Text is fetched from the JSON array using jQuery grep function.
Finally the selected Text and Value is displayed using JavaScript alert message box.

2016-06-21_1554

AngularJS Form Validation – Disable Submit / Confirm Password Custom Directive

January 21, 2016 Leave a comment

Bootstrap collapse: Change display of icons and text

December 17, 2015 Leave a comment

To Change display of icons and text for bootstrap Collapse use following

http://jsfiddle.net/rahuladmin/s52h0sbj/

Hope this help !

Vertically centering Bootstrap modal window

December 16, 2015 Leave a comment

To open the bootstrap modal popup in the center of screen use following code

http://jsfiddle.net/rahuladmin/07y8y5fg/

 

Hope this help !