Develop Reference

Knockoutjs observable array to List<string>

I have searched high and low, and tried many different options, but can't figure out what is going wrong here.
I have a knockoutjs viewmodel, which looks like this:
{"Id":0,"Type":"post","Title":"adsf","AuthorId":0,"Description":"adsfadsf","ChosenCategoryValues":["7","8","9"]}
(some fields omitted for brevity)
Everything gets passed back to the controller just fine, except ChosenCategoryValues. That's an observableArray on the client side, a List<string> on the server side. It always comes back null, unles string with all the values in the first item which I would then have to string parse.
$.post("/serverurl", viewmodel, function (response) { do some stuff }, "json"); is how it's being sent to the server.
I've tried ko.toJS to make it a simple array, with no result.
I'm sure it's something basic, I'm new to knockoutjs, but I've been at this for far too long now, and none of the suggestions I've found online have been able to help.

In order to send view model data you should get view model data into JSON (remember - observables are simple functions), which is achieved via call to ko.toJSON() function.
Also you need to tell server, that you are sending JSON data. You can't achieve it with jQuery post() method - dataType parameter affects only expected server response type, but it does not affect request content type. So, simply use jQuery ajax() method:
$.ajax({
url: '/serverurl',
type: 'POST',
data: ko.toJSON(viewmodel),
contentType: 'application/json',
success: function(response) {
// do some stuff
}
});

As I commented above, you should use fiddler to look at the request. I suspect that your data isn't being sent as json. When your values are sent as ordinary html post values, the collection typically isn't mapped.
I'd suggest creating the actual json to be sent to the server with JSON.stringify as shown here:
$.post("/serverurl", JSON.stringify(viewmodel), function (response) { do some stuff }, "json");

Use jquery/ajax to call a c# (or any other .net) function in another project within the same solution

Does anyone know if it's possible to use jquery/ajax to call a c# (or any other .net) function in another project within the same solution?
Let's say that the solution's name is ExampleSolution , the name of the project from which I call the target function is Project.Source and the name of the target project is Project.Target,
and the name of the target function is TargetFunction().
I've tried following in an .js file in the Project.Source:
$.ajax({
url: '/ExampleSolution/Project.Target/TargetFunction',
type: 'get',
success: function (data) {
$(document.body).append(data);
}
});
Then I've modified the url-line in several ways but never succeed.
Do you have any advice?

Thank you all for your fast answers.
I found a solution for the problem and I'd like to share it just in case anybody faces the same problem in the future.
In the .js file before I call the $.ajax function I create a variable with help of window.location which points to the url to the targetfunction of the running target-project and use the variable in the ajax-function. So you don't point to another project. You point to url of running project.
Just as easy as it sounds.
Below follows the solution:
var url = window.location = 'http://localhost:13105/TargetFunction';
$.ajax({
url: url,
type: 'get',
success: function (data) {
$(document.body).append(data);
}
});
});

You can only call functions in the Code Behind because they're being registered by the web server.
If you want to have a function accessible outside the Code Behind it needs to be registered as a ASMX or WCF service.
See Creating and Consuming Your First WCF Service for setting up a WCF Service.
Once it is setup and running you can use Ajax to call the methods just like you would in the Code Behind.
$.ajax({
//Path to WCF Server and Target Method
url: "http://localhost:PORT/wcfsvc/FooService.svc/Foo",
type: 'get',
contentType: 'application/json; charset=utf-8',
success: function (data) {
$(document.body).append(data);
}
});
See also: Consuming WCF from jQuery as JSON

The short answer is "No, it isn't possible." Front-end code (like jQuery and AJAX) run on the client's machine, but C# functions are back-end and run on the server. There's no direct connection between them.
The longer answer is "Not directly, but there are ways to do something similar." Your easiest option is to use AJAX to POST to another controller/action on your server and then process the response. This is close to what you were doing, but you were slightly off. Rather than the url being a function, the url has to be an actual url on your website. Using /Functions/CallTargetFunction as an example, you would then create a controller like this:
public class FunctionsController : Controller
{
public ActionResult CallTargetFunction()
{
return Content(TargetFunction());
}
}
Note that doing this means anyone who visits http://yoursite.com/Functions/CallTargetFunction will get the result of that function.

Update SQL Database from client side in ASP.NET

I am kinda new in web development, looking for secured way to update SQL Database from the client side, or in other description updating the database without refreshing the webpage like (like facebook button).
I searched a lot and found that it can be done by using a web service and call it by javascript or using javascript direct or ajax, but which is the best and secured way and there is any other way to do it ?
thanks..

you can use ajax for updating database from client side.. Like if you click a button in web page, get the click event of that page through JavaScript or jQuery then through ajax you can perform database update. See the code below:
For catching event(like my button id is button1):
$('#<%=button1.ClientID%>').click(function{
$.ajax({
type: "POST",
url: "default.aspx/UpdateDatabase",
data: "{'textboxvalue':'" + $('<%=textbox1.ClientID%>').val() + "'}'
contentType: "application/json;charset=utf-8",
datatype: "json",
success: UpdateDone
});
});
In above code you have passed one value from a textbox1 to function UpdateDatabse in Default.aspx page(Please defined this function as [WebMethod]). then do your update in this function and return some string or bool value so that you can judge that update is done then value in success is name of function that will run if your function runs successfully so define that function in JavaScript or jQuery like
function UpdateDone(response)
{
if(response.d == 'done')
{ alert('Update is done'); }
else
{ alert('Sorry Update not done'); }
}
Above code will not do any postback you see that your value is updated in database. Please note that the function you make in C# page please mark it as WebMethod and it will be a static method, then only your JavaScript can find that function.
Hope this will resolve your problem.

The term ajax you use is correct but already a bit old. The new kids on the block are called SPA's where SPA stands for Single Page Application
It does what you want to achieve to the extreme: no more page refreshes. So it seems a good way to start
Here is The ASP.NET Single Page Application homepage
My advice is to research and invest time in one of the (many) javascript frameworks that will help you achieve this goal much faster. Hand coding javascript and make it work cross browser is too much work. The ASP.NET team choose upshot.js to solve your problem and it seems a fine choice.
Screenshot take from here

I found doing AJAX with JSON with ASP.NET MVC 3 to be easiest method of doing AJAX requests. Then you can have a specific action method that handles the request and makes the updates the database via Entity Framework(EF).
Essentially only passing the data that needs to be updated in the JSON. From there the MVC Action receives the JSON, and uses EF to lookup the DB record, apply/save changes. It can even respond with a success message which your AJAX can use to update some field that verifies the data was saved for the user(you could even do something where you have a "Saving..." message appear between the first ajax request and the response.)
This will allow you to send the request without refreshing your page. All your DB access code will be server side in the Action method.
This example shows how you might do a json request. You would modify this by adding additional code to the Create method to interact with entity framework(or your database tool of choice) to update a record based on the Person person parameter that was passed in(notice MVC did a really nice thing of converting the json data into a nice Person class!)
http://juristr.com/blog/2011/08/posting-json-data-to-aspnet-mvc-3-web/
If the data the user will enter in the webform is sensitive, you would need to encrypt it before sending the json request. I would personally just setup the website to use SSL. Anything you cook up on your own probably won't be as secure as SSL.
The code you add to the Create method might look like this:
//Find the person that they are attempting to edit
Person currentPerson = db.Persons.Find(person.PersonKey);
//update the database fields based on the submitted data(I would probably actually use AutoMapper for this
currentPerson.Name = person.Name;
currentPerson.DateOfBith = person.DateOfBirth;
//etc.
db.SaveChanges();
//compose a JSON response object indicating success, you would want to combine this with a try catch in the above to reply regarding failures as well

Ajax post web service url error

I am trying posting a data to a web service. And this service in a different project in same solution.
This project name is WebServices and web service's name is HastaTahlilUyariService.asmx.
My code is here:
$.ajax(
{
type: "POST",
url: "WebServices/HastaTahlilUyariService.asmx/f_HastaninAktarilacakAlislabTestleri",
data: "{_sTcKimlikNo:" + Cell.innerHTML + ",_iKlinikKodu:18001,_bAy:12,_iYil:2009}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
alert(msg);
},
error: function(msg) {
alert( 'hata'+ msg);
}
}
);
I think my url is wrong. How can i give correct url.
Thanks in advance...

You might want to change your url to something that isn't relative to where you are right now, such as url: '/WebServices/... (initial slash...)
Using the firebug addon for firefox, you can inspect the AJAX callback and see what exact URL is being requested. You can copy that URL, and you should be able to point your browser to the URL of the asmx (i.e. without the last parameter, which is the method name).
Other than that, you need to make sure you've uncommented the ScriptService attribute in the top few lines of the asmx code file. It is commented out by default, but it needs to be there to allow jQuery to access the webservice.

First of all: build your webservice, and configure it to run under something like http://localhost/services/myservice.asmx in IIS Configuration Manager. Open IIS Manager, rightclick on website -> New Virtual Directory; and navigate to the folder where your webservice is located. Name the virtual directory then services.
Then call the service with it's fully qualified url like http://localhost/myservice.asmx/function.
The most easy way to do what you are trying to do (well, I guess)
Create the method you want to call in your codebehind like
[WebMethod]
public static object MethodToCallFromAjax(string argument)
{
//do something
return result;
}
Then add a ScriptManager to your aspx page; and set enablePageMethods=true. Then call your method from JavaScript like:
PageMethods.MethodToCallFromAjax("argument value", function(msg) { alert(msg); });
edit: removed some stuff about json and asmx that wasn't true :-)

Another option to look into is the standard XMLHttpRequest object that is built into the browser (for IE 6 you have to use the ActiveX object with the same name). It makes calling XML services pretty easy, although you end up having to some of the SOAP formatting yourself.
Wikipedia entry for XMLHttpRequest

Getting Better Error Message From ASP.Net [WebMethod] Called From JQuery

[NOTE:I am really looking for some good debugging techniques here. Perhaps some tricks or ways to simplify things of which I am unaware.]
I am using the technique of calling [WebMethods] defined in an ASPX page from JQuery as mentioned here and here. It seems to be an increasingly common method.
I've been using it for a while and, in general, it works great. But while developing it is pretty fragile. Any incorrect parameter will result in a really vague, non-specific, error message. For instance, if I have a fairly complex web method defined as:
[WebMethod]
public static string SaveComplexRecord(int recID, GeneralData general, SomeObject data, SomeOtherObject moreData)
{
//do a bunch of stuff with that data
}
And GeneralData, SomeObject, and SomeOtherObject all have a mix of various types of parameters (strings, ints, bools, datetimes.) It is very likely, especially during initial development, that I will build the JSON on the client side incorrectly. Perhaps I will do this:
var data = {
recID: curID,
general:
{
a: aValue,
b: bValue,
c: cValue
},
data:
{
d: dValue,
e: eValue,
f: fValue
},
moredata:
{
g: gValue,
h: hValue,
i: iValue
}
};
Which will result in an error because the name of the third parameter is moreData, not moredata. And that's just an example, there could be any of a hundred other subtle typo-style errors.
If I were calling this method from C# the compiler would give me an error message something like "No overloaded method of SaveComplexRecord takes three parameters." or some other helpful message that points you in the right direction.
So... is there a way of getting ASP.Net to produce better error messages here?
Or is there some utility that will automatically build the JSON parameter structure of a [WebMethod] call? (just like you can automatically get the WSDL of a web service)
...or any other technique that I may be missing?
And for completeness here is how I call these WebMethods from JQuery:
var jsondata = $.toJSON(data);
$.ajax({
type: "POST",
url: "MyWebPage.aspx/SaveComplexRecord",
data: jsondata,
contentType: "application/json; charset=utf-8",
dataType: "json",
beforeSend: function(xhr)
{
xhr.setRequestHeader("Content-type",
"application/json; charset=utf-8");
},
success: function(msg)
{
//do something on success
},
error: function(XMLHttpRequest, textStatus, errorThrown)
{
alert("ERROR status:" + textStatus + " error:" + errorThrown);
}
});

Or is there some utility that will automatically build the JSON parameter structure of a [WebMethod] call? (just like you can automatically get the WSDL of a web service)
Yes! The ASP.Net AJAX framework can do this! You could get the framework to generate client side proxy classes for GeneralData, SomeObject and SomeOtherObject classes using the 'GenerateScriptType' attribute on a web service class.
See understanding asp net ajax web servcies for a very good article about the subject.
[Unfortunately, AFAIAA, the GenerateScriptType has no effect when applied to the Page class where your page method is defined - so you will have to add an .asmx purely to get the proxy generation.]
You could perhaps use these classes to build up the data structure that you then JSON stringify when you call .ajax? [One of (the very few) things I really like about the MS AJAX framework is the client side proxy generation: it really does make calling web services and page methods very easy. Having said that, I too am moving towards using jQuery in preference to MS AJAX.]
Or alternatively...
Your problem is really that the de-serialisation of the JSON data into the arguments of your page method is done transparently by the framework (which in most cases is a good thing) but when it goes wrong, the feedback you get is less-than-helpful. If you want to trap de-serialisation problems then I think you have to take control of the serialisation either by using custom JSON converters (see here) or by using the rather inelegant sledgehammer approach of having your method accept a string and de serializing the JSN yourself in the method - which is trivial with anyone of the numerous JSON libs out there.

Javascript is dynamically typed so you can't get a compile-time error. But you could use the old window.onerror + ajax trick (or send the error via ajax in the error callback of jQuery.ajax()), and once you're in the server you can treat it just like any other runtime error (throw an exception, log the error, whatever)

From a jQuery standpoint, your problem is in the error function declaration. Only take one input parameter, and that will have all properties of the error, then you can debug more easily.
If the problem is server side, catch the error there, and create return json containing the error message.
Oh, and if you DO want to check your javascript at compile time, I recommend the add-in from jslint.com.
So:
$.ajax({
type: "POST",
url: "MyWebPage.aspx/SaveComplexRecord",
data: jsondata,
contentType: "application/json; charset=utf-8",
dataType: "json",
beforeSend: function(xhr)
{
xhr.setRequestHeader("Content-type",
"application/json; charset=utf-8");
},
success: function(msg)
{
//do something on success
},
error: function(err)
{
alert(e.message);
}
});

What I do when returning JSON from a web service is have an object called "ret" containing an attribute "err" as well as the attribute "data" containing the result of the service call. Inside the web service I trap any exceptions and put the exception message on the "err" attribute. Then in the client I check for the "err" attribute being non empty, if it is I know that an error occurred.