I am working on a project where I am getting list of the offers from a service.
Each offer is Active or Inactive. I am displying only Active offers on a view on tabular format by giving ajax call and using ng-repeat.
When I click on the link Inactivate Offer
then I am giving another ajax request to inactivate that offer in database. So once I inactivate offer it should not be displyed on view.
My code to fect offer and Inactivate the offer is :
mPosServices.factory('mosServiceFactory',function($http,$rootScope){
return{
viewAllOffers:function(){
var allOffers = $http({
method: "get",
url: "http://myServiceUrl/omnichannel/merchant/offer/view/all?enrollmentId="+$rootScope.enrollMentId,
});
return allOffers;
},
inActivateOffer : function(id){
var inactivate = $http({
method:'get',
url : "http://myServiceUrl/omnichannel/merchant/offer/"+id+"/status/INACTIVE?enrollmentId="+$rootScope.enrollMentId,
});
return inactivate;
}
}
});
and controller code is to fect the offers and inactivate offer is :
var mPosController = angular.module('mPosController', []);
mPosController.controller('offerController', ['$scope', '$rootScope', 'mosServiceFactory', 'ngDialog', function ($scope, $rootScope, mosServiceFactory, ngDialog) {
mosServiceFactory.viewAllOffers().then(function (data) {
$scope.offers = data.data.offers;
console.log($scope.offers);
});
$scope.inActivate = function (id) {
mosServiceFactory.inActivateOffer(id).then(function (data) {
console.log(data);
});
}
}]);
Offer is getting successfully inactivated in response of $scope.inActivate method but that perticular offer is still visible in view.
So how to display on Active offers once I inactivate a offer using service call ?
Your code correctly performs a GET request to inactivate the offer, however you do not "tell" Angular that the offer has been inactivated. What you need to do is remove the offer from the offers list $scope.offers once the offer is successfully inactivated (ie. when the inActivateOffer promise is resolved). You could try something like this:
$scope.inActivate = function (id) {
mosServiceFactory.inActivateOffer(id).then(function (data) {
for (var i = 0; i < $scope.offers.length; i++) {
if ($scope.offers[i].id === id) {
$scope.offers.splice(i, 1);
}
});
}
Related
I have been trying to load return a JsonResults action from a controller in MVC using ajax call. I can see that the alert() function is triggering well but the ajax is not executing. I have search for several sources but to no avail.
public JsonResult FillBusinessLicenceL3(int? selectedID)
{
var bl3_Items = db.LevelThreeItems.Where(l3 => l3.LevelTwoItem_ID == selectedID);
return Json(bl3_Items, JsonRequestBehavior.AllowGet);
}
The below too is the javascript calling for the json method.
<script>
function FillBussLicence_L3items() {
alert("You have clicked me");
var bl2_Id = $('#BussLicenceL2_ID').val();
//alert(document.getElementById("BussLicenceL2_ID").value);
alert(bl2_Id);
$.ajax({
url: 'StartSurvey/FillBusinessLicenceL3/' + bl2_Id,
type: "GET",
dataType: "JSON",
data: "{}", // { selectedID : bl2_Id },
//contentType: 'application/json; charset=utf-8',
success: function (bussLicence_L3items) {
$("#BussLicenceL3_ID").html(""); // clear before appending new list
$.each(bussLicence_L3items, function (i, licenceL3) {
$("#BussLicenceL3_ID").append(
$('<option></option>').val(licenceL3.LevelThreeItem_ID).html(licenceL3.LevelThreeItem_Name));
});
}
});
}
Also, I have tried this one too but no execution notice.
Thanks a lot for your help in advance.
After looking through the browser's console, I noticed that the LINQ query was tracking the database and was creating a circular reference so I changed the query to the following and voila!!
public JsonResult FillBusinessLicenceL3(int? selectedID)
{
var bl3_Items = db.LevelThreeItems.
Where(k => k.LevelTwoItem_ID == selectedID).
Select(s => new { LevelThreeItem_ID = s.LevelThreeItem_ID, LevelThreeItem_Name = s.LevelThreeItem_Name });
return Json(bl3_Items, JsonRequestBehavior.AllowGet);
}
There was nothing wrong with the ajax call to the controller.
I have a javascript function called when the page loads. It just gets some user data through an ajax call and checks some checkboxes based on the user id's returned.
window.onload=function(){
getBlockedUsers();
}
function getBlockedUsers(){
var deptID = $('deptID').value;
var request_data = 'DeptID='+deptID;
var req = new Request.JSON({
url:'/ajax/getuserData.cfm',
method: 'post',
noCahe: true,
data: request_data,
onSuccess: function(response)
{
var jLength = response.json.length;
for(i=0;i<jLength;i++){
var user_id = response.json[i].id;
if($('user_'+user_id)){
$('user_'+user_id).checked = true;
}
}
},
onFailure: function (xhr)
{
alert('There was an error while trying to fetch data');
},
onException: function (xhr)
{
alert('There was an exception while trying to fetch data');
}
}).send();
}
I keep getting the alert in the onFailure() function for some reason and when I inspect the ajax call, it appears to be aborted. This does not happen all the time. Happens in IE9.
I had the function call within domReady but moved to onload thinking it would help but it's still the same. Any ideas on why this might be happening would really help.
I have built a model from GET request and display the content that I need into a form, mainly dropdown options. User then completes the form and 'POST' back to the api. The API that I am using isn't formatted in a way that I can use for ember-data so I have opted to render my model with Ember.Object
var Prequalification = Ember.Object.extend();
Prequalification.reopenClass({
template: function(){
return Ember.$.ajax({
url: "/prequalification",
dataType: 'json'
}).then(function(response){
var template = response.collection.template.data;
return template;
});
}
});
export default Prequalification;
My controller decorates the view:
var IndexController = Ember.ArrayController.extend({
businessType: function(){
var content = this.get('content');
console.log(this);
return content.get(10);
}.property('content'),
loanType: function(){
var content = this.get('content');
return content.get(5);
}.property('content')
});
export default IndexController;
So on form submit, what are my options for Posting back to the API?
Thanks!
Use an action and associate it with a button.
actions: {
save: function(){
alert('ajax save here');
}
}
http://emberjs.jsbin.com/jositowa/1/edit
Hi all I have an app in Backbone where inside a function I want to convert price from GBP to EUR for example using a php file called with ajax.
In the success function I want to assign the converter data to my object.
But seems that not setting this because into the template uin underscore there is always the old value.
This is my function inside my model:
toJSON: function() {
var json = _.clone(this.attributes);
json.rooms = this.rooms.toJSON();
_.each(json.rooms, function(room){
var converter ="<?php echo(site_url('/backend/hotel/ajax_currency')); ?>";
$.ajax({
url: converter,
type: "POST",
data: {
from_currency : room.currency,
amount : room.price_adult
},
dataType: "json",
success: function(data) {
console.log(data);
room.price_adult = data;
}
});
});
return json;
},
I have also tried:
room.model.set('price_adult',data);
but return me error that don't find model.
How can I solve?
This is not a thing you want to put in toJSON function, I can think of several reason why it should work for you. The most important one is that toJSON function is synchronous and the AJAX response is async. so your render function is happening before you get the response from your ajax.
I would suggest having a Room model that will be responsible for the concurrency, and it's view will render it when ajax has returned and the price_adult is ready.
var Room = Backbone.Model.extend({
initialize:function(){
this.convertConcurrency();
},
convertConcurrency:function(){
var model = this;
$.ajax(.....,
success:function(data){
model.set("price_adult", data);
}
);
},
});
var RoomView = Backbone.View.extend({
initialize: function(){
this.listenTo(this.model, "change:price_adult", this.render);
if (this.model.has("price_adult")) this.render();
},
.....
});
var Rooms = Backbone.Collection.extend({...})
var RoomsView = // Rooms collection view
This way the view will be rendered only when there is a price_adult ready.
Maybe you should create a model on the client that gather the concurrency information from the server and compute the concurrency conversation by itself, so you will only have one ajax and the model will compute it for you instead of the server.
I wrote a simple snippet to load dynamically pages parts as follows:
function LoadParts(container) {
$("a._Part", container).each(function () {
element = $(this);
url = $(this).attr("href");
$.get(url, null, function (text, status) {
var c = $(element).parent("span");
c.html(text);
LoadParts(c);
});
});
}
I was tracing the traffic with Fiddler while I was browsing it using IE 8.0, and I saw a magic happens here, for some calls it used a cached value, and for some others got a fresh one.
You should be using the ajax method
http://api.jquery.com/jQuery.ajax/
$.ajax(url,
{
cache: false,
success: function(){
//do something
}
}
);