Javascript function consuming wcf method with a client side parameter - javascript

I've got a wcf service that returns me an array of items.
I've got a javascript method that recieves the items and handles them.
I want to send the javascript function another parameter from the client side, an id of an object on the page.
Something like this:
function WriteSonCategories(selectedCategoryId, callback) {
var d = new Date();
MyServices.GetSonCategories(selectedCategoryId,
d.getTime().toString(), callback );
}
I'd like the callback to be able to recieves a certain id, not just the array of objects returned from the service. How can this be achived?
Thank you!

Maybe Something like this.

Related

Retrieve Eloquent Model function in JavaScript

In Laravel, I have an Eloquent Model Person and a function getSomestringFromPerson() which is operating on the Model Person and returning a string. Now I have an AJAX request whose response is a collection of Persons. Until here I know what to do.
Now, in the JavaScript I would like do display the result of getSomestringFromPerson() for each Person in the response.
Is that possible? If yes, how? Or do I have to run the function in the Controller and include the result in the AJAX response? (That looks a bit cumbersome to me...)
In the controller that handles the AJAX request, I assume it gets a collection of People like something like this (at a bare minimum):
public function handleAjax(Request $request){
$people = People::get();
return response()->json(["people" => $people], 200);
}
And then in your JS a function for handling the response:
$.get(URL, function(data){
console.log(data); // Collection (js object) of `People` models.
});
In your handleAjax function, you would loop over each of your People and assign a property to hold the value of $person->getSomestringFromPerson():
foreach($people AS $person){
$person->someString = $person->getSomestringFromPerson();
}
Then, in your Javascript code, you would be able to access it like so:
for(var person in data.people){
console.log(data.people[person].someString); // Should return the expected value of `$person->getSomestringFromPerson();` as defined in your function.
}
From there, you should be able to do whatever else it is you'd need to do with your data.people object.

How to return an object which has a property of its own class in SignalR?

It seems like a Microsoft bug. If I try to return an object from a function in the server called by a client and the object has a circular reference to its own:
public class User
{
public User OtherUser;
}
public User GetUser()
{
User user = new User();
user.OtherUser = new User();
user.OtherUser.OtherUser = user;
return user.OtherUser;
}
The server function is recalled again and then the hub doesn't respond to further calls, anyone encountered this behavior? I turned into using an id of the object instead of a reference to the object to solve this.
You might consider an alternate model, employing both SignalR and Web API. SignalR is for pushing data to the client, right? What if the client is no longer there? In that case, it does not make sense to push a large object from the server out into the void where it will not be picked up.
An alternate approach is to use SignalR to push small pieces of information - e.g. a User ID - and then have the browser call back to a service (hence Web API) to get the larger payload when ready for it.
I think it's related to this problem of circular reference and Json.
A circular reference was detected while serializing an object of type 'SubSonic.Schema .DatabaseColumn'.

Best way of getting the key after $add

I am using angularFire v 0.5.0
On my returned object I do a $add.
What would be the best way to get the generated key?
It must be something in the succes callback of the $add, because the key will come back asynchrounlusly?
scope.settings = $firebase(ref);
scope.settings.value = {
vat: {
inclusive: true
}
}
}
scope.settings.$add (scope.settings.value).then( function ( {
scope.settings.key = ???
});
note: this is not the actual code, this is just to clarify the problem.
The actiual code is inside a factory in the loaded event, and there is a check if there is already a settings object inside the database.
This somewhat strange construct is to make it easyer for consumers of the factory to change the settings. The settings is a singleton. AngularFire does not return a array of objects, but every item is a object in the settings, with its own key.
$add returns a Firebase ref. Call name() on that ref.
scope.settings.$add(…).name();
See https://github.com/firebase/angularFire/blob/master/angularfire.js#L127.
from the angularfire docs:
The $add method takes a single argument of any type. It will append this value as a member of a list (ordered in chronological order). This is the equivalent of calling push(value) on a Firebase reference.
from the firebase docs (about push()):
Returns
A Firebase reference for the generated location.
so, i think the "key" that you want is the return value of the $add.
Maybe they've changed it in newer versions, now it works like this:
$add() will return a promise. You have to use the callback which runs on success. For example:
var something = $scope.somethings.$add({name: "foo"});
something.then(function(e) {
console.log(e.name())
});
This allows you to perform different actions based on the outcome of the save/write attempt to Firebase.

Updating the client view in Meteor js after a database insertion

First off, some background
My client has a kind of a "split-view", meaning- a side-panel displaying a list of objects and a main view displaying the selected object's details. Every time the user clicks on an Object in the list, a Backbone's route is called to navigate to the id which updates a "selected" property on the Session, what causes the main view to update- pretty standard stuff.
The problem
I want the client to be as responsive as possible, therefore i'm trying to utilize Meteor's abillity to update the client immediately without waiting for a server confirmation.
My goal is that every time an Object is created, the list and the main view will be instantly updated to reflect the newly added Object. To achieve this I created a Meteor.method, create(), that uses Collection.insert and returns the id so I can use it with my Route. The method is shared across the client and server and is being called from within a template's event handler.
My first try was to store the returned id in a variable in the event handler and update the Route in the next line; For some reason, that didn't work because the method returned an undefined value. So I tried a different approach, instead of returning the id, I used it within the method to update the Route directly (if Meteor.isClient of course). That didn't work either because the id returned by Collection.insert in the client's version of the method was different from the one in the server's version.
First approach
Template.createDialog.events({
'click #btn-dialog-create': function (event, template) {
var objectId = Meteor.call('create');
appRouter.navigate("object/id/" + objectId, {trigger:true});
}
});
Second approach
Meteor.methods({
create: function () {
var ObjectId = Objects.insert({name:'test'});
if(Meteor.isClient){
appRouter.navigate("object/id/" + objectId, {trigger:true});
}
}
});
If anyone knows what's going on and can give me some directions that would be great.
Any different approaches to the problem or suggestions would be much appreciated as well.
Thanks
Update
So I tried #Pent's suggestion and I got the same result as with my second approach. For some odd reason Meteor decides to ignore my id (created with Random.id()) and inserts the object with a different one.
So I tried another approach, I used just a simple string value instead of Random.id() and voila - it worked. Riddle me that.
Answer updated:
This will be both a client and server method:
Meteor.methods({
create: function () {
var id = Random.id();
Objects.insert({_id: id, name:'test'});
if(this.isSimulation) {
appRouter.navigate("object/id/" + id, {trigger:true});
}
}
});
You can view a similar pattern from Meteor's party example: https://github.com/meteor/meteor/blob/b28c81724101f84547c6c6b9c203353f2e05fbb7/examples/parties/model.js#L56
Your problem is coused by the fact that remote methods, i.e. those which will be called on the server, don't simply return any value. Instead, they accept a callback that will be used to process the returned value (see docs). So in your first example you should probably do something like this:
Template.createDialog.events({
'click #btn-dialog-create': function (event, template) {
Meteor.call('create', function (error, result) {
if (!error)
appRouter.navigate("object/id/" + result, {trigger:true});
});
}
});
You also said:
I want the client to be as responsive as possible, therefore i'm trying to utilize Meteor's abillity to update the client immediately without waiting for a server confirmation.
I think that in this case you should definitely wait for server response. Note, that there is no chance you get the correct object id unless this is given to you by the server.
One possible way to get around this issue is to create a local (client-side) collection:
// only on client
var temporary = new Meteor.Collection(null); // null name
in which you could store your "temporary" newly created objects, and then save them to the "real" collection after the user clicks the save button. You could implement your router to respond to urls like object/new/* to get access to these objects before they're saved to your database.
The correct answer for this question is defining a client side method that's responsible for creating the unique id (preferably using Random.id() ) and calling the Meteor.methods' create(). That way, you can have the id available immediately without waiting for the server to generate one. The trick here is to generate the id outside of the Meteor.method so that the id generation happens only once for both the stub and the actual server method.
create = function(){
var id = Random.id();
Meteor.call('create', id);
return id;
}
Meteor.methods({
create: function (id) {
Objects.insert({_id: id, name:'test'});
//more code...
}
});
//and in the Template...
Template.createDialog.events({
'click #btn-dialog-create': function (event, template) {
var objectId = create();
appRouter.navigate("object/id/" + objectId, {trigger:true});
}
});

how to set XHR returned from a method to a variable?

I'm Using CoffeeScript with Jquery. I've got a method named getVideoTitle that makes an ajax call to the youtube api to fetch the video title and returns the fetched video title. However, it is returning an object, whereas I just want a string returned. I want a string returned because I am using backbone.js and want to fire create to create the record on the backend.
#collection.create videoid: $('#url').val(), name: #getVideoTitle($('#url').val());
Please see an example here
How can I return a string back from this function?
getVideoTitle is asynchronous, it's probably returning the XHR object that is handling the request, and expecting a callback to call and receive the result.
So, you need to pass a callback to it, and get the result before creating the collection. Something like this:
id = $('#url').val()
#getVideoTitle id, (title) ->
#collection.create videoid: id, name: title
Relevant questions: https://stackoverflow.com/search?q=ajax+return+value
I'd recommend brushing up on your javascript skills before moving to CoffeeScript, otherwise you're in for a bumpy ride.

Categories