Archive

Posts Tagged ‘JQuery’

How to call a web service using jquery?

June 4, 2011 1 comment

JQury is a really powerful library which can be used to do many task. Its moto is do more write less to do more.
In this post I will explain you how to call a Webservice using JQuery.

You can call a webservice function from jQuery too, but it’s a lot more harder and lot less fun. Here’s how you can do that.

1. Decorate your web-service / pagemethod with the [WebMethod] attribute so that they serialize to JSON (jQuery does not support WSDL).
2. Make only POST requests.
3. Send an empty JSON variable to the web service if you don’t have any arguments.

The $.ajax function of jQuery can be used to make the request at the client end. Here’s a sample

$.ajax({ url: “/webservice.asmx/DoSomething”,
type: “post”,
data: “{}”,
contentType: “applicatin/json; charset=utf-8”,
dataType: “json”,
success: function(result) {
alert(msg.d);
},
error: function(err) {
alert(“error!”);
}
});

Notice that in the success callback function we the reference is to msg.d and not to the msg itself. This is because ASP.Net wraps the JSON serialized data in a variable called ‘d’. It’s a convention to improve data security.

Categories: JQuery Tags:

Access HTML Element using Javascript/JQuery

Java Script

There are two ways to access html element from javascript.

Let us suppose your HTML file has the following content.

<html>

<head>

</head>

<body>

<form >

<input type=”text” id=”txtusername” name=”txtusername” />

<input type=”password” id=”txtpassword” name=”txtpassword” />

<input type=”submit” value=”Submit” />

</form>

</body>

</html>

Then you can access any element using the code lines below

1.          var username=document.getElementById(“txtusername”).value;

2.          var username=  document.forms[0].txtusername.value;

I hope this was helpful to you.

 

JQuery

The code snippet below shows how to access html element from jquery.

Let us suppose your HTML file has following content.

<html>

<head>

/* add jquery library reference in your code.

If you haven’t yet downloaded it then you can download from http://docs.jquery.com/

*/

<script type=”text/javascript” src=”jquery1.4.2.js” />

</head>

<body>

<form >

<input type=”text” id=”txtusername” name=”txtusername” />

<input type=”password” id=”txtpassword” name=”txtpassword” />

<input type=”submit” value=”Submit” />

</form>

</body>

</html>

You can access any element using the below lines:

$(document).ready(function() // function called when page load is complete

{

$username=$(‘#txtusername’).val();

alert(“Hello ! Mr.  “+$username);

});

Hope this small bit of code was helpful to you.

Categories: JavaScript, JQuery Tags: ,

How to add JQuery support to CRM 2011?

Last night I spent couple of hours trying to debug a JQuery code in MS CRM 2011 which was not working as expected. After debugging I realized that JQuery native support is not available in microsoft CRM 2011. This was the exact reason why the Javascript was unable to recognize ‘$’ symbol and ribbion stopped showing on CRM 2011 page.  The easiest way to get this working is by creating a web resource and adding Jquery min file to it.

Do the following

  1. Go to http://jquery.comand then to Download
  2. find the latest Jquery min (select the minified version, at the time of writing http://code.jquery.com/jquery-1.6.1.min.js was the latest)
  3. Now go to CRM 2011 and create a web resource
  4. Add the new Web resource by name JQueryMin1.6.1 (JQuryMin<Verion>)
  5. Upload the Downloaded file to JQuery to this web resource.
  6. Now add this web resource to which ever form you want to use JQuery api

Hope this helps.

Categories: CRM 2011, JQuery Tags: ,
%d bloggers like this: