CODEWITHSUNDEEP
ajaxjquery
Razort4x
Razort4x

Reputation: 3406

Passing ampersand to ajax with jquery?

I have this ajax call

 function addNewRemarksToDataBase(argRemark) {
            if (argRemark != '') {
                // if not blank
                $.ajax({
                    url: '../AutoComplete.asmx/AddNewRemarks',
                    type: 'POST',
                    timeout: 2000,
                    datatype: 'xml',
                    cache: false,
                    data: 'argRemarks=' + argRemark,
                    success: function (response) {
                        // update the field that is source of remarks
                        updateRemarksSource();
                    },
                    error: function (response) {
                    }
                });
            }
        };

The method is defined as

[WebMethod]
public void AddNewRemarks(string argRemarks)
{
    BAL.BalFactory.Instance.BAL_Comments.SaveRemarks(argRemarks, Globals.BranchID);
}

The problem is if a user enters something like long & elegant or something like smart & beautiful, something that contains &, I only get the first part before &, long (in the first case), smart (in the second one) (also notice the whitespace!)

I read in jquery ajax documentation that one should set processData to false, because it is something used for querystring or something. I added the 

processData: false

but I am still getting the term before the &. I don't want to use encodeURIComponent because it will turn the & to amp; (or something like that). What I need is the full value long & elegant, smart & beautiful that will be saved to the database. How can I do this?

EDIT Doing { argRemarks: argRemark } doesn't helps! The function doesn't event gets called. Running it with firebug, and setting breakpoint in error function, I got this 

[Exception... "Component does not have requested interface"  nsresult: "0x80004002 (NS_NOINTERFACE)"  location: "JS frame :: http://localhost:49903/js/jquery-1.8.1.min.js :: .send :: line 2"  data: no]"

UPDATE 2 : Doing 

data: 'argRemarks=' + encodeURIComponent(argRemark)

did the trick. But can anyone help me understand how does this works? I thought it would convert & to & but it didn't? The parameter I am receiving to the method now is just what I wanted, long & elegant, smart & beautiful, doesn't encodeURIComponent() converts special characters?

Upvotes: 3

Views: 3114

Answers (2)

11684
11684

Reputation: 7507

You have to URL-encode the string first:

data: 'argRemarks=' + encodeURIComponent(argRemark)

Upvotes: 3

Jon
Jon

Reputation: 437336

You do need to encode the argRemark. The easiest way to do this is to let jQuery do the job for you:

data: { argRemarks: argRemark }

This is different than data: 'argRemarks=' + argRemark in that by passing in an object, jQuery assumes that it needs to URL-encode the values of the properties on that object -- while if passing in a string, you are expected to have properly encoded it beforehand.

Upvotes: 7

Related Questions