CSS Select Elements with Partial Id

CSS select elements with partial id

Not with ID selectors since they require complete ID names, but with substring attribute selectors:

div[id^="as_"]
div[id^="bs_"]

But since your elements have a class attribute anyway, why not add a common class to each group of elements and select by that class to make things simpler? You should be able to determine the grouping class using PHP as you do to generate the IDs.

Finding all elements by partial Id/Css, and putting them in a list, with Selenium in C#

There is a CSS selector which selects all elements whose attribute starts with a given string.

You can use it with By.CssSelector.

var events = driver.FindElements(By.CssSelector("[id^=event_]"));

It should work.

Find element by partial id and text?

CSS selectors will not find containing text, only XPath will do that. You can use the XPath below,

//span[contains(@id,'somePartialId')][.='Open']

You didn't specify the partial ID to look for so you'll have to fill that in yourself. I changed the contains() to equals for the containing text because you are a lot more likely to find more than you bargained for with contains(). I would suggest that you always use equals if it is the entirety of the contained text and only use contains() if it's partial text.

CSS selector (id contains part of text)

Try this:

a[id*='Some:Same'][id$='name']

This will get you all a elements with id containing

Some:Same

and have the id ending in

name

How to select elements using jQuery by partial ID and a class at the same time?

You can use the solution linked by you. However, that user has a space between the selectors, which means that you're targeting the descendant using the second selector.

In your specific case, you need to omit space like this.

var idenclassify = $("[id*=donkey].wonkey");

Is it possible to locate element by partial id match in Selenium

You can apply an ends-with CSS selector:

By.cssSelector("[id$=default-create-firstname]")

Update

Some time went by since the answer was posted. Here some update from the linked mozilla developer page and comments below:

New use By.css instead of By.cssSelector

By.css("[id$=default-create-firstname]")

Also see the four possibilities of

• beginning with
• anywhere inside
• anywhere inside regardless capitalization
• end with

/* Internal links, beginning with "#" */
a[href^="#"] {
  background-color: gold;
}

/* Links with "example" anywhere in the URL */
a[href*="example"] {
  background-color: silver;
}

/* Links with "insensitive" anywhere in the URL,
   regardless of capitalization */
a[href*="insensitive" i] {
  color: cyan;
}

/* Links that end in ".org" */
a[href$=".org"] {
  color: red;
}

jQuery - How do I find an element with partial ID under a specific element

use attribute selector:

Attribute selectors

Attribute selectors select an element using the presence of a given attribute or attribute value.

REF: https://developer.mozilla.org/en/docs/Web/CSS/Attribute_selectors

REF (more example here): https://www.w3schools.com/css/css_attribute_selectors.asp

$('input[id^=txtEntry]').css('background', 'green');


$('#RecordsWrapper')
  .on("click", "input[id^=cmdUpdate]", "input", function(e) {
    fldTarget = $(this);
    fldAccountID = fldTarget.parent().find("input[id^=txtAccount]").prop("id");
    console.log('fldAccountID-->' + fldAccountID);
  })

input[id^=txtAccount] {
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='RecordsWrapper'>
  <div id='Record001'>
    <input type='text' id='txtAccount_001'>
    <input type='text' id='txtEntry_001'>
    <input type='text' id='txtValue_001'>
    <input type='submit' id='cmdUpdate_001'>
  </div>
  <div id='Record002'>
    <input type='text' id='txtAccount_002'>
    <input type='text' id='txtEntry_002'>
    <input type='text' id='txtValue_002'>
    <input type='submit' id='cmdUpdate_002'>
  </div>
</div>