XPATH Expression fails in JQuery

I ran into a problem while trying to parse an XML string returned from an Ajax Call. The structure of the XML is as follows:

    <?xml version="1.0" encoding="UTF-8"?>
    <endPointDefs>
 <endPointDef>
  <useCaseId>USER_LOGIN</useCaseId>
  <endPointUrl>/core.authenticate.do</endPointUrl>
  <endPointUrlParams>
   <endPointUrlParam name="MsgFormat">
    <urlParamType>SYSTEM_DEFINED</urlParamType>
    <urlParamValueSystemDefined>USER_LOGIN</urlParamValueSystemDefined>
   </endPointUrlParam>
   <endPointUrlParam name="userId">
    <urlParamType>USER_PROVIDED</urlParamType>
   </endPointUrlParam>
   <endPointUrlParam name="password">
    <urlParamType>USER_PROVIDED</urlParamType>
   </endPointUrlParam>
   <endPointUrlParam name="language">
    <urlParamType>USER_PROVIDED</urlParamType>
   </endPointUrlParam>
  </endPointUrlParams>
 </endPointDef>
</endPointDefs>

However, I need the value for the tag for the useCaseId USER_LOGIN. A typical XPATH expression for this should like this:

/endPointDefs/endPointDef[useCaseId='USER_LOGIN']/endPointUrl

I stored the response from the ajax call in a javascript variable as follows:

var endPointDefs=null;

This variable is populated from an Ajax Call as follows:

    $.ajax(
   {
    type:"POST",
    url: "<%=request.getContextPath()%>/data/EndPointDefs.xml",
开发者_JS百科    dataType:"XML",
    success:function(data){
          //alert("End Points Loaded: " + data);
          endPointDefs=data;
        },
      error: function() {
         alert('an error occurred! which trying to fetch the end point definitions');
          }  
   }
    );

I tried to execute the XPATH query using JQuery as follows:

    $("endPointDefs/endPointDef[useCaseId='USER_LOGIN']/endPointUrl",endPointDefs).each(function(){
   $('#txtUseCase').val('USER_LOGIN');
   $('#txtEntryPointURL').val($(this).text());

  })

This is a modified version of what was show here: http://www.compoc.com/tuts/

Though, an alternative approach would be to iterate over all the endPointDef elements and inspect the value of the useCaseId and if it matches my string [USER_LOGIN], then, set the text in the text box. But, a more elegant approach would be to use an XPATH expression indicated above, which would give me the desired results in one shot.

I tried many combinations and nothing seems to work. Does JQuery support this kind of XPath queries? If so, can somebody please tell me where am I going wrong?

I think there are 2 things going on here: first, jQuery uses > as the direct-child selector, so you should use this instead of /. Second, you are using the endPointDefs xml as a context, which means that when jQuery starts looking for elements, it is already "in" the <endPointDefs> tag. In this tag, there are no <endPointDefs> tags, so it doesn't find any.

EDIT: also, to check for text in a tag, use the :contains() selector.

EDIT 2: Ah, now I see the endPointUrl is next to the useCaseId, not inside it.

The correct selector, I think, would be:

$("endPointDef>useCaseId:contains('USER_LOGIN')+endPointUrl",endPointDefs)

jQuery doesn't use XPath, but CSS-like selectors. Given that you only have one endPointUrl element, I would think you could use the following selector:

$("endPointUrl",endPointDefs)

Since you indicate that there can be more than one endPointUrl tag, I'd go for the following, which is more natural jQuery:

$('useCaseId', endPointDefs).filter(function(){
    return $.text(this) == 'USER_LOGIN';
}).next();

From http://docs.jquery.com/DOM/Traversing/Selectors#XPath_Selectors

Supported Predicates

1. [@foo] Has an attribute of foo

    $("//input[@checked]")
   

2. [@foo='test'] Attribute foo is equal to test

    $("//a[@ref='nofollow']")
   

3. [Nodelist] Element contains a node list, for example:

    $("//div[p]")
    $("//div[p/a]")